Flutter中如何实现可点击组件/按钮内文本的左对齐

嘿，我明白你遇到的小麻烦啦！ElevatedButton 默认会把它的子组件（也就是你写的Text）居中对齐，所以你单独给Text设置textAlign: TextAlign.left是看不到效果的——因为Text本身的宽度只刚好够容纳文字，根本没有多余的空间让文字“左对齐”嘛😅

给你两种简单的解决方案，随便选哪种都能搞定：

方法一：让Text占满按钮宽度 #

给Text外面套一个Container，设置它的宽度为double.infinity，这样Text就能填满按钮的可用空间，此时设置textAlign就生效了：

Container(
  margin: EdgeInsets.all(10),
  child: ElevatedButton(
    style: ElevatedButton.styleFrom(
      primary: greyColor,
      minimumSize: Size(300, 60)),
    child: Container(
      width: double.infinity,
      child: Text('Voreinstellung Parkplatz', textAlign: TextAlign.left),
    ),
    onPressed: () => tuNix(),
  ),
)

方法二：直接修改按钮内容的对齐方式 #

更简洁的方式是在ElevatedButton.styleFrom()里直接设置alignment属性，指定按钮内容左对齐，这样连Text的textAlign都不用写了：

Container(
  margin: EdgeInsets.all(10),
  child: ElevatedButton(
    style: ElevatedButton.styleFrom(
      primary: greyColor,
      minimumSize: Size(300, 60),
      alignment: Alignment.centerLeft, // 直接指定内容左对齐
    ),
    child: Text('Voreinstellung Parkplatz'),
    onPressed: () => tuNix(),
  ),
)

两种方法都能达到你想要的效果，选顺手的用就行～

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