Flutter如何用背景图像创建卡片？

Question

我正在尝试创建一个以图像为背景的卡片。问题是，图像溢出了卡，因此没有显示角落。

我需要将图像设置为卡的背景或将卡的溢出行为设置为无溢出。但是我找不到任何属性。

这是我的卡：

Widget _buildProgrammCard() {
  return Container(
    height: 250,
    child: Card(
      child: Image.asset(
        'assets/push.jpg',
        fit: BoxFit.cover,
      ),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(10.0),
      ),
      elevation: 5,
      margin: EdgeInsets.all(10),
    ),
  );

它看起来像这样：

Answer 1

另一种方法不使用- ClipRRect小工具-是设置semanticContainer: true,的Card部件。

示例代码如下：

Card(
          semanticContainer: true,
          clipBehavior: Clip.antiAliasWithSaveLayer,
          child: Image.network(
            'https://placeimg.com/640/480/any',
            fit: BoxFit.fill,
          ),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(10.0),
          ),
          elevation: 5,
          margin: EdgeInsets.all(10),
        ),

输出：

Answer 2

您可以将图像包装在 ClipRRect

ClipRRect(
  borderRadius: BorderRadius.vertical(top: Radius.circular(10.0)),
  child: Image.network(...),
)