react native blur camera

Viewed 235

hello is there any libraries or some sdk to help me with this i want when i open camera and focus object all around object become blur and the photo only contain this object

Does anyone know how it might be done .. ?

i try this lib @react-native-community/blur

and try to put circle inside so i can use it as overlay on camera but the blur all over the screen

  render() {
    return (
      <View style={styles.Container_All_Screen}>
        <Image
          source={require('../../../assists/img/send.png')}
          style={{width: '100%', height: '100%', resizeMode: 'contain'}}
        />

        <BlurView
          blurType={'light'}
          blurAmount={100}
          reducedTransparencyFallbackColor={'white'}
          style={{
            position: 'absolute',
            width: '100%',
            height: '100%',
            justifyContent: 'center',
            alignItems: 'center',
          }}>

        </BlurView>

        <View
            style={{
              width: 100,
              height: 100,
              backgroundColor: 'red',
              opacity: 0.5,
              borderRadius: 100,
              position: 'absolute',

            }}></View>
      </View>
    );
  }

Here's an example of what I had in mind:

enter image description here

0 Answers
Related