自定义形状问题颤振

Question

我试图在 flutter 中制作自定义形状的容器，但我无法获得我制作的形状的对称版本（与原点对称），

class BackgroundClipper1 extends CustomClipper<Path> {
  @override
  getClip(Size size) {
    var path = Path();
    path.moveTo(0, 0);

    path.lineTo(size.width,0);
    path.lineTo(0,size.height); 
    return path;
  }

  @override
  bool shouldReclip(CustomClipper oldClipper) {
    return true;
  }
}

。 . . 我如何在我的代码中调用它。

child: ClipPath(
                  clipper: BackgroundClipper1(),
                  child: Container(
                    width: MediaQuery.of(context).size.width,
                    height: MediaQuery.of(context).size.height * 0.5,
                    decoration: BoxDecoration(
                        gradient: LinearGradient(
                            colors: [Colors.blue, Colors.blueAccent])),
                  )),

Answer 1

试试这个..

class MyTriangle extends CustomPainter {
  final Color strokeColor;

  MyTriangle({this.strokeColor = Colors.white});

  @override
  void paint(Canvas canvas, Size size) {
    Paint paint = Paint()
      ..color = strokeColor
      ..style = PaintingStyle.fill;

    canvas.drawPath(getTrianglePath(size.width, size.height), paint);
  }

  Path getTrianglePath(double x, double y) {
    return Path()
      ..moveTo(y, 0)
      ..lineTo(y, x)
      ..lineTo(0, x)
      ..lineTo(y, 0);
  }

  @override
  bool shouldRepaint(MyTriangle oldDelegate) {
    return oldDelegate.strokeColor != strokeColor;
  }
}

和用法

Container(
        width: 150,
        height: 150,
        child: CustomPaint(painter: MyTriangle(strokeColor: Colors.green)),
      )

输出

自定义形状问题颤振

Custom Shape Issue Flutter

shapes

dart

flutter