Question

我有一个问题＆＃39;这个＆＃39;在Navigator上使用Android Camera。

这是我的代码：

'use strict';

var React = require('react-native');
var {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Image,
  TouchableHighlight,
  TouchableOpacity,
  Navigator,
} = React;

var Camera = require('react-native-camera'); //require the camera component
var component = '';
var capturedBase64='';
var typeCamera=Camera.constants.Type.back;

var PageCamera = React.createClass({
    getInitialState() {
        return ({
            capturedBase64: '',
            type: Camera.constants.Type.back
        });
    },

    switchCamera: function() {
        this.setState({ type: this.state.type === Camera.constants.Type.back ? Camera.constants.Type.front : Camera.constants.Type.back });
    },

    render() {
    component = this;
    return (
      <Navigator
          renderScene={this.renderScene.bind(this)}
          navigator={this.props.navigator}/>
    );
  },
  renderScene(route, navigator) {
        return (
            <View style={styles.container}>
                <Camera style={styles.camera} ref="cam" type={component.state.type} captureTarget=   {Camera.constants.CaptureTarget.memory}></Camera>
                <Image
                source={{
                    isStatic: true,
                    uri: 'data:image/jpeg;base64,' + component.state.capturedBase64,
            }}
            style={styles.captured}/>
        <TouchableHighlight style={styles.captureButton} onPress={function() {
            component.refs.cam.capture({ sampleSize: 10 }).then(function(capturedBase64) {
                component.setState({ capturedBase64 });
                setTimeout(() => component.setState({ capturedBase64: '' }), 5000);
            });
        }}>
            <Text style={{textAlign: 'center'}}>Capture</Text>
        </TouchableHighlight>

        <TouchableHighlight style={styles.switchButton} onPress={this.switchCamera}>
            <Text style={{textAlign: 'center'}}>Switch</Text>
        </TouchableHighlight>
        </View>
    );
}
});

var styles = StyleSheet.create({
    container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF'
    },
    camera: {
    position: 'absolute',
    top: 20, right: 20, bottom: 20, left: 20
    },
    captured: {
    width: 200,
    height: 400
    },
    captureButton: {
    position: 'absolute',
    height: 50,
    left: 50, bottom: 20, right: 50,
    backgroundColor: '#FFFFFF',
    borderRadius: 20,
    },
    switchButton: {
    position: 'absolute',
    height: 50,
    left: 50, top: 20, right: 50,
    backgroundColor: '#FFFFFF',
    borderRadius: 20,
    },
});

module.exports = PageCamera;

我有一个白色的屏幕而不是我的相机。我认为这是我的问题所在＆＃39;和我的组件＆＃39;。

感谢您的帮助。

Answer 1

尝试调用这样的函数：

onPress={ () => this.switchCamera() }

Answer 2

这是一个构建问题。谢谢你的帮助。

导航器上的Android相机

2 个答案: