[android] Blur effect for a modal view

[zagoa]

Hello everyone,

I want to add the blur effect on a Modal in my application. That work perfectly on IOS but for Android I just have a transparent modal. How can I do that for Android ? I need to use background color transparent for my modal and add an image that cover the entire modal and finaly blur it ?

[camirot]

Same problem here...

[sandroferrari]

Same problem too...

[omarkhaled11]

Same here, when the BlurView had children I got an error on android saying it has to be absolute with no children, so I did that but now I am getting a transparent modal as well, and it's working perfectly on ios

[mldb]

Same problem too...

[RomanISWG]

Same here

[stantoncbradley]

same!!!

[mileung]

update?

[Chamal0f]

you can put the view reference on the screen below the modal and the blurView in the modal. It will work when you render the modal. the downsize of this workaround is : your tab bar will not be blur (only tested it with react-native-navigation), it probably works with a js based navigation.

[Lizhooh]

@Chamal0f Can you give sample code?

[samitha9125]

What @Chamal0f saying here as I understood is to get the reference (View reference that we want to blur) and pass it to the blurView (View that Import from the library) and keep blurView inside the modal. Then background View will be blurred and modal will appear on top of that.

The problem with that approach is its too hard to manage popup modals which can occur at any place.