Flutter RadioListTile：如何缩小单选图标与标题之间的间距？

RadioListTile的图标和标题间距是组件内部默认的，contentPadding只能调整整个Tile的内外边距，没法直接修改二者之间的空隙，你可以试试以下几种可行方案：

方案一：自定义Row结构替代RadioListTile #

直接用Row包裹Radio组件和文本，完全自定义间距，这是最灵活的方式：

Container(
  padding: const EdgeInsets.only(top: 12, bottom: 12, left: 5),
  color: (currentValue == values[0]) ? Color(0xffececec) : Colors.transparent,
  child: Row(
    children: [
      Radio(
        value: values[0],
        groupValue: currentValue,
        onChanged: (value) {
          setState(() {
            currentValue = value.toString();
          });
        },
      ),
      // 直接调整SizedBox的width来控制图标与标题的间距
      const SizedBox(width: 8), 
      Text(
        "Tap Payment",
        style: GoogleFonts.poppins(
          color: Color(0xff000000),
          fontSize: 16,
          fontWeight: FontWeight.w500,
          letterSpacing: 0.5,
        ),
      ),
    ],
  ),
)

方案二：通过Theme修改Radio的默认内边距 #

Radio组件本身带有默认的padding，我们可以通过Theme局部覆盖这个属性：

RadioListTile(
  contentPadding: const EdgeInsets.only(top: 12, bottom: 12, left: 5),
  title: Text(
    "Tap Payment",
    style: GoogleFonts.poppins(
      color: Color(0xff000000),
      fontSize: 16,
      fontWeight: FontWeight.w500,
      letterSpacing: 0.5,
    ),
  ),
  value: values[0],
  groupValue: currentValue,
  onChanged: (value) {
    setState(() {
      currentValue = value.toString();
    });
  },
  tileColor: (currentValue == values[0]) ? Color(0xffececec) : Colors.transparent,
  controlAffinity: ListTileControlAffinity.leading,
  // 局部修改Radio的Theme，缩小水平占用空间
  theme: Theme.of(context).copyWith(
    radioTheme: RadioThemeData(
      visualDensity: VisualDensity(horizontal: -4, vertical: 0),
      // 也可以直接设置padding：padding: EdgeInsets.only(right: 8),
    ),
  ),
)

VisualDensity的horizontal值越小，Radio占用的水平空间越小，就能拉近和标题的距离。

方案三：用Transform平移Radio位置 #

通过Transform.translate让Radio向右偏移，缩小和标题的间距：

RadioListTile(
  contentPadding: const EdgeInsets.only(top: 12, bottom: 12, left: 5),
  title: Text(
    "Tap Payment",
    style: GoogleFonts.poppins(
      color: Color(0xff000000),
      fontSize: 16,
      fontWeight: FontWeight.w500,
      letterSpacing: 0.5,
    ),
  ),
  value: values[0],
  groupValue: currentValue,
  onChanged: (value) {
    setState(() {
      currentValue = value.toString();
    });
  },
  tileColor: (currentValue == values[0]) ? Color(0xffececec) : Colors.transparent,
  controlAffinity: ListTileControlAffinity.leading,
  // 替换默认Radio，添加平移调整位置
  radio: Transform.translate(
    offset: const Offset(10, 0), // 向右偏移10，根据需求调整数值
    child: Radio(
      value: values[0],
      groupValue: currentValue,
      onChanged: (value) {
        setState(() {
          currentValue = value.toString();
        });
      },
    ),
  ),
)

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