react-native-camera-kit/example/CameraScreen.ios.js

124 lines
3.1 KiB
JavaScript

import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
ListView,
TouchableOpacity,
Image,
AlertIOS
} from 'react-native';
import _ from 'lodash';
import Immutable from 'seamless-immutable';
import {
CameraKitGallery,
CameraKitCamera,
} from 'react-native-camera-kit';
const FLASH_MODE_AUTO = "auto";
const FLASH_MODE_ON = "on";
const FLASH_MODE_OFF = "off";
export default class CameraScreen extends Component {
constructor(props) {
super(props);
const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
this.state = {
albums:{},
albumsDS: ds,
shouldOpenCamera: false,
shouldShowListView: false,
image:{imageURI:""},
flashMode:FLASH_MODE_AUTO
}
}
render() {
return (
this._renderCameraView()
);
}
_renderCameraView() {
return (
<View style={{ flex:1, backgroundColor: 'gray', marginBottom:8}}>
<View style={{flex: 1, flexDirection:'column', backgroundColor:'black'}} onPress={this.onTakeIt.bind(this)}>
<CameraKitCamera
ref={(cam) => {
this.camera = cam;
}}
style={{flex: 1}}
cameraOptions= {{
flashMode: 'auto', // on/off/auto(default)
focusMode: 'on', // off/on(default)
zoomMode: 'on' // off/on(default)
}}
/>
<TouchableOpacity style={{alignSelf:'center', marginHorizontal: 4}} onPress={this.onTakeIt.bind(this)}>
<Text style={{fontSize: 22, color: 'lightgray', backgroundColor: 'hotpink'}}>TAKE IT!</Text>
</TouchableOpacity>
</View>
<View style={{flexDirection: 'row'}}>
<Image
style={{ flexDirection:'row', backgroundColor: 'black', width: 100, height: 100}}
source={{uri: this.state.image.imageURI, scale: 3}}
/>
<TouchableOpacity style={{alignSelf:'center', marginHorizontal: 4}} onPress={this.onSwitchCameraPressed.bind(this)}>
<Text>switch camera</Text>
</TouchableOpacity>
<View style={{ flexDirection:'column', justifyContent: 'space-between'}}>
<TouchableOpacity style={{ marginHorizontal: 4}} onPress={this.onSetFlash.bind(this, FLASH_MODE_AUTO)}>
<Text>flash auto</Text>
</TouchableOpacity>
<TouchableOpacity style={{ marginHorizontal: 4, }} onPress={this.onSetFlash.bind(this, FLASH_MODE_ON)}>
<Text>flash on</Text>
</TouchableOpacity>
<TouchableOpacity style={{ marginHorizontal: 4,}} onPress={this.onSetFlash.bind(this, FLASH_MODE_OFF)}>
<Text>flash off</Text>
</TouchableOpacity>
</View>
</View>
</View>
)
}
async onSwitchCameraPressed() {
const success = await this.camera.changeCamera();
}
async onCheckAuthoPressed() {
const success = await CameraKitCamera.checkDeviceAuthorizarionStatus();
if (success){
AlertIOS.alert('You rock!')
}
else {
AlertIOS.alert('You fucked!')
}
}
async onSetFlash(flashMode) {
const success = await this.camera.setFleshMode(flashMode);
}
async onTakeIt() {
const imageURI = await this.camera.capture(true);
let newImage = {imageURI: imageURI.uri};
this.setState({...this.state, image:newImage});
}
}