How to make the stroke width 1px in flutter's customPainter

Question

I am building a Flutter app that allows you to draw pixel art on a canvas using CustomPainter. My Paint() method looks like so:

final paint = Paint()
      ..color = Colors.deepPurple
      ..style = PaintingStyle.fill
      ..isAntiAlias = false
      ..strokeWidth = 1;

Which gives me something like this (zoomed in):

After testing this I realized that that strokeWidth = 1 does not mean 1 pixel. I can change it to .1 or something, but that then seems to be doing sub-pixel painting. How can I get my stroke width to be exactly 1 pixel?

I looked through the documentation and I'm not understanding why this is happening.

Did you tried to set the isAntiAlias for true? I believe that this flag change the pixelate of the draw. — JRamos29, Jun 26 '20 at 22:05
[devicePixelRatio](https://api.flutter.dev/flutter/widgets/MediaQueryData/devicePixelRatio.html) maybe? — pskink, Jun 27 '20 at 04:45
@pskink this may be on the right track, but I'm not sure how this relates to stroke width. Would you mind expounding on how I would approach converting this? — Zach Russell, Jun 27 '20 at 15:34

score 3 · Answer 1 · edited Oct 31 '21 at 15:08

3

you can use:

Paint paint = Paint() ..color = Colors.red ..strokeWidth = 2 ..style = PaintingStyle.stroke ..strokeJoin = StrokeJoin.round ;

edited Oct 31 '21 at 15:08

Suraj Rao

29,388
11
94
103

answered Oct 31 '21 at 15:07

mohammed mosalam

31
2

How to make the stroke width 1px in flutter's customPainter

1 Answers1