如何在Container中垂直居中对齐ListTile且保持水平左对齐

方法一：调整ListTile内边距并设置容器对齐 #

ListTile默认自带上下左右内边距，再加上你的容器高度仅35，导致内容无法垂直居中。通过以下两步修复：

• 给Container添加alignment: Alignment.centerLeft，确保子组件垂直居中且水平左对齐
• 给ListTile设置contentPadding: EdgeInsets.zero（可按需微调），移除默认内边距

修改后的完整代码：

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('Expanded Column Sample'),
    ),
    body: Center(
      child: Column(
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 25, vertical: 15),
            child: InkWell(
              onTap: () {},
              child: Container(
                height: 35,
                width: double.infinity,
                alignment: Alignment.centerLeft, // 新增：设置容器内对齐方式
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(8.0),
                  gradient: const LinearGradient(
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter,
                    colors: [Color(0xFFfe4a32), Color(0xFFcf1502)],
                  ),
                ),
                child: ListTile(
                  contentPadding: EdgeInsets.zero, // 新增：移除ListTile默认内边距
                  title: const Text(
                    "Some text",
                    style: TextStyle(
                      fontSize: 15.0,
                      color: Color(0xFFfe4a32),
                      fontWeight: FontWeight.w500),
                  ),
                  trailing: const Icon(
                    Icons.arrow_drop_down_outlined,
                    color: Color(0xFFfe4a32),
                    size: 35,
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    ),
  );
}

方法二：用Row替代ListTile（更灵活控制布局） #

如果ListTile的默认样式限制过多，可直接用Row实现相同效果，完全自定义内边距与对齐：

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('Expanded Column Sample'),
    ),
    body: Center(
      child: Column(
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 25, vertical: 15),
            child: InkWell(
              onTap: () {},
              child: Container(
                height: 35,
                width: double.infinity,
                padding: const EdgeInsets.symmetric(horizontal: 16), // 自定义左右内边距
                alignment: Alignment.centerLeft,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(8.0),
                  gradient: const LinearGradient(
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter,
                    colors: [Color(0xFFfe4a32), Color(0xFFcf1502)],
                  ),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: const [
                    Text(
                      "Some text",
                      style: TextStyle(
                        fontSize: 15.0,
                        color: Color(0xFFfe4a32),
                        fontWeight: FontWeight.w500),
                    ),
                    Icon(
                      Icons.arrow_drop_down_outlined,
                      color: Color(0xFFfe4a32),
                      size: 35,
                    ),
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    ),
  );
}

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