在 Flutter 中将一行分成相等的两半

Posted 2023-02-23

【中文标题】在 Flutter 中将一行分成相等的两半

【英文标题】：Divide a Row into two equal halves in Flutter

【发布时间】：2021-05-02 18:40:38

【问题描述】：

我在卡片中有一个 Row 小部件，我想将 Row 完美地划分为卡片宽度的一半，并在每一半中放置一些居中的文本。因此，必须固定一半的行间距，并且每个文本必须在它所在的一半居中。这是一个例子：

有什么想法吗？

【问题讨论】：

您是否尝试过获得上述功能？请附上您已经尝试过的代码。

【参考方案1】：

试试这个

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    Expanded(child: Center(child: TextButton(...))),
    VerticalDivider(width: 1.0),
    Expanded(child: Center(child: TextButton(...))),
  ],
),

【讨论】：

几乎......使用中心小部件，它可以工作。 Expanded(child: Center(child: TextButton(...))),。谢谢！

【参考方案2】：

就我而言，我是这样尝试的

 @override
  Widget build(BuildContext context) 
    final _screen =  MediaQuery.of(context).size;
    return Column(
      children: [
        Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: _screen.width * 0.45,
                child: ...
              ),
              VerticalDivider(width: 1.0),
              Container(
                width: _screen.width * 0.45,
                child: ...
              ),
          ]
        ),
      ],
    );