Flutter 卡片边框前景不为'；他没有按预期工作

代码：

Card(
  color: Colors.blue,
  borderOnForeground: false, // doesn't do anything on true also
  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(300)),
  child: Container(
    width: 200,
    height: 200,
    color: Color(0x30FF0C5C),
    child: Text(
      "|||||||",
      style: TextStyle(fontSize: 40),
    ),
  ),
)

医生说：

边界前景：是否在[子]前面绘制[形状]边界。 默认值为true。如果为false，将在[子对象]后面绘制边框

输出：

问题：

默认情况下（当

borderOnForeground:true

时），我希望白色垂直线位于蓝色圆圈内，但它不会这样做，设置为

false

时也不会这样做。那么，

borderOnForeground

实际上做了什么

注意：

Card(
  color: Colors.blue,
  borderOnForeground: false, // doesn't do anything on true also
  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(300)),
  child: Container(
    width: 200,
    height: 200,
    color: Color(0x30FF0C5C),
    child: Text(
      "|||||||",
      style: TextStyle(fontSize: 40),
    ),
  ),
)

---

我知道有很多方法可以通过使用

ClipRRect

，

ClipOval

等来实现我的要求。我不是在寻找那些解决方案，我只是想知道

borderOnForeground

做什么？

问题是你没有边框（就像CSS中的边框），这就是为什么

true

和

false

看起来一样。要查看差异，请添加厚边框：

shape: RoundedRectangleBorder(
  borderRadius: BorderRadius.all(
    Radius.circular(300.0),
  ),
  side: BorderSide(
    color: Colors.red,
    width: 20.0,
  ),
),

如果您设置了

borderOnForeground:false

卡的子卡中位于红色边框下方的部分现在将位于其上方