您可以使用View#hitSlop属性来增加可触摸区域。这在您知道增加的触摸区域不会与其他可触摸区域重叠的情况下很有用。
一个更健壮的解决方案是使用padding样式属性。Touchable*组件的可触摸区域包括元素的填充。

我只是添加了一些代码以方便参考：

<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,
  },

我遇到了同样的问题，我的抽屉图标可以从标题中的任何地方触摸。我解决了这个问题，简单地为抽屉图标添加了一个新的视图，并添加了图标及其属性。

之前

return (
      <View style={styles.header}>
        <StatusBar backgroundColor="transparent" translucent={true} />
        <TouchableOpacity
          style={styles.trigger}
          onPress={() => {
            this.props.navigation.goBack();
          }}
        >
            <Ionicons name="arrow-back" size={35} color={"grey"} />
        </TouchableOpacity>
      </View>
    );
  }
}

之后

return (
      <View style={styles.header}>
        <StatusBar backgroundColor="transparent" translucent={true} />
        <TouchableOpacity
          style={styles.trigger}
          onPress={() => {
            this.props.navigation.goBack();
          }}
        >
          <View style={{ width: 40, height: 40 }}>
            <Ionicons name="arrow-back" size={35} color={"grey"} />
          </View>
        </TouchableOpacity>
      </View>
    );
  }
}

如果你使用的是新推荐的Pressable组件 Package 器，你可以使用hitSlop来增加按钮的可按区域。
下面是你如何使用它

<Pressable
   onPress={() =>
   someFunction()}
   hitSlop={
   {
   left: 100, // To increase press area on the left side
   right: 100,// To increase press area on the right side
   bottom: undefined,
   top: undefined
   }}
   > 
   <Text>Press me </Text>
</Pressable>