I m trying the saveLayer and blendMode I m using this for th

Question

I m trying the saveLayer and blendMode I m using this for the first time I ve never used that before even in the previous android UIToolkit So I followed this tutorial that s originally written for flutter and I ended up with this code in jetpack compose ``` Composable fun testBlending2 modifier Modifier = Modifier val paint = remember Paint Canvas modifier = modifier onCanvas = save val rect = Rect 0f 0f 100f 100f drawRect rect paint apply color = Color Red saveLayer Rect fromLTWH 0f 0f size width value size height value paint apply BlendMode multiply drawRect rect shift Offset 20f 20f paint apply color = Color Blue restore restore ``` It s supposed to be but it just produces this image What am I doing wrong

Kazemihabib1996 · Answer

produced Image

romainguy · Answer

Note that you don t need `saveLayer ` at all in this example

romainguy · Answer

Anyway your problem is most likely that you should be writing

romainguy · Answer

`paint apply blendMode = BlendMode multiply `

romainguy · Answer

You are not assigning the `BlendMode` to anything

Kazemihabib1996 · Answer

OOOPS weary what a mistake disappointed how I didn t notice that Thank you

Kazemihabib1996 · Answer

< romainguy> I want to create a whole inside the below shape ``` Composable fun donat modifier Modifier = Modifier val icingPaint = remember Paint apply asFrameworkPaint pathEffect = ComposePathEffect CornerPathEffect 40f DiscretePathEffect 60f 25f color = Color 0xFF53250F Canvas modifier = modifier onCanvas = val center = Offset size minDimension value 2 size minDimension value 2 val holePath = Path apply addOval Rect fromCircle center size minDimension value 6 val icing = Path apply addOval Rect fromCircle center size minDimension value 2 5f op this holePath operation = PathOperation difference also Log d OP RESULT it toString drawPath icing icingPaint ``` but it doesn t work but it works without `asFrameworkPaint pathEffect = ComposePathEffect CornerPathEffect 40f DiscretePathEffect 60f 25f `

Kazemihabib1996 · Answer

without `asFrameworkPaint pathEffect = ComposePathEffect CornerPathEffect 40f DiscretePathEffect 60f 25f `

Kazemihabib1996 · Answer

also I can create the whole with `nativeCanvas clipPath holePath asAndroidPath Region Op DIFFERENCE ` with out removing that pathEffect

romainguy · Answer

It s probably because your path effect is too wide and covering the hole

Kazemihabib1996 · Answer

I changed it to `asFrameworkPaint pathEffect = DiscretePathEffect 1f 1f ` but didn t help

romainguy · Answer

Not sure why you keep mentioning Flutter slightly smiling face

romainguy · Answer

`saveLayer` basically creates a temporary render target

romainguy · Answer

think of it like a transparent bitmap

romainguy · Answer

and some of the blending modes like `DstOut` may only provide the desired results you want when starting from a transparent content

romainguy · Answer

The window of your app is opaque by default so the alpha value is set to 1

romainguy · Answer

The Android docs show what the different alpha compositing and blend modes do <https developer android com reference android graphics PorterDuff Mode>

romainguy · Answer

Anyway so because multiply is not an alpha compositing mode it works without saving a layer first

romainguy · Answer

but `DstOut` does alpha composition hence the `saveLayer`

romainguy · Answer

Note that `saveLayer` calls have a cost memory and rendering performance so use them sparingly or at least watch performance

romainguy · Answer

Also you don t need the restore simply because Android does have its own restores to prevent mistakes from apps

romainguy · Answer

But better to have a restore for every save

romainguy · Answer

Oh and it wouldn t make sense to call `saveLayer` for just one of the draw calls

Kazemihabib1996 · Answer

< romainguy> Thank you for your nice explanation +1 I got it finally And about the flutter joy because in `BlendMode kt` there are links to flutter docs and also the docs in that file is equal to to `` that was reason for using flutter docs and samples for learning this stuff grin

romainguy · Answer

Ah that explains slightly smiling face

romainguy · Answer

We should fix that 0