删除列中不需要的 space ，同时将图像放在末尾以颤动？

Question

我是 flutter 开发的新手，我对将图像放在我在图像中显示的列的角落感到震惊

需要删除我用箭头标记的间距怎么办？现在让我 post 我到目前为止尝试了什么：

Card(
                  margin: EdgeInsets.all(10),
                  clipBehavior: Clip.antiAlias,
                  shape: RoundedRectangleBorder(
                    side: BorderSide(color: Colors.white, width: 1),
                    borderRadius: BorderRadius.circular(20),
                  ),
                  color: Colors.white,
                  child: Container(
                    width: MediaQuery.of(context).size.width / 2.3,
                    height: 200,
                    // color: Colors.pink,
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.end,
                      mainAxisSize: MainAxisSize.min,
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: <Widget>[
                        Container(
                          color: Colors.red,
                          child: Image.asset('assets/intersection_png.png',
                          fit: BoxFit.cover,),
                        )
                      ],
                    ),
                  ),
                )

提前致谢！！

Answer 1

您发布的图片周围有填充。因此，Flutter 用填充来显示它。要解决此问题，您可以在 GIMP 等图像编辑器中打开它并缩小图像大小。

这是同一张图片，但去除了填充。试试这个：

这有一个缺点，因为它看起来像图像有填充，所以它可以显示高度。您可以从图像中完全删除高程并自己将其添加到 Flutter 中，或者您可以保留原始图像并使用 Stack 之类的东西结合 Positioned 小部件来定位它（但这本身就是一个完全不同的问题).

据我所知，none 的其他答案实际上会根据您的实际形象做您想要的，但也许我错了。

编辑：我也刚刚意识到我在更改您的图像时犯了一个小错误——我删除了左侧和底部的填充。您可以在图像编辑器中自行修复原始图像，并仅删除顶部和右侧填充。

Answer 2

用 Expanded 包装您的 Container 小部件并像这样使用 BoxFit.fill：

 Expanded(
                  child: Container(
                    color: Colors.red,
                    child: Image.asset('assets/intersection_png.png',
                          fit: BoxFit.fill,
                    )
                  ),
                )

示例：

Answer 3

您应该将 BorderSide 颜色设置为 transparent

并将宽度设置为 0

side: BorderSide(color: Colors.transparent, width: 0),

删除列中不需要的 space ，同时将图像放在末尾以颤动？

Remove unwanted space inside a column while placing image at end in flutter?

flutter

flutter-layout

flutter-container