如何从自定义绘画小部件更改为剪切路径小部件？

debugcn 发表于 Dev

金恩珠

class CoverPainter extends CustomPainter {
  final Size sSize;
  const CoverPainter({this.sSize});

  @override
  void paint(Canvas canvas, Size size) {
    final paint = Paint();
    final double r = (sSize.width).toDouble()/6.8;

    paint.color = Color(0xffE6E6E5);
    canvas.drawPath(
      Path.combine(
        PathOperation.difference,
        Path()..addRect(Rect.fromLTRB(sSize.width/2-r, 0.6*sSize.height-90-r, sSize.width/2+r, 0.6*sSize.height-90+r)),
        Path()
          ..addOval(Rect.fromCircle(
              center: Offset(sSize.width / 2, 1.2/2*sSize.height-90 ),
              radius: sSize.width/6.8))
          ..close(),
      ),
      paint,
    );
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) {
    return false;
  }
}

这是我的原始代码，由于某些原因，我需要将其更改为剪切路径小部件。作为初学者，这真的很难...（顺便说一句，sSize是screenSize，而不是画布大小）

class CoverClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    //final path = Path();
    final double r = (size.width).toDouble()/6.8;

    Path.combine(
        PathOperation.difference,
        Path()..addRect(Rect.fromLTRB(size.width/2-r, 0.6*size.height-90-r, size.width/2+r, 0.6*size.height-90+r)),
        Path()
          ..addOval(Rect.fromCircle(
              center: Offset(size.width / 2, 1.2/2*size.height-90 ),
              radius: size.width/6.8))
          ..close()
    );
    return Path();
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) {
    return false;
  }
}

我这样尝试过，但没有任何反应。没有错误，但没有任何显示。

class _Layer2State extends State<Layer2> {
  @override
  Widget build(BuildContext context) {
    final Size size = widget.size;

    // return CustomPaint(painter: CoverPainter(sSize: size));

    return ClipPath(
      clipper: CoverClipper(),
      child: Container(
        color: Colors.white,
        height: size.height,
        width: size.width,
      ),
    );
  }
}

实际上，我对clippath一无所知。我需要帮助......

马里亚诺·佐里拉

您需要返回要修改的实际路径，它将起作用。当前返回的路径为空：

class CoverClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    final double r = (size.width).toDouble()/6.8;

    return Path.combine(
        PathOperation.difference,
        Path()..addRect(Rect.fromLTRB(size.width/2-r, 0.6*size.height-90-r, size.width/2+r, 0.6*size.height-90+r)),
        Path()
          ..addOval(Rect.fromCircle(
              center: Offset(size.width / 2, 1.2/2*size.height-90 ),
              radius: size.width/6.8))
          ..close()
    );
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) {
    return true; // you can also change this to true to repaint.
  }
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。