expo-blur works wrong in android

[looot]

1. SDK Version: 40.0.0
2. Platforms:Android

expo-blur works wrong in android . İos also works well

const styles = StyleSheet.create({
  blurView: {
    position: 'absolute',
    left: 0,
    right: 0,
    bottom: 0,
  },
});

 <BlurView
      intensity={100}
      style={[StyleSheet.absoluteFill, styles.blurView]}
    >
      <Tab.Navigator
        tabBarOptions={{
          style: {
            backgroundColor: 'transparent',
            position: 'absolute',
            left: 0,
            right: 0,
            bottom: 0,
          },
          activeTintColor: Color.primary,
        }}
      
      >
<Tab.Screen
          name={i18n.t('homePage')}
          component={Home}
          options={{
            tabBarIcon: ({ color }) => (
              <AntDesign
                name="home" size={24}
                color={color}
              />
            ) 
          }}
        />
******

Outputs :

Androild Emulator:

İos Emulator:

Thans for helping

[wodin]

Unfortunately I think this is a known issue. The docs say “On Android, it falls back to a semi-transparent view.”

See the following feature request and a comment from the issue linked in the feature request comments:

BlurView on Android | Voters | Expo

https://github.com/expo/expo/issues/3523#issuecomment-472262090

[looot]

Thanks for helping

[looot]

@react-native-community/blur, how it can be used in an expo project?

@wodin

I used it as in the documentation.

I encountered an error in Android

“BlurView” was not found in the UIManager

[wodin]

Unfortunately, @react-native-community/blur is partly native code. For a react-native module that depends on some native code to work in the Expo managed workflow, the native code needs to be built into Expo’s SDK.

The native code for expo-blur is included in the Expo SDK, but not the native code required by @react-native-community/blur.

So if you want to use it, you will unfortunately need to eject.

In future when the Managed Workflow support for EAS has been released, it should be possible to use things like @react-native-community/blur, but until then you’ll have to eject to the Bare Workflow.

[looot]

Thanks for helping