Checkbox Group

個別に切り替えられる複数の値を、controlled・uncontrolled・名前付きフォームフィールドとしてまとめて管理します。

主なプロパティ

各 TRCheckbox に固有の value と表示ラベルを指定してください。MergeSemantics でチェックボックスと隣接ラベルを 1 つのセマンティック単位にまとめます。

インストール

パッケージを追加し、公開ライブラリをインポートしてください。

flutter pub add tinyrack_ui

import 'package:tinyrack_ui/tinyrack_ui.dart';

プレイグラウンド

使用方法

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

TRCheckboxGroup(
  defaultValue: const ['metrics'],
  onValueChange: setValues,
  children: const [
    MergeSemantics(
      child: Row(
        mainAxisSize: MainAxisSize.min,
        spacing: TRSpacing.small,
        children: [
          TRCheckbox(value: 'metrics'),
          TRText('Metrics', variant: TRTextVariant.bodySm),
        ],
      ),
    ),
    MergeSemantics(
      child: Row(
        mainAxisSize: MainAxisSize.min,
        spacing: TRSpacing.small,
        children: [
          TRCheckbox(value: 'alerts'),
          TRText('Alerts', variant: TRTextVariant.bodySm),
        ],
      ),
    ),
  ],
)

例

API