Flutter 如何左对齐切换按钮？

我在一列中有两个togglebutton，我想让第二个togglebutton左对齐到第一个togglebuttons，如果所有按钮的文本大小相同，这是代码，你可以看到第二个togglebuttons左边有更多空格的图像，你知道如何解决这个问题吗？代码如下：

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  const MyApp({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: SampleStateless());
  }
}

class SampleStateless extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('sample')),
      body: mybody(),
    );
  }

  Widget mybody() {
    return Column(
      children: [
        SizedBox(
          height: 20,
        ),
        Padding(
          padding: const EdgeInsets.only(bottom: 8.0),
          child: Text("Unicode Character Set:"),
        ),
        Padding(
          padding: const EdgeInsets.only(left: 20.0),
          child: ToggleButtons(
            isSelected: [false, true],
            children: [
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' Sample 1 '),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' Sample 2'),
              )
            ],
          ),
        ),
        SizedBox(
          height: 20,
        ),
        Padding(
          padding: const EdgeInsets.only(bottom: 8.0),
          child: Text("Show ABCD Wrting As ::"),
        ),
        Padding(
          padding: const EdgeInsets.only(left: 20.0),
          child: ToggleButtons(
            isSelected: [false, true],
            children: [
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' Sample 1 '),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' ABC '),
              )
            ],
          ),
        ),
      ],
    );
  }
}

---

我测试了您的代码，并将列的

crossAxisAlignment

设置为

crossAxisAlignment.start

。然后，我为标题添加了左填充，使其左对齐到togglebuttons小部件，如下面的代码：

class Test extends StatefulWidget {
  @override
  _TestState createState() => _TestState();
}

class _TestState extends State<Test> {
  int _currentIndex;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('sample')),
      body: mybody(),
    );
  }

  Widget mybody() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        SizedBox(
          height: 20,
        ),
        Padding(
          padding: const EdgeInsets.only(bottom: 8.0, left: 20.0),
          child: Text("Unicode Character Set:"),
        ),
        Padding(
          padding: const EdgeInsets.only(left: 20.0),
          child: ToggleButtons(
            isSelected: [false, true],
            children: [
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' Sample 1 '),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' Sample 2'),
              )
            ],
          ),
        ),
        SizedBox(
          height: 20,
        ),
        Padding(
          padding: const EdgeInsets.only(bottom: 8.0, left: 20.0),
          child: Text("Show ABCD Wrting As ::"),
        ),
        Padding(
          padding: const EdgeInsets.only(left: 20.0),
          child: ToggleButtons(
            isSelected: [false, true],
            children: [
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' Sample 1 '),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(' ABC '),
              )
            ],
          ),
        ),
      ],
    );
  }
}

类测试扩展StatefulWidget{
@凌驾
_TestState createState（）；
}
类_TestState扩展状态{
int currentIndex；
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar（标题：Text（'sample'）），
body:mybody（），
);
}
Widget mybody（）{
返回列(
crossAxisAlignment:crossAxisAlignment.start，
儿童：[
大小盒子(
身高：20，
),
填充物(
填充：仅限常量边集（底部：8.0，左侧：20.0），
子：文本（“Unicode字符集：”），
),
填充物(
填充：仅限常量边集（左：20.0），
子：切换按钮(
isSelected:[假，真]，
儿童：[
填充物(
填充：常数边集全部（8.0），
子项：文本（“示例1”），
),
填充物(
填充：常数边集全部（8.0），
子项：文本（'Sample 2'），
)
],
),
),
大小盒子(
身高：20，
),
填充物(
填充：仅限常量边集（底部：8.0，左侧：20.0），
子项：文本（“显示为：”，
),
填充物(
填充：仅限常量边集（左：20.0），
子：切换按钮(
isSelected:[假，真]，
儿童：[
填充物(
填充：常数边集全部（8.0），
子项：文本（“示例1”），
),
填充物(
填充：常数边集全部（8.0），
子项：文本（'ABC'），
)
],
),
),
],
);
}
}

`mainAxisAlignment:mainAxisAlignment.start`在专栏中使用此选项，将把所有的孩子都放到左边谢谢你的快速回复，我添加了mainAxisAlignment，它似乎仍然没有正确对齐，下面是更新的要点：我运行你的小部件。您希望它们的宽度相等，对吗？我希望第二行中的“sample1”按钮与第一行中的“sample1”左对齐，这是不正确的图像：您将第一个ToggleButton放在Padding内，Padding:const EdgeInsets。仅（左：20.0），，而不是第二行