lan*_*rew 1 react-native react-native-reanimated react-native-reanimated-v2
我正在尝试创建具有滑动删除功能的垂直平面列表。因此,我的平面列表的每个项目均由PanGestureHandler我的问题是当我尝试滚动时,由于滚动视图动画与平移手势动画之间的冲突,我的平面列表滚动不起作用。我尝试过使用simultaneousHandlers但没有帮助。我也尝试使用FlatListfromreact-native-gesture-handler和 fromreact-native结果是一样的。
<View style={styles.container}>
<Header data={{headerText: 'Contacts', leftIcon: 'arrow-left', line: true}}/>
<FlatList
ref={scrollRef}
data={contacts}
renderItem={({item}) => <Item simultaneousHandlers={scrollRef} {...{item}} />}
bounces={false}
showsVerticalScrollIndicator={false}
style={{paddingLeft: wp('5%'), paddingTop: hp('2%')}}>
</FlatList>
<TouchableOpacity style={styles.touchableOpacity} onPress={() => navigation.navigate('AddContact')}>
<View>
<Text style={styles.textButton}> Add Contact </Text>
</View>
</TouchableOpacity>
</View>
Run Code Online (Sandbox Code Playgroud)
物品:
<Animated.View style={[rTaskContainerStyle]}>
<Animated.View style={[styles.iconContainer, rIconContainerStyle]}>
<Icon name={'trash-2'} size={25} color={'red'} />
</Animated.View>
<View>
<PanGestureHandler {...simultaneousHandlers} onGestureEvent={panGestureHandler}>
<Animated.View style={[rStyle,{backgroundColor: '#FFFFFF'}]}>
<Text style={{color: '#09101D', fontFamily: 'SourceSansPro_600SemiBold', fontSize: 18}}>
{info.fullName}
</Text>
<Text style={{color: '#545D69', fontFamily: 'SourceSansPro_400Regular'}}>
{info.publicKey}
</Text>
</Animated.View>
</PanGestureHandler>
</View>
</Animated.View>
Run Code Online (Sandbox Code Playgroud)
Jay*_*Jay 17
您应该为平移手势添加偏移量。你的 PanGestureHanler 应该是
<PanGestureHandler
failOffsetY={[-5, 5]}
activeOffsetX={[-5, 5]}
onGestureEvent={gestureHandler}
>
Run Code Online (Sandbox Code Playgroud)
它可能对你有帮助。
| 归档时间: |
|
| 查看次数: |
3508 次 |
| 最近记录: |