在反应原生中控制可触摸区域

Question

我有一个方形TouchableOpacity按钮,其中间的图形只是一个小点图标,其余的是透明背景.我发现在许多Android设备中按下它很困难,因为显然只有不透明的区域是可触摸的,其余的则不是.

有没有办法控制一个TouchableOpacity或其他类似按钮的兄弟姐妹的可触摸区域？

Answer 1

您可以使用该View#hitSlop属性来增加可触摸区域.这在您知道增加的触摸区域不会与其他触摸屏重叠的情况下非常有用.

更强大的解决方案是使用paddingstyle属性.Touchable*组件的可触摸区域包括元素的填充.

Answer 2

我只是添加一些代码以便于引用:

<View style={Styles.buttonStyle}>
    <TouchableOpacity onPress={onBtn1Pressed} hitSlop={{top: 20, bottom: 20, left: 50, right: 50}}>
        <Text style={Styles.textStyle}>
           Button text
         </Text>
    </TouchableOpacity>
</View>

父按钮容器具有以下样式.由于宽度为150,因此左右为50以增加可点击区域.

 buttonStyle:{
    alignItems:'center',
    backgroundColor: '#F92660',
    width:150,
    height:50,
    marginTop:20,
    marginBottom:10,
    marginRight:15,
    padding:5,
  },