按标题,我的意思是当我单击动画时什么也没有发生。但是当我在它的左侧略微单击时,它可以工作。
这是我的代码:
HEADERID
2
3
在您看到<View style={{flex: 1, alignItems:'center', right: 0, left: 0, flexDirection:'row', position: 'absolute', alignSelf:'center', top: 10}}>
{this.state.queryid.includes(item.id) ?
<TouchableOpacity
ref="unlikeButton"
onPress={() => this.anim_unlike(item)}
style={{ zIndex: 1, }}
hitSlop={{ top: 20, left: 20, bottom: 20, right: 100 }}>
<Animation
progress={item.unprogress}
source={require('../Animations/favourite_app_icon.json')}
style={{ height: 50, width: 50, alignSelf:'center', marginLeft: 0, left: 5}}
resizeMode={`contain`}
/>
</TouchableOpacity>
:
<TouchableOpacity
ref="likeButton"
onPress={() => this.anim_like(item)}
style={{zIndex: 1, }}
hitSlop={{ top: 20, left: 20, bottom: 20, right: 100 }}>
<Animation
progress={item.progress}
source={require('../Animations/favourite_app_icon.json')}
style={{ height: 50, width: 50, alignSelf:'center', marginLeft: 0, left: 5}}
resizeMode={`contain`}
/>
</TouchableOpacity>
}
<Text style={{alignSelf:'center', color: 'black', fontFamily: Fonts.QuoFont, fontSize: 15}}>{item.likes}</Text>
</View>
的地方,这是我尝试加宽触摸框的地方,但这根本不起作用。当我从“视图”中拿走hitSlop
时,可触摸区域在星号的适当区域中正常运行。我绝对需要它,以便其他元素可以留在正确的位置。如果能够使视图表现得像绝对的一样,并且不会干扰其他元素,那就太好了。