如何在 ListView 内的图像之间添加边距/填充？答案

【问题标题】：How to add margin/padding between Images inside a ListView?如何在 ListView 内的图像之间添加边距/填充？
【发布时间】：2020-01-05 13:55:44
【问题描述】：

我有一个充满图像的列表视图。图像一个接一个地放置。它们之间没有边距或填充，但我需要一些空间。 HTML中有类似
的东西吗？当我向 ListView 添加填充时，图像上没有任何变化。我必须为每张图片添加填充吗？

我已尝试添加填充：新 EdgeInsets.only（底部：5.0，），展开并到 ListView。我在 image.assets 上尝试过同样的方法。没有什么对我有用。

     child: new ListView(
     children: [
     Image.asset('images/offers/Beardshave.jpg',
     height: 240.0,
     fit: BoxFit.fill,),
     Image.asset('images/offers/GelNails.jpg',

     height: 240.0,
     fit: BoxFit.fill,),
     Image.asset('images/offers/Getintouch.jpg',
     height: 240.0,
     fit: BoxFit.fill,),
     Image.asset('images/offers/HotStone.jpg',
        height: 240.0,
        fit: BoxFit.fill,),
     Image.asset('images/offers/Lavendel-oil.jpg',
        height: 240.0,
        fit: BoxFit.fill,),
     Image.asset('images/offers/Paarmassage.jpg',
        height: 240.0,
        fit: BoxFit.fill,)
    ],

    ),
    ),

【问题讨论】：

在每个 Image.asset 之间使用 - SizedBox( height: 10.0, )
@anmol.majhail 这是正确的方法，你应该在别人之前把它写成答案！

标签： image listview flutter dart

【解决方案1】：

您可以创建一个像 ImageWithPadding 这样的组件并返回一个带有 image.asset 的 Padding 小部件。

类似的东西：

ImageWithPadding() {
    return Padding(
      padding: EdgeInsets.all(8.0),
      child: Image.asset('images/offers/Paarmassage.jpg',
             height: 240.0,
             fit: BoxFit.fill,)

    )

【讨论】：

【解决方案2】：

是的，您必须通过使用 Padding 小部件包装图像来为每个图像添加填充。另一种解决方案是使用这样的 Widget 在 imagen 之间添加空间：

[

  Image.asset('images/offers/Beardshave.jpg',
     height: 240.0,
     fit: BoxFit.fill,),
 SizedBox(height: 10,),
 Image.asset('images/offers/GelNails.jpg',


]

【讨论】：