Hi I m playing around with runtime rendering effects and I m kotlinlang #compose

Hi, I'm playing around with runtime rendering effects and I'm confused. Is it possible to apply a rendering effect to only part of a Composable widget, but not the whole thing? For example, how to blur the content behind widget which is ontop of the screen content (not a dialog, just a regular composable stacked on another.) within its bounds. To limit the area of the effect. I tried combinations of graphics layers,

drawWithContent

and

clipRects

, but it didn't give the desired result. Also tried using

RenderNode

directly as described in Chet's post. Haven't found a way to combine it with the Compose UI drawing system yet. 🧵

😞 1

Screenshot_20230201_024240.png

the rendering effect applies only to all background content.

Only one idea comes to mind. Create a duplicate layout in the widget hierarchy that will be blurred. Then crop it with a surface content mask. But this is extremely inefficient and I don't want to do it that way.

I wish we could have possibility to set rendering effects within

drawContent

modifiers. (I don't know if it is possible) E.g. pseudo code:

Copy code

Modifier.drawWithContent {
    drawContent() // draws original content
    clipPath(path) { // draws the part of the content covered by the mask and applies the given effect to it
        renderEffect = RenderEffect.createBlurEffect(...)
        drawContent()
    }
}

this is starting to remind me of the render pass architecture in 2D/3D graphic renderers 🫠

2 Views