Flutter中CustomPainter参数类型不匹配错误修复求助

错误原因 #

你定义的ShapePainter继承了CustomPaint（这是一个Widget类），但CustomPaint组件的painter参数需要的是CustomPainter类型的实例，这就导致了类型不匹配的报错：

The argument type 'ShapePainter' can't be assigned to the parameter type 'CustomPainter?'.

修复步骤 #

只需要将ShapePainter的父类从CustomPaint改为CustomPainter即可，修改后的完整代码如下：

class ClipWidget extends StatelessWidget {
  final Widget? childWidget;

  const ClipWidget({Key? key, this.childWidget}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        CustomPaint(
          size: Size(MediaQuery.of(context).size.width, 200.0),
          painter: ShapePainter(),
        ),
      ],
    );
  }
}

class ShapePainter extends CustomPainter { // 此处修改为继承CustomPainter
  @override
  void paint(Canvas canvas, Size size) {
    Paint paint0 = Paint()
      ..color = const Color.fromARGB(255, 33, 150, 243)
      ..style = PaintingStyle.fill
      ..strokeWidth = 1;
    paint0.shader = ui.Gradient.linear(
        Offset(size.width * 0.00, size.height * 0.48),
        Offset(size.width, size.height * 0.48),
        [const Color(0xe16ae353), const Color(0xffffffff)],
        [0.00, 1.00]);

    Path path0 = Path();
    path0.moveTo(size.width * 0.0016500, size.height * 0.0141000);
    path0.quadraticBezierTo(size.width * 0.0010313, size.height * 0.6965250, size.width * 0.0008250, size.height * 0.9240000);
    path0.quadraticBezierTo(size.width * 0.1690625, size.height * 0.7614000, size.width * 0.2513500, size.height * 0.4848000);
    path0.quadraticBezierTo(size.width * 0.4153875, size.height * 0.7299000, size.width * 0.5283625, size.height * 0.7412000);
    path0.quadraticBezierTo(size.width * 0.6602125, size.height * 0.7236500, size.width * 0.7950000, size.height * 0.2750000);
    path0.quadraticBezierTo(size.width * 0.8485000, size.height * 0.7852000, size.width * 0.9422375, size.height * 0.9509000);
    path0.quadraticBezierTo(size.width * 0.9981250, size.height * 0.9071500, size.width * 0.9991500, size.height * 0.7100000);
    path0.lineTo(size.width, size.height * 0.0150000);
    canvas.drawPath(path0, paint0);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) => true;
}

补充说明 #

CustomPainter是专门定义绘制逻辑的抽象类，而CustomPaint是承载该绘制逻辑的Widget组件，二者职责不同，不能混淆继承关系。

内容的提问来源于stack exchange，提问作者Mahsa Abarghani