在想要的 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 列中。
我来了
最佳答案
为了使图像的角变圆,您必须将其包裹在 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}'),
)
]);
关于android - 网络图像适合卡片而不会丢失卡片形状, GridView 在 flutter 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54359640/