如何在 Android 上增加 React Native SVG 元素的可触摸区域？答案

【问题标题】：How to grow the touchable area on React Native SVG elements on Android?如何在 Android 上增加 React Native SVG 元素的可触摸区域？
【发布时间】：2019-08-17 06:41:53
【问题描述】：

作为 SVG 草图的一部分，我使用一个很小的点作为滑块控件。为了增加可触摸区域，我添加了一个厚实的透明边框。这适用于 iOS，但不适用于 Android。我可以在 Android 上做些什么来解决这个问题？我尝试添加 hitSlop 和 padding，但这些似乎都不适用于 SVG 元素。

【问题讨论】：

在其周围添加一个更大的容器，然后将 SVG 居中。
谢谢！如果我将（透明）较大的容器放在可见点上方，而不是嵌套它们，那就行得通。请将您的解决方案添加为答案，我会将其标记为选定答案。

标签： android react-native svg react-native-android react-native-svg

【解决方案1】：

在 Svg 周围添加一个透明容器，并在其上而不是在 Svg 上处理您的触摸。

例如：

<TouchableWithoutFeedback>
  <MySVGComponent />
</TouchableWithoutFeedback>

【讨论】：

嗯，在我的例子中，点是更大的 SVG 绘图的一部分。但如果我只是调整它，你的建议确实对我有用。我在可见点的顶部放置了一个较大的透明点，并使透明的点可拖动而不是较小的点。我现在稍微澄清了我的问题。