I'm trying to make custom shaped container in flutter, but i can't get symmetric version(symmetric to origin) of shape i made,
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;
}
}
. . . How i call this in my code.
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])),
)),
Try this..
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;
}
}
and usage
Container(
width: 150,
height: 150,
child: CustomPaint(painter: MyTriangle(strokeColor: Colors.green)),
)
OUTPUT
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.