panResponderを使っってスワイプアクションを実装し、Animatedの内側(もしくは外側)にTouchableOpacityでクリックイベントを実装しようとした。
しかし、panResponderの反応がよく、実機ではpanResponderの移動と判定されてクリックができない。
そこで、PanResponderでClickイベントと実装することとした。
import {View, Text, StyleSheet, Animated, Dimensions, PanResponder , TouchableOpacity} from 'react-native';
・・・
const panResponder = PanResponder.create({
onStartShouldSetPanResponder: (evt, gestureState) => {
console.log("onStartShouldSetPanResponder")
this.startTime=new Date().getTime() // Click時
console.log(this.startTime)
},
onPanResponderEnd: (evt, gestureState) =>{
console.log("onPanResponderEnd") // Clickを終えたとき
this.endTime=new Date().getTime()
console.log("startTime")
console.log(this.startTime)
console.log("endTime")
console.log(this.endTime)
let diff = this.endTime - this.startTime
console.log("diff")
console.log(diff)
if (diff < 100 ){ // 100ミリ以内ならクリックと判定
console.log("Clicke");
console.log(this.props.itemKey)
this.props.handleItemClick(this.props.itemKey)
}
},