如何在Flutter中由行包裹的列中并排对齐按钮？

Question

我要在一行中并排排列两个凸起的按钮和一个图标..我应该怎么做？

我把这三个放在一列中，并用一行包裹起来。

我曾尝试将“列”作为“行”，从而使三个列成一行，但整个身体只局限在那儿。

child: Row(
            children: <Widget>[
              Expanded(
                  child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[

                  RaisedButton(
                    padding:
                        EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
                    textColor: Colors.black,
                    child: Text(
                      'LeaderBoard',
                      style: TextStyle(
                        fontSize: 20.0,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    onPressed: () {},
                    shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(50.0)),
                  ),
                  Icon(
                    Icons.home,
                    size: 44.0,
                  ),
                  RaisedButton(
                    padding:
                        EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
                    textColor: Colors.black,
                    child: Text(
                      'Claim @0',
                      style: TextStyle(
                        fontSize: 20.0,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    onPressed: () {},
                    shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(50.0)),
                  ),
                ],
              )),
            ],

预计两个按钮并排放置。

Answer 1

您只需要删除父Column小部件内的Row，并可以直接用Row包装按钮。这是在同一行中显示按钮和图标的工作示例：

body: Center(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            RaisedButton(
              padding:
              EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
              textColor: Colors.black,
              child: Text(
                'LeaderBoard',
                style: TextStyle(
                  fontSize: 20.0,
                  fontWeight: FontWeight.bold,
                ),
              ),
              onPressed: () {},
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(50.0)),
            ),
            Icon(
              Icons.home,
              size: 44.0,
            ),
            RaisedButton(
              padding:
              EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
              textColor: Colors.black,
              child: Text(
                'Claim @0',
                style: TextStyle(
                  fontSize: 20.0,
                  fontWeight: FontWeight.bold,
                ),
              ),
              onPressed: () {},
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(50.0)),
            ),
          ],
        ),
      )

上面的代码在UI中呈现如下：

希望这能回答您的问题。