android - Flutter:为 ButtonBar 中的两个按钮提供相等的宽度，并为长文本提供动态高度

Question

下面是我的简单用例:我想要两个水平相邻的按钮。在 native android(这是我来自的地方)中，我会把它们放在 LinearLayout 中，并给它们每个权重 1，并将它们的高度设置为 wrap_content。

现在，我在 ButtonBar 小部件中放置了两个 RaisedButton，但是在我运行该应用程序的地方，我可以看到第二个被剪裁了。我希望它们的间距相等，并根据文本具有动态高度。我怎样才能在 flutter 中实现同样的目标？以下是我到目前为止所做的尝试:

import 'package:flutter/material.dart';

class NewScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
            automaticallyImplyLeading: true,
            title: Text("Building layouts"),
            leading: IconButton(
              icon: Icon(Icons.arrow_back),
              onPressed: () => Navigator.pop(context, false),
            )),
        body: myLayoutWidget(),
      ),
    );
  }
}

// replace this method with code in the examples below
Widget myLayoutWidget() {
  return Container(
    child: Column(
      children: <Widget>[
        ButtonBar(
          children: <Widget>[
            RaisedButton(
              onPressed: () {},
              child: Text("Very long text button",),
            ),
            RaisedButton(
              child: Text("Very very very very long text button"),
              color: Colors.red,
              onPressed: () {},
            )
          ],
        ),
      ],
    ),
  );
}

现在是这样的:

Answer 1

尝试使用 Row 而不是 Button Bar 并将按钮添加到 Expanded parent

Widget myLayoutWidget() {
  return Container(
    child: Row(

      children: <Widget>[
        Expanded(
          child: RaisedButton(
            onPressed: () {},
            child: Text("Very long text button",),
          ),
        ),
        Expanded(
          child: RaisedButton(
            child: Text("Very very very very long text button"),
            color: Colors.red,
            onPressed: () {},
          ),
        )
      ],
    ),
  );
}