android - 网络图像适合卡片而不会丢失卡片形状， GridView 在 flutter 中

Question

在想要的 View 中，有一个两列的网格列表，其项目设计需要在卡片背景中设置图像，卡片有一定的半径，图像是网络图像，但卡片大小会根据网络图像波动。我试过 this太但没有工作。

这是代码

Container(
  child: Column(
  children: <Widget>[
       Expanded(
                    child: Card(
                        clipBehavior: Clip.antiAlias,
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(10.0),
                        ),
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(10.0),
                          child: Image.network(
                            event_response.imageLogoUrl +
                                event_response.eventList[position].event_logo,
                            fit: BoxFit.cover,
                          ),
                        )),
                  ),
                          Container(
                           padding: const EdgeInsets.all(5.0),
                           child  :Text('${event_response.eventList[position].eventName}'),
                        )
                      ],

                );},),),],),);

这里我想要但在 2 列中。

我来了

Answer 1

为了使图像的角变圆，您必须将其包裹在 ClipRRect 小部件中并为其指定与卡片相同的边框半径。

Column(
  crossAxisAlignment: CrossAxisAlignment.stretch,
  children: <Widget>[
  Expanded(
    child: Card(
        clipBehavior: Clip.antiAlias,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10.0),
        ),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(10.0),
                      child: Image.network(
            event_response.imageLogoUrl +
                event_response.eventList[position].event_logo,
            fit: BoxFit.cover,
          ),
        )),
  ),
  Container(
    padding: const EdgeInsets.all(5.0),
    child: Text('${event_response.eventList[position].eventName}'),
  )
]);