如何在Flutter中创建带有轮廓的卡片小部件

Question

我想在Flutter中使用带轮廓的材料卡片，但由于卡片小部件没有样式元素或类似的东西，我不确定如何实现这一点。我尝试使用shape:属性，但并不成功，主要是因为我不理解它的工作原理。

- jonasxd360

Answer 1

输出:

它有一个 shape 属性，它接受一个 Border，您可以更改它。

Card(
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(40), // if you need this
    side: BorderSide(
      color: Colors.grey.withOpacity(0.2),
      width: 1,
    ),
  ),
  child: Container(
    color: Colors.white,
    width: 200,
    height: 200,
  ),
)

我认为你展示的截图也可以通过使用Card的elevation属性来实现。

- CopsOnRoad

---

边框半径怎么样？ - jonasxd360

谢谢！我只有一个快速的问题，borderRadius 的示例是什么？ - jonasxd360

为了实现我展示的屏幕截图，需要更改高程和形状属性。只使用高程会导致没有边框的卡片。 - jonasxd360