1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > flutter 全选_Flutter笔记19:CheckBoxListTitle复选框实现全选全不选

flutter 全选_Flutter笔记19:CheckBoxListTitle复选框实现全选全不选

时间:2021-12-02 04:24:27

相关推荐

flutter 全选_Flutter笔记19:CheckBoxListTitle复选框实现全选全不选

CheckBoxListTitle复选框是比CheckBox更加强大的复选框,当然,CheckBoxListTitle实现的效果,用CheckBox也能实现,只不过布局更加麻烦点。这里是用CheckBoxListTitle实现全选全不选的一个简单案例:

class DemoPage extends StatefulWidget {

DemoPage({Key key}) : super(key: key);

@override

_DemoPageState createState() => _DemoPageState();

}

class _DemoPageState extends State {

var _value = false;

void _valueChanged(bool value) {

for (var i = 0; i < isChecks.length; i++) {

isChecks[i] = value;

}

setState(() {

_value = value;

});

}

bool isCheck = false;

List isChecks = [false, false, false];

@override

Widget build(BuildContext context) {

return Column(

children: [

Center(

child: CheckboxListTile(

value: _value,

//默认文字是否高亮

selected: true,

onChanged: _valueChanged,

//文字图标是否对其

dense: false,

//文字是否三行显示

isThreeLine: false,

title: Text('全选/全不选'),

//复选框和文字的位置,leading是复选框在文字前,platform和trailing是复选框在文字后

controlAffinity: ListTileControlAffinity.leading,

//子标题

subtitle: Text('勾选下列选项'),

//左侧小图标

secondary: Icon(Icons.archive),

//选中颜色

activeColor: Colors.red,

),

),

SizedBox(

height: 20.0,

),

CheckboxListTile(

value: isChecks[0],

onChanged: (bool val) {

setState(() {

isChecks[0] = val;

});

},

//文字图标是否对其

dense: false,

//文字是否三行显示

isThreeLine: false,

title: Text('足球'),

//复选框和文字的位置,leading是复选框在文字前,platform和trailing是复选框在文字后

controlAffinity: ListTileControlAffinity.leading,

//选中颜色

activeColor: _value ? Colors.red : Colors.green,

),

CheckboxListTile(

value: isChecks[1],

onChanged: (bool val) {

setState(() {

isChecks[1] = val;

});

},

//文字图标是否对其

dense: false,

//文字是否三行显示

isThreeLine: false,

title: Text('乒乓球'),

//复选框和文字的位置,leading是复选框在文字前,platform和trailing是复选框在文字后

controlAffinity: ListTileControlAffinity.leading,

//选中颜色

activeColor: _value ? Colors.red : Colors.green,

),

CheckboxListTile(

value: isChecks[2],

onChanged: (bool val) {

setState(() {

isChecks[2] = val;

});

},

//文字图标是否对其

dense: false,

//文字是否三行显示

isThreeLine: false,

title: Text('篮球'),

//复选框和文字的位置,leading是复选框在文字前,platform和trailing是复选框在文字后

controlAffinity: ListTileControlAffinity.leading,

//选中颜色

activeColor: _value ? Colors.red : Colors.green,

),

],

);

}

}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。