阵营，TabNavigator的原住民用相机（相机总是）

我TabNavigator与相机内部。代码示例：阵营，TabNavigator的原住民用相机（相机总是）

我index.android.js

const MainNavigator = TabNavigator({ 
    Home: { screen: QRcreatorScreen }, 
    Contacts: { screen: ContactsScreen }, 
    Camera: { screen: CameraScreen }, 
    Profile: { screen: ProfileScreen }, 
    }, { 
    tabBarPosition: 'bottom', 
    lazy: true 
});

和我的相机页：

export default class CameraScreen extends React.Component { 

    static navigationOptions = { 
    title: 'Camera', 
    }; 

    emitContact() { 
    alert("Contact been added"); 
    } 

    render() { 
    return (
     <QRCodeScanner onRead={(e) => { 
           SetNewContact(e.data,() => { this.emitContact() }) 
          }} 
      topContent={<Text>Just show me another code</Text>} 
      showMarker={true} 
      bottomContent={(
       <TouchableOpacity style={styles.buttonTouchable}> 
        <Text style={styles.buttonText} 
          onPress={() => this.props.navigation.dispatch(resetAction) }>OK. Got it! 
        </Text> 
       </TouchableOpacity> 
      )} 
     /> 
    ); 
    }; 
}

只需简单QR码阅读器。

问题是下一步：当在TabNavigator选项设置lazy == false，TabNavigator渲染应用程序启动时的所有场景。

当lazy == true时，场景在被调用时呈现，但当我们调用最后一个场景时（在我们的案例中为Profile），前面的所有场景也都在渲染。

所以，当我在Profile挖掘，有需要一些时间来加载所有的场景，它是应用程序的性能非常糟糕。

我需要做的，使仅呈现相机页面被调用的时候？

而另一个问题：当我们离开现场相机，相机仍在工作，我怎么可以将其关闭时离开现场？

我用包react-native-qrcode-scanner这是使用react-native-camera: ^0.10.0

来源

2017-09-01 Роман Сафонов

如果有人感兴趣我找到了答案。

我使用react-native-tab-navigator与本地StackNavigator。

我如何关闭相机：

render() { 
    let QrScanner = this.state.showScanner ? <QrScannerElement navigation={this.props.navigation}/> : null 
    return (
     <View style={styles.container}> 
     {QrScanner}  
     </View> 
    ); 
    };

更改状态时激活：

componentDidMount() { 
    event.addListener('cameraUnpressed',() => { 
     this.setState({showScanner: false}) 
    }); 
    event.addListener('camera',() => { 
     this.setState({showScanner: true}) 
    });  
    }

在react-native-tab-navigator我们可以得到国家his.state.selectedTab，如果它是不是“照相机”在我的情况下，我们送事件。

我的例子：

cameraPressed() { 
    this.setState({ selectedTab: 'camera' }); 
    event.emit('camera'); 
    } 

    cameraUnPressed(page) { 
    if(this.state.selectedTab == 'camera') event.emit('cameraUnpressed'); 
    this.setState({ selectedTab: page }); 
    }

来源

2017-09-05 14:07:32

阵营，TabNavigator的原住民用相机（相机总是）

回答

相关问题