Flutter中如何缩小RadioListTile间距并左移单选按钮

针对你遇到的RadioListTile间距过大、无法左偏移的问题，仅通过RadioListTile自身属性即可解决，具体调整如下：

1. 缩小垂直间距 #

给每个RadioListTile添加visualDensity属性，通过调整垂直密度压缩上下间距。示例值vertical: -4可根据实际需求微调，数值越小间距越紧凑：

visualDensity: const VisualDensity(vertical: -4)

2. 实现向左偏移 #

修改contentPadding属性，替换默认的左右对称内边距，设置仅左侧小内边距即可实现左偏移：

contentPadding: const EdgeInsets.only(left: 8.0)

修改后的完整代码 #

Column(
  children: [
    RadioListTile<DateTime>(
      activeColor: Colors.white,
      visualDensity: const VisualDensity(vertical: -4), // 缩小垂直间距
      contentPadding: const EdgeInsets.only(left: 8.0), // 向左偏移
      title: Text(
        "Today",
        style: Theme.of(context).textTheme.bodyMedium,
      ),
      value: today,
      groupValue: selectedMatchDateFilter,
      onChanged: (DateTime? value) => setState(() {
        selectedMatchDateFilter = value;
      }),
    ),
    RadioListTile<DateTime>(
      activeColor: Colors.white,
      visualDensity: const VisualDensity(vertical: -4),
      contentPadding: const EdgeInsets.only(left: 8.0),
      title: Text(
        "Tomorrow",
        style: Theme.of(context).textTheme.bodyMedium,
      ),
      value: DateTime(DateTime.now().year, DateTime.now().month, DateTime.now().day + 1),
      groupValue: selectedMatchDateFilter,
      onChanged: (DateTime? value) => setState(() {
        selectedMatchDateFilter = value;
      }),
    ),
    RadioListTile<DateTime>(
      activeColor: Colors.white,
      visualDensity: const VisualDensity(vertical: -4),
      contentPadding: const EdgeInsets.only(left: 8.0),
      title: Row(
        children: [
          DropdownButton2<String>(
            isExpanded: true,
            buttonHeight: 30.h,
            buttonWidth: 220.w,
            items: const [
              DropdownMenuItem<String>(
                value: "",
                child: Text("Till Date"),
              ),
              DropdownMenuItem<String>(
                value: "",
                child: Text("Precise Date"),
              ),
            ],
          ),
          1 == 2
              ? Checkbox(
                  value: true,
                  onChanged: (bool? _value) {},
                )
              : IconButton(
                  icon: const Icon(Icons.calendar_today),
                  onPressed: () => showDatePicker(
                    context: context,
                    initialDate: DateTime.now(),
                    firstDate: DateTime(2022, 11, 16),
                    lastDate: DateTime(2023, 1, 1),
                  ),
                ),
        ],
      ),
      value: DateTime.now(),
      groupValue: selectedMatchDateFilter,
      onChanged: (value) {},
    )
  ],
),

内容的提问来源于stack exchange，提问作者Chaitya Vohera