Tinyrack

Checkbox

Collect a binary or mixed selection with controlled, uncontrolled, and Flutter Form APIs.

Collect a binary or mixed selection with controlled, uncontrolled, and Flutter Form APIs.

Contract

AxisContract
SelectionUnchecked, checked, or indeterminate for a partially selected set.
State ownershipUse defaultChecked for local state or checked with onCheckedChange for controlled state.
AvailabilityreadOnly keeps focus and the form value; disabled blocks interaction and leaves TRFormValues.
Sizemd or lg; the default is md.
FormsTRCheckboxFormField supports validation, save, reset, restoration, and explicit checked or unchecked values.

Give every checkbox a visible label or semanticLabel. Use TRCheckboxFormField when validation, saving, reset, or named TRFormValues are required.

Install

Add the package, then import its public library.

flutter pub add tinyrack_ui
import 'package:tinyrack_ui/tinyrack_ui.dart';

Playground

Usage

import 'package:material_ui/material_ui.dart';
import 'package:tinyrack_ui/tinyrack_ui.dart';

class BackupChoice extends StatefulWidget {
  const BackupChoice({super.key});

  @override
  State<BackupChoice> createState() => _BackupChoiceState();
}

class _BackupChoiceState extends State<BackupChoice> {
  bool enabled = true;

  @override
  Widget build(BuildContext context) => Row(
    mainAxisSize: MainAxisSize.min,
    spacing: TRSpacing.small,
    children: [
      TRCheckbox(
        checked: enabled,
        semanticLabel: 'Enable backups',
        onCheckedChange: (value) => setState(() => enabled = value),
      ),
      const TRText('Enable backups', variant: TRTextVariant.bodySm),
    ],
  );
}

Examples

Unchecked, checked, and mixed permalink

Use indeterminate only when the checkbox summarizes a partially selected set.

Medium and large permalink

Match md or lg to the density of nearby controls.

Editable, read only, and disabled permalink

Read-only controls keep focus and form values; disabled controls do neither.

Required choice and recovery permalink

Use TRCheckboxFormField to validate an agreement and show the invalid control state.

Explicit on and off values permalink

Register a name and choose the value TRFormValues collects for each state.

API

Selection and interaction

PropType / defaultPurpose
checked, defaultCheckedbool?, bool = falseControl or initialize selection.
indeterminatebool = falseShow a partially selected set. Clear it when the choice is resolved.
onCheckedChangeValueChanged<bool>?Report an attempted selection change.
disabled, readOnlybool = falseRemove interaction or keep a focusable immutable value.
uiSize, semanticLabelTRUiSize, String?Set the control size and accessible name.

Form field

PropType / defaultPurpose
initialValue, namebool = false, String?Initialize the field and register a named TRFormValues entry.
checkedValue, uncheckedValueObject? = true, falseChoose the values collected for checked and unchecked states.
validator, onSaved, onResetFormField callbacksParticipate in Flutter validation, save, and reset lifecycles.
autovalidateMode, restorationIdFlutter FormField optionsConfigure automatic validation and state restoration.