【问题标题】:Divide a Row into two equal halves in Flutter在 Flutter 中将一行分成相等的两半
【发布时间】:2021-05-02 18:40:38
【问题描述】:

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

有什么想法吗?

【问题讨论】:

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

标签: flutter layout widget flutter-layout flutter-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: ...
              ),
          ]
        ),
      ],
    );
  }

【讨论】:

    猜你喜欢
    • 2022-06-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-07-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多