Flutter学习之旅-CheckboxListTitle

1.简介

• 带有复选框的ListTitle,带有标签的ListTitle.
• 整个列表图块是交互式的：点击图块中的任意位置可切换复选框；

2.基本用法

• 与Checkbox类似的命名属性，比如：onChanged 和 activeColor；
• 和ListTitle类似的命名属性，比如：title，subTitle，isThreeLine,dense;
• selected属性和ListTitle.selected属性相似，但使用的颜色activeColor属性，默认为当前Theme的颜色；
• onChange

3.示例代码

class CheckboxListTitleStateDefault extends StatefulWidget {
  const CheckboxListTitleStateDefault() : super();
  @override
    State createState() => _CheckboxListTileStateDefault();
}

class _CheckboxListTileStateDefault extends State {
  bool _value = false;
  void _valueChanged(bool value) {
    for (var i=0;iisChecks = [false,false,false,false];
  @override
    Widget build(BuildContext context) {
      return Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          Center(
            child: CheckboxListTile(
              value: _value,
              selected: true,
              onChanged: _valueChanged,
              dense: false,
              isThreeLine: false,
              title: Text('全部'),
              controlAffinity: ListTileControlAffinity.trailing,
              subtitle: Text('勾选下列全部结果'),
              secondary: Icon(Icons.archive),
              activeColor: Colors.red,
            ),
          ),
          Center(
            child: CheckboxListTile(
              value: isChecks[0],
              title: Text('选项1'),
              activeColor: _value ? Colors.red : Colors.green,
              controlAffinity: ListTileControlAffinity.platform,
              onChanged: (bool){
                if (mounted) {
                  setState(() {
                    isChecks[0] = bool;                  
                  });
                }
              },
            ),
          ),
          Center(
            child: CheckboxListTile(
              value: isChecks[1],
              title: Text('选项2'),
              activeColor: _value ? Colors.red : Colors.green,
              controlAffinity: ListTileControlAffinity.platform,
              onChanged: (bool){
                if (mounted) {
                  setState(() {
                    isChecks[1] = bool;                  
                  });
                }
              },
            ),
          ),
          Center(
            child: CheckboxListTile(
              value: isChecks[2],
              title: Text('选项3'),
              activeColor: _value ? Colors.red : Colors.green,
              controlAffinity: ListTileControlAffinity.platform,
              onChanged: (bool){
                if (mounted) {
                  setState(() {
                    isChecks[2] = bool;                  
                  });
                }
              },
            ),
          ),
          Center(
            child: CheckboxListTile(
              value: isChecks[3],
              title: Text('选项4'),
              activeColor: _value ? Colors.red : Colors.green,
              controlAffinity: ListTileControlAffinity.platform,
              onChanged: (bool){
                if (mounted) {
                  setState(() {
                    isChecks[3] = bool;                  
                  });
                }
              },
            ),
          ),
        ],
      );
    }
}