Question

我是Flutter的一个完整的初学者，我已经将头撞在墙上解决了一段时间，现在，如何在Row中垂直放置单个项目？（不是全部，只有一个）。

我有以下代码，我试图将图标居中放在最后（箭头右）：

return Card(
  child: Row(
    mainAxisSize: MainAxisSize.max,
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Container(
        padding: EdgeInsets.all(8),
        child: CachedNetworkImage(
          imageUrl: DDragon.getSpellImage(spell),
          placeholder: (context, url) => CircularProgressIndicator(),
          errorWidget: (context, url, error) => Icon(Icons.error),
        ),
      ),
      Expanded(
        child: Container(
          padding: EdgeInsets.all(4),
          child: Column(
            children: [
              Row(
                children: [
                  Text(spell.name,
                      style: TextStyle(fontSize: 24),
                      textAlign: TextAlign.start),
                  spell is Passive
                      ? Container(
                          padding: EdgeInsets.only(left: 3),
                          child: Text("(Passive)",
                              style: TextStyle(color: Colors.grey)))
                      : SizedBox.shrink()
                ],
              ),
              Text(spell.description)
            ],
          ),
        ),
      ),
      Icon(Icons.arrow_right)
    ],
  ),
);

我尝试了以下操作，但均未成功，并更改为显示方式：

Column(mainAxisSize: MainAxisSize.max,mainAxisAlignment: MainAxisAlignment.center, children: [Icon(Icons.arrow_right)])

Answer 1

围绕Center小部件中的图标。那应该使它垂直居中，就像您想要的那样。

更新：我做了一个飞镖垫来说明。 https://dartpad.dartlang.org/c0bd50b6e61d303bb1d78e68c7412e3e

Answer 2

使用展开以使“行”增长到最大高度，然后使用crossAxisAlignment：CrossAxisAlignment.center

Expanded(child : Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Text(
                          "Child Element",
                          style: TextStyle(fontSize: 24),
                          textAlign: TextAlign.start,
                        ),
                      ],
                    ))

Answer 3

在谷歌搜索了很长时间后，唯一对我有用的方法是用IntrinsicHeight包裹我的Row并将Icon包裹在Center内，否则无论我尝试哪个答案，它都不会居中

在行内垂直居中放置单个项目

3 个答案: