CheckboxListTile
正在使用ListTile
它具有与 contentPadding 相同的填充,因此这不是问题,因为您将其设置为 0.0,但它还有一个名为 VisualDensity 的字段,您无法从中设置CheckboxListTile
。这个视觉密度继承自ThemeData
。所以你要么设置VisualDensity.compact
在你的主题中(你仍然无法完全删除你突出显示的空间,但它会更小,这取决于你当前的ThemeData
设置),或进行自定义LabeledCheckbox
像我一样具有完全灵活性的小部件,这并不难。
Edit:
我正在使用这个自定义LabeledCheckbox
小部件,您可以控制之间的间隙CheckBox
and Text
有场gap
,它还包裹着GestureDetector
因此它也会注册文本上的点击,而不仅仅是复选框本身。
class LabeledCheckbox extends StatelessWidget {
const LabeledCheckbox({
this.label,
this.contentPadding,
this.value,
this.onTap,
this.activeColor,
this.fontSize,
this.gap = 4.0,
this.bold = false,
});
final String label;
final EdgeInsets contentPadding;
final bool value;
final Function onTap;
final Color activeColor;
final double fontSize;
final double gap;
final bool bold;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () => onTap(!value),
child: Padding(
padding: contentPadding ?? const EdgeInsets.all(0),
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Checkbox(
value: value,
activeColor: activeColor,
visualDensity: VisualDensity.compact,
onChanged: (val) => onTap(val),
),
SizedBox(
width: gap,
), // you can control gap between checkbox and label with this field
Flexible(
child: Text(
label,
style: TextStyle(
fontSize: fontSize,
fontWeight: bold ? FontWeight.bold : FontWeight.normal,
),
),
),
],
),
),
);
}
}