如何在一行中对齐展开的小部件

Question

为什么前两个有效而第三个无效？？添加高度延伸到行的最大高度的垂直分隔线的替代方法是什么？

这两部作品

Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      // crossAxisAlignment: CrossAxisAlignment.stretch,
      children: [
        Container(
          child: Text('Kicukiro'),
        ),
        Container(width: 1,color: Colors.black,height: double.infinity,),
        Container(
          padding: EdgeInsets.symmetric(horizontal: 10),
            child: Text('Kicukiro'),
          )
      ],
    )

Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Expanded(
          child: Container(
            child: Text('Kicukiro'),
          ),
        ),
        // Container(width: 1,color: Colors.black,height: double.infinity,),
        Expanded(
          child: Container(
            padding: EdgeInsets.symmetric(horizontal: 10),
              child: Text('Kicukiro'),
            ),
        )
      ],
    )

这行不通

Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Expanded(
          child: Container(
            child: Text('Kicukiro'),
          ),
        ),
        Container(width: 1,color: Colors.black,height: double.infinity,),
        Expanded(
          child: Container(
            padding: EdgeInsets.symmetric(horizontal: 10),
              child: Text('Kicukiro'),
            ),
        )
      ],
    )

Answer 1

在最后一个屏幕截图中，请在 Expanded 小部件下添加 Container。在 Row 小部件下使用 children 属性。

这是一个示例代码

 Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
        Expanded(
          flex: 5,
          child: Padding(
            padding: EdgeInsets.all(10.0),
            child: Center(
              child: Text(
                'This is question',
                style: TextStyle(
                  fontSize: 25.0,
                  color: Colors.white,
                ),
              ),
            ),
          ),
        ),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(10.0),
          child: FlatButton(
            //textColor: Colors.white,
            color: Colors.green,
            child: Text(
              'True',
              style: TextStyle(color: Colors.white, fontSize: 20.0),
            ),
            onPressed: () {},
          ),
        )),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(10.0),
          child: FlatButton(
            //textColor: Colors.white,
            color: Colors.red,
            child: Text(
              'False',
              style: TextStyle(color: Colors.white, fontSize: 20.0),
            ),
            onPressed: () {},
          ),
        )),
      ]

Answer 2

第三个是真的，其实它在一个SingleChildScrollView中的存在就产生了问题它通过将 SizedBox 放在 Row 中并给它高度来固定此问题的原因是 container 的高度大小，它由 double.infinity 确定，并且由于它存在于 SingleChildScrollView 中，它会无限期地继续并产生错误。

   SingleChildScrollView(
        child: SizedBox(
          height: 250,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
               Expanded(child: Container(child: Text("Kicukiro"))),
               Container(
                 width: 1,color: Colors.black,height: double.infinity,
               ),
               Expanded(child: Container(
                 padding: EdgeInsets.symmetric(horizontal: 10),
                   child: Text("Kicukiro"))),
            ],
          ),
        ),
      ),

Answer 3

测试一下，它会起作用

 IntrinsicHeight(
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                     Expanded(
                       child: Container(
                           child: const Text("Kicukiro", style: TextStyle(fontSize: 52),)),
                     ),
                    Container(color:Colors.black, width: 1),
                     Expanded(
                       child: Container(
                         padding: const EdgeInsets.symmetric(horizontal: 10),
                           child: const Text("Kicukiro", style: TextStyle(fontSize: 52),)),
                     ),
                  ],
                ),
              ),

如何在一行中对齐展开的小部件

How to align expanded widgets in a row

flutter

flutter-layout