在flutter中将小部件包装在Row中

Question

我有以下Widget树结构：

Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Container(
            child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            Flexible(Text("Very very long text title", overflow: TextOverflow.ellipsis)),
            getMenuAnchor(),
          ],
        )),
        IconButton(icon: 'share_icon.png')
      ],
    );

如果屏幕有足够的宽度，则可以正确显示：

但是，如果我们从横向模式切换到纵向模式，我希望标题换行并以省略号结尾，这样

share_icon

、

menu_anchor

和

text

可以适合单行而不溢出。

小部件树应该是什么，以便所有元素都可以连续显示而不抑制共享和菜单图标？

Answer 1

删除包装文本和菜单锚点的未使用容器：

            Row(
              children: [
                Flexible(child: Text("Very very long text title", overflow: TextOverflow.ellipsis)),
                getMenuAnchor(),
                IconButton(icon: 'share_icon.png')
              ],
            ),

或者如果你确实需要容器，那么也尝试用Flexible 包裹它：

            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Flexible(
                  child: Container(
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: [
                          Flexible(child: Text("Very very long text title", overflow: TextOverflow.ellipsis)),
                          getMenuAnchor(),
                        ],
                      )),
                ),
                IconButton(icon: 'share_icon.png')
              ],
            ),

Answer 2

试试这个：

Expanded(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                    child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Flexible(Text("Very very long text title",
                        overflow: TextOverflow.ellipsis)),
                    getMenuAnchor(),
                  ],
                )),
                IconButton(icon: 'share_icon.png')
              ],
            ),
          );