单选开关和复选框

Material 组件库中的单选开关 Switch 和复选框 Checkbox，它们本身不会保存选中状态，但它们被点击时，会触发 onChange 回调

单选开关 Switch

class SwitchPage extends StatefulWidget {
  @override
  _SwitchState createState() => _SwitchState();
}

class _SwitchState extends State<SwitchPage> {
  bool _checked = false; // 维护单选开关状态

  @override
  Widget build(BuildContext context) {
    return Switch(
      value: _checked, // 当前状态
      onChanged: (value) => setState(() {
        _checked = value;
      }),
    );
  }
}

比较有用的属性

• activeColor：激活状态按钮背景色，及块背景色（按钮背景色弱化色值）
• inactiveThumbColor：未激活状态按钮背景色
• inactiveTrackColor：未激活状态块背景色

Switch(
  value: _checked,
  onChanged: (value) => setState(() {
    _checked = value;
  }),
  activeColor: Colors.orange,
  inactiveThumbColor: Colors.red,
  inactiveTrackColor: Colors.green,
),

复选框 Checkbox

class CheckboxPage extends StatefulWidget {
  @override
  _CheckboxState createState() => _CheckboxState();
}

class _CheckboxState extends State<CheckboxPage> {
  bool _checked = false; // 维护单选开关状态

  @override
  Widget build(BuildContext context) {
    return Checkbox(
      value: _checked, // 当前状态
      onChanged: (value) => setState(() {
        _checked = value ?? !_checked;
      }),
    );
  }
}

比较有用的属性

• activeColor：激活状态颜色
• tristate：是否有三态。若值为 true，添加一个状态 null