react-native - react native 检测长按结束

Question

我的问题非常简单，我正在尝试检测 onLongPress 事件的结束。基本上是当用户松开按键时。

我尝试了 TouchableWithoutFeedback 中可能发生的所有事件，但一次只能触发一个事件。

import React from 'react'

import {
	View,
	Text,
	Dimensions,
	CameraRoll
} from 'react-native'

import Camera from 'react-native-camera';

const { width, height } = Dimensions.get('window')
class ImageBrowser extends React.Component {
	static navigationOptions = {
		title: 'Unsplash Images',
	}

	state = {
		images: [],
		loading: true,
		page: 1,
		isRecording : false
	}

	takeVideo(){
		this._recordVideo.bind(this);
	}

	_recordVideo(){
		this.camera.capture({mode: Camera.constants.CaptureMode.video})
			.then((data) => {
				console.log(data);
			})
			.catch((err) => {
				console.log(err)
			})
	}

	_stopRecord(){
		this.camera.stopCapture();
	}

	render() {
		return (
			<View style={{flex: 1}}>
				<Camera
					ref={(cam) => {this.camera = cam;}}
					style={styles.preview}
					aspect={Camera.constants.Aspect.fill}
					type={Camera.constants.Type.front}
				>
					<Text style={styles.capture} onLongPress={this.takeVideo.bind(this)} onPress={this._stopRecord.bind(this)} onPressOut={this._stopRecord.bind(this)}>[CAPTURE]</Text>
				</Camera>
			</View>
		)
	}
}

const styles = {
	preview: {
		flex: 1,
		justifyContent: 'flex-end',
		alignItems: 'center',
		height: Dimensions.get('window').height,
		width: Dimensions.get('window').width
	},
	capture: {
		flex: 0,
		backgroundColor: '#fff',
		borderRadius: 5,
		color: '#000',
		padding: 10,
		margin: 40
	}
}

export default ImageBrowser

Answer 1

使用触摸***组件

onPressIn

onPressOut

http://facebook.github.io/react-native/docs/touchablewithoutfeedback.html