Strange blur on Android platform

[kvlknctk]

I'm having a strange issue for Android although no issues for iOS. While Blur should process the image below it, it does the same for the View above it, and this creates an ugly image.

Android:

iOS

I couldn't understand why Android created such a problem. I've read the document over and over, but can't find any clues.

[taras-doloshytskyi]

plus one for this

[adembacajmemmo]

You can wrap BlurView as a parent for all views that you don't want to have blur. Like this:

<BlurView>
{Views that you don't want to have that blur}
</BlurView>

[SaphiraNgocThuy]

You can wrap BlurView as a parent for all views that you don't want to have blur. Like this:

<BlurView>
{Views that you don't want to have that blur}
</BlurView>

The strange blur appears if I put BlurView style as absolute like below:

<View>
   {View that you don't want to blur}
   <BlurView style={StyleSheet.absoluteFill}/>

   {Views that you want to have that blur}
</View>

[dutradotdev]

take a look at my solution: https://gist.github.com/dutradotdev/50c82763fc621ab3c1bd5ba02180ce0d

[JasperH8g]

@dutradotdev as I understand correctly, your solution introduces a web view, which his not ideal imho.

@SaphiraNgocThuy Weird, my experience is the exact opposite of yours! Your comment brought me on the idea to absolute-fill a separate BlurView inside of a regular View and it fixed the problem 🤔