How to mirror path in flutter?
298
You can do that with negative scaling and translation (to correct position), like this for Y axis:
canvas.scale(1, -1);
canvas.translate(0, -height);
canvas.drawPath(allStripesPath, paint);
For X axis:
canvas.scale(-1, 1);
canvas.translate(-width, 0);
canvas.drawPath(allStripesPath, paint);
Docs:
https://api.flutter.dev/flutter/dart-ui/Canvas/scale.html
https://api.flutter.dev/flutter/dart-ui/Canvas/translate.html
Author by
Arti Scream
Updated on December 18, 2022Comments
-
Arti Scream over 1 year
So i have a code that paints path at container.
void paintWithPattern( Canvas canvas, double x, double y, double width, double height) { final maxDimension = max(width, height); final stripeW = maxDimension / featuresCount / 6; var step = stripeW * 9; final paint = Paint() ..style = PaintingStyle.fill ..color = bgColor; canvas.drawRect(Rect.fromLTWH(x, y, width, height), paint); final rectStripesCount = featuresCount * 2.5; // to make sure we cover the whole rectangle final allStripesPath = Path(); for (var i = 1; i < rectStripesCount; i += 2) { final stripePath = Path(); stripePath.moveTo(x - stripeW + step, y); stripePath.lineTo(x + step, y); stripePath.lineTo(x, y + step); stripePath.lineTo(x - stripeW, y + step); stripePath.close(); allStripesPath.addPath(stripePath, Offset.zero); step += stripeW * 9; } paint ..style = PaintingStyle.fill ..color = fgColor; canvas.drawPath(allStripesPath, paint); }
The result of the code painting on container is below
How can I made it, so it's mirrored by Y axis? like on picture below
-
Arti Scream over 2 yearsThanks, that works just perfrectly