Dart 颤振：将长方体阴影添加到透明容器

我正在尝试制作一个小部件，用于渲染图中所示的一个圆。它是一个带有长方体阴影的透明圆。圆圈应显示应用于父容器的任何颜色或背景图像。圆圈是透明的，但我看到的是：一个黑框阴影，而不是父对象的背景色。有什么建议吗

以下是我到目前为止的情况：

class TransParentCircle extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        child: new Center(
          child: new Container(
            decoration: new BoxDecoration(
              border: new Border.all(width: 1.0, color: Colors.black),
              shape: BoxShape.circle,
              color: Colors.transparent,
              boxShadow: <BoxShadow>[
                BoxShadow(
                  color: Colors.black,
                  offset: Offset(1.0, 6.0),
                  blurRadius: 40.0,
                ),
              ],
            ),
            padding: EdgeInsets.all(16.0),
          ),
        ),
        width: 320.0,
        height: 240.0,
        margin: EdgeInsets.only(bottom: 16.0));
  }
}

class TransParentCircle扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回容器(
孩子：新中心(
子容器：新容器(
装饰：新盒子装饰(
边框：新边框。全部（宽度：1.0，颜色：Colors.black），
形状：BoxShape.circle，
颜色：颜色。透明，
boxShadow：[
箱形阴影(
颜色：颜色，黑色，
偏移量：偏移量（1.0,6.0），
半径：40.0，
),
],
),
填充：所有边缘设置（16.0），
),
),
宽度：320.0，
身高：240.0，
边距：仅限边缘组（底部：16.0））；
}
}

正如您在

框shadow

类中所看到的，它们将

toPaint（）方法子类化如下：

Paint toPaint() {
  final Paint result = Paint()
    ..color = color
    ..maskFilter = MaskFilter.blur(BlurStyle.normal, blurSigma);
  assert(() {
    if (debugDisableShadows)
      result.maskFilter = null;
    return true;
  }());
  return result;
}

new CustomBoxShadow(
  color: Colors.black,
  offset: new Offset(5.0, 5.0),
  blurRadius: 5.0,
  blurStyle: BlurStyle.outer
)

。。。使用
BlurStyle.normal
而不是我们想要的
BlurStyle.outer

让我们创建一个自定义的
BoxShadow
，它将
BlurStyle
作为参数

import 'package:flutter/material.dart';

class CustomBoxShadow extends BoxShadow {
  final BlurStyle blurStyle;

  const CustomBoxShadow({
    Color color = const Color(0xFF000000),
    Offset offset = Offset.zero,
    double blurRadius = 0.0,
    this.blurStyle = BlurStyle.normal,
  }) : super(color: color, offset: offset, blurRadius: blurRadius);

  @override
  Paint toPaint() {
    final Paint result = Paint()
      ..color = color
      ..maskFilter = MaskFilter.blur(this.blurStyle, blurSigma);
    assert(() {
      if (debugDisableShadows)
        result.maskFilter = null;
      return true;
    }());
    return result;
  }
}

现在我们可以这样使用它：

Paint toPaint() {
  final Paint result = Paint()
    ..color = color
    ..maskFilter = MaskFilter.blur(BlurStyle.normal, blurSigma);
  assert(() {
    if (debugDisableShadows)
      result.maskFilter = null;
    return true;
  }());
  return result;
}

new CustomBoxShadow(
  color: Colors.black,
  offset: new Offset(5.0, 5.0),
  blurRadius: 5.0,
  blurStyle: BlurStyle.outer
)

容器(
高度：200.0，
装饰：盒子装饰(
boxShadow：[
箱形阴影(
颜色：颜色，黑色，
模糊半径：10.0，//软化阴影
spreadRadius:7.0，//扩展阴影
偏移量：偏移量(
5.0，//水平向右移动10
5.0，//垂直移动到底部5
),
)
],
),
孩子：文本（“这对每个人都有效

非常感谢，这对我帮助很大！！