dart - 在卡片中定位按钮。 flutter

标签 dart flutter

我在 Flutter 的卡片中定位 2 个按钮时遇到了一些麻烦。 我有这个:
before

但我想要这个:
after

这张卡的按钮代码是:

new ButtonTheme.bar(
    child: new ButtonBar(
      alignment: MainAxisAlignment.start,
      children: <Widget>[
        Row(
          children: <Widget>[
            Column(
              children: <Widget>[
                new FlatButton(
                  child: Icon(
                    Icons.share,
                    color: Colors.white,
                  ),
                  color: Color.fromRGBO(68, 153, 213, 1.0),
                  shape: CircleBorder(),
                  onPressed: () {
                    Share.share(
                      data[index]["link"],
                    );
                  },
                ),
              ],
            ),
            Column(
              children: <Widget>[
                FlatButton(
                  color:
                  Color.fromRGBO(161, 108, 164, 1.0),
                  child: const Text('Read Article'),
                  shape: new RoundedRectangleBorder(
                      borderRadius:
                      new BorderRadius.circular(
                          30.0)),
                  textColor: Colors.white,
                  onPressed: () {
                    launch(data[index]["link"],
                        forceWebView: false);
                  },
                ),
              ],

            )
          ],
        ),

      ],
    ),

最佳答案

来自documentation

ButtonBar.children : The buttons to arrange horizontally

我认为你做了很多不必要的事情,为了得到结果,只需将按钮放在 ButtonBar 中,而不需要额外的布局小部件,如 RowColumn

enter image description here

代码如下:

ButtonTheme.bar(
          child: new ButtonBar(
            alignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              FlatButton(
                child: Icon(
                  Icons.share,
                  color: Colors.white,
                ),
                color: Color.fromRGBO(68, 153, 213, 1.0),
                shape: CircleBorder(),
                onPressed: () {},
              ),
              FlatButton(
                color: Color.fromRGBO(161, 108, 164, 1.0),
                child: const Text('Read Article'),
                shape: new RoundedRectangleBorder(
                    borderRadius: new BorderRadius.circular(30.0)),
                textColor: Colors.white,
                onPressed: () {},
              ),
            ],
          ),
        ),

关于dart - 在卡片中定位按钮。 flutter ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53481148/

相关文章:

flutter - 将 syncfusion_flutter_pdfviewer 与 flutter web 结合使用

flutter - 在dart中的列表上执行异步操作

dart - 如何使用 Dartlang 获取上个月的第一天日期时间

date - 将纪元时间转换为时间戳 flutter

passwords - 如何在flutter中添加密码输入类型使密码用户输入不可见,就像Android Native EditText的inputtype :password?

dart - Flutter 有 "overscroll gesture recognizer"小部件吗?

dart - Flutter - 堆栈中的定位小部件导致异常

flutter - 如何在 flutter 中围绕圆形头像创建虚线边框

flutter - 如何使用 FutureBuilder 手动触发 AsyncSnapshot 错误

dart - 绘制从远程服务器下载的图像