当相机状态准备就绪时,React-native-camera flash权限视图

问题描述 投票:0回答:1

我正在使用本机相机与所显示的子功能或文档(https://github.com/react-native-community/react-native-camera/blob/master/docs/RNCamera.md)。当我尝试第一次尝试使用相机时,它会显示权限视图,该视图可以正常工作。但是每次我想使用相机后第一次使用时,即使状态为“READY”,应用程序也会快速闪烁权限视图。我发现问题是RNCamera带来了摄像头和状态信息,但是在安装组件后状态值会更新。

该值从'PENDIN AUTHORIZATION'跳转到'READY',这就是它闪烁授权视图的原因。是否有任何解决方法,以便我第一次使用相机按预期工作,然后在另一个使用相机不显示授权视图,但相机本身?提前致谢

<RNCamera>
  {({ camera, status }) => {
     if (status === 'READY'){
        return ( <View>.....Camera.... </View>
        )
     }
     else if (status !== 'READY'){
        return (<CameraPermission/>)
     }
  }}
</RNCamera>
react-native camera react-native-camera
1个回答
0
投票

您无需处理获得许可的权利,RNCamera将自动处理。像这样定义你的相机:

'use strict';
import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import { RNCamera } from 'react-native-camera';

class BadInstagramCloneApp extends Component {
  render() {
    return (
      <View style={styles.container}>
        <RNCamera
          ref={ref => {
            this.camera = ref;
          }}
          style={styles.preview}
          type={RNCamera.Constants.Type.back}
          flashMode={RNCamera.Constants.FlashMode.on}
          androidCameraPermissionOptions={{
            title: 'Permission to use camera',
            message: 'We need your permission to use your camera',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          }}
          androidRecordAudioPermissionOptions={{
            title: 'Permission to use audio recording',
            message: 'We need your permission to use your audio',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          }}
          onGoogleVisionBarcodesDetected={({ barcodes }) => {
            console.log(barcodes);
          }}
        />
        <View style={{ flex: 0, flexDirection: 'row', justifyContent: 'center' }}>
          <TouchableOpacity onPress={this.takePicture.bind(this)} style={styles.capture}>
            <Text style={{ fontSize: 14 }}> SNAP </Text>
          </TouchableOpacity>
        </View>
      </View>
    );
  }

  takePicture = async function() {
    if (this.camera) {
      const options = { quality: 0.5, base64: true };
      const data = await this.camera.takePictureAsync(options);
      console.log(data.uri);
    }
  };
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'column',
    backgroundColor: 'black',
  },
  preview: {
    flex: 1,
    justifyContent: 'flex-end',
    alignItems: 'center',
  },
  capture: {
    flex: 0,
    backgroundColor: '#fff',
    borderRadius: 5,
    padding: 15,
    paddingHorizontal: 20,
    alignSelf: 'center',
    margin: 20,
  },
});

AppRegistry.registerComponent('BadInstagramCloneApp', () => BadInstagramCloneApp);
© www.soinside.com 2019 - 2024. All rights reserved.