Skia blur view topic

[Bayramito]

Here,
https://www.youtube.com/live/1WnmFqImedY?feature=share

@william-candillon speaking about blur view which i liked a lot, but while im watching this i had a question in my mind. Alright when there is a background blur this solution might works well, but what if i wanted to blur out the floating cards itself ??

How could be the implementation then?

[wcandillon]

hey 🙋🏼‍♂️ I know you wanted this feature for a while, sorry we couldn't catch up on this earlier as things got busy towards the conference.

yes this totally doable and it's actually a very sensible use-case too. is there anything particular that makes you doubt that it's not doable?

[wcandillon]

All of the demos will be released, sorry that we're a bit slow there.
The demo you showed looks good, the snapshot view API is not decided for 60/120 invocations per seconds.
Shouldn't it be the other way around? once you have the snapshot, you animated it (while maybe hidding the native view in the meantime?)

[Bayramito]

All of the demos will be released, sorry that we're a bit slow there.
The demo you showed looks good, the snapshot view API is not decided for 60/120 invocations per seconds.
Shouldn't it be the other way around? once you have the snapshot, you animated it (while maybe hidding the native view in the meantime?)

I thought that too but what if we have the background dynamic all the time?

Lets say there is a jumping banana gif on the native view.

Another method that i tried is masking the snapshot or the native view somehow.

If we want to blur a static background that is fine, but my goal is to make it a bit more dynamic like maybe blurred modal, maybe blurred draggable content on top of native views.

I want to create such helper component for skia 🙂

[wcandillon]

We don't support 120 snapshots per seconds, especially on low-end devices, also even on iOS where it seems to be super fast, this would kill the battery I suspect.

If you have a bottom sheet and you use the native view snapshot to blur the background, when scrolling the view, you would need to translate the snapshot of the scrollview content along as well. This also assume that the content of the scrollview didn't change (maybe it's using flash list of something).

Or doing backdrop blur on a video element won't work for instance.

About the helper component, let me check my code I might be able to share the example before publishing the tutorial.

[Bayramito]

Thank you very much. It might help a lot

[wcandillon]

this is the implementation from the appjs demo: https://gist.github.com/wcandillon/cf48e225227d1180cc0955b0a7d25fba

[alexandrius]

Hey @wcandillon I would argue 60 (or 120) fps support would be amazing. Even if it kills the battery. Developers would be able to create insane effects not just blur. Currently available dynamic blurview libraries essentially do the same thing, they take a screenshot every frame and then apply blur effect.
See: https://github.com/Dimezis/BlurView/blob/master/library/src/main/java/eightbitlab/com/blurview/RenderEffectBlur.java

[wcandillon]

We are supporting these use-cases very well already. Things get harder when we need to update the native view in real time.

[alexandrius]

@wcandillon The first two aren't supported if you want cars to continue moving in background.

Ones with asterisk (*) require real time rendering to make taxies moving even if the screen is in background

[wcandillon]

oh ok so indeed this is of interest since the library appears to be using the same technic than us

[alexandrius]

@wcandillon React Native apps will be able to have game menu like effects, It will be game changer.

[Bayramito]

Absolutely! I also following this topic closely as you can guess