Reputation: 5
I am trying to create a checkbox list like this: my plan
I used CheckBoxListTile
with dense
and contentPadding
to remove all possible paddings, and this is what I have:
my result
Is there any way to remove the extra "padding" between CheckBoxListTile
?
Here is my code (a single checkbox):
class Checklist extends StatefulWidget {
Checklist({@required this.content});
final String content;
@override
_ChecklistState createState() => _ChecklistState();
}
class _ChecklistState extends State<Checklist> {
bool _checked = false;
@override
Widget build(BuildContext context) {
return CheckboxListTile(
contentPadding: EdgeInsets.all(0),
//dense: true,
title: Text(widget.content, style: TextStyle(color: kBlackColor),),
value: _checked,
onChanged: (bool value) {
setState(() {
_checked = value;
});
},
controlAffinity: ListTileControlAffinity.leading,
activeColor: kBlackColor,
);
}
}
Multiple checkboxes:
Column(
children: [
Checklist(content: 'Develop an app'),
Checklist(content: 'Develop a good app'),
Checklist(content: 'Develop a really good app'),
],
),
Upvotes: 0
Views: 4764
Reputation: 650
wrap your CheckBox inside SizedBox will resize the padding of the check box
SizedBox(
height: whatYouWant,
width: whatYouWant,
child: Checkbox(...),
)
please check this solution: https://stackoverflow.com/a/59420505/11989529
Upvotes: 3