search

Kureev / react-native-blur

React Native Blur component
MIT License
3.77k stars 557 forks source link

Blur not working android #322

Open monkhsaikhan opened 5 years ago

monkhsaikhan commented 5 years ago

Blur working on ios perfect. But not working on android

here is my code

Platform.OS === 'android' ? <BlurView style={{position: "absolute", top: 70, left: 0, bottom: 0, right: 0}} blurType="light" blurAmount={5} blurRadius={15} downsampleFactor={5} overlayColor={'rgba(255, 255, 255, .25)'} viewRef={this.state.viewRef} /> : <BlurView style={{position: "absolute", top: 70, left: 0, bottom: 0, right: 0}} blurType="light" blurAmount={5} />

no warning and no errors

Please help me!!!

xclidongbo commented 5 years ago

some to me.

boygiandi commented 5 years ago

me too :( Please fix it

athirah-yahya commented 5 years ago

Any follow up on this? I am using RN 0.60.4 here.

No error nor warning

boygiandi commented 5 years ago

yes. You can use this. Seem like to work in normal situation. https://github.com/lvlrSajjad/react-native-blur-overlay But when I try to blur a video view, it doesn't work

MrFreemind commented 5 years ago

Try to add some background-color to view that you need to blur. I've spent so much time to figure out why it's not working on android, but that helped me out. Interesting that in this case blur depends on background opacity. First I've added transparent color and it start working but with some bugs until I added just #fff color.

rhamag commented 5 years ago

Had the same issue. These two things worked for me:

Make sure you have a backgroundColor on the container you want to blur. Make sure the component rerenders:

style={{ backgroundColor: 'transparent' }}
ref={n => {
  if (n && viewRef === null) {
    setViewRef(findNodeHandle(n))
  }
}}
xhirazi commented 4 years ago

+1

anisfrontmen commented 4 years ago

+1

MrFreemind commented 4 years ago

@xhirazi @anisfrontmen check out this comment. It might be helpful. https://github.com/react-native-community/react-native-blur/issues/328#issuecomment-575678258

Psiiirus commented 4 years ago

Updated to 3.5(dev-master) and this seems to be fixed...i guess its because android is using a totally different android-lib to blur since 3.5

ghost commented 2 years ago

add zIndex: 100 to BlurView style. it will resolve error.