CODEWITHSUNDEEP
fluttercanvasflutter-layoutcustom-painting
Nick
Nick

Reputation: 465

Flutter canvas, how to paint over the child widget?

I am trying to draw red dots over the child textbox widget like this:

enter image description here

For that, I wrapped the child widget with CustomPaint() widget:

 return CustomPaint(
      painter: DotsPainter(), //draws red dots based on child's size
      child: child, //textbox
    );

But the result is this:

enter image description here

How to make CustomPainter "overlay" its child widget?

Thanks.

Upvotes: 5

Views: 3227

Answers (1)

nvoigt
nvoigt

Reputation: 77364

The CustomPaint has 2 possible painters:

When asked to paint, CustomPaint first asks its painter to paint on the current canvas, then it paints its child, and then, after painting its child, it asks its foregroundPainter to paint.

(emphasis mine)

So if you move your painter to the foregroundPainter instead, it should work fine:

return CustomPaint(
  foregroundPainter: DotsPainter(), //draws red dots based on child's size
  child: child, //textbox
);

Upvotes: 5

Related Questions