缩放Flutter Row中的元素以具有相同的纵横比

由 发布于 flutterdartscale
 收藏

我想连续显示元素列表。问题在于它的缩放比例不正确。如果我有六个元素，则看起来不错，但是如果列表中仅包含四个元素，则效果不好。有人可以告诉我我在做什么错吗？

码：

Container(
            height: 100,
            margin: marginMediumHorizontal,
            decoration: decorationLight,
            alignment: Alignment.center,
            child: Row(
              children: <Widget>[
                ...model.gridListItems.map(
                  (element) => Expanded(
                    child: Container(
                      margin: EdgeInsets.symmetric(horizontal: 5, vertical: 5),
                      decoration: decorationDark,
                      padding: EdgeInsets.all(5),
                      child: Image(
                        color: lightGrayLimeGreen,
                        image: AssetImage(element['icon']),
                        fit: BoxFit.contain,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),

非常感谢你的帮助。

评论
  • kqui
    kqui 回复

    Use Flexible widget instead of Expanded and give each widget as flex : 1 It'll do the trick itself.

    Container(
            height: 100,
            margin: marginMediumHorizontal,
            decoration: decorationLight,
            alignment: Alignment.center,
            child: Row(
              children: <Widget>[
                ...model.gridListItems.map(
                  (element) => Flexible(
                    flex : 1,
                    child: Container(
                      margin: EdgeInsets.symmetric(horizontal: 5, vertical: 5),
                      decoration: decorationDark,
                      padding: EdgeInsets.all(5),
                      child: Image(
                        color: lightGrayLimeGreen,
                        image: AssetImage(element['icon']),
                        fit: BoxFit.contain,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),