如何检测用户是不是放大或缩小反应原生

Posted 2023-02-19

【中文标题】如何检测用户是不是放大或缩小反应原生

【英文标题】：How to detect whether user zoomed in or zoomed out in react native如何检测用户是否放大或缩小反应原生

【发布时间】：2021-08-12 10:53:13

【问题描述】：

我正在开发一个 react native 应用，我想检测用户是放大还是缩小。

如果用户放大，我只想打印用户放大，如果用户缩小，我只想打印用户缩小

类似下面的伪代码

   const detectZoom = (event)=>

   if(event.gesture === "zoomed in")
      console.log("Zoomed in");
   
  
  if(event.gesture === "zoomed out")
     console.log("Zoomed out");
  



//This is how I want to call it
<TouchableHighlight onPress=this.detectZoom>

</TouchableHighlight>

请告诉我更好的方法。

【参考方案1】：

您应该使用 react-native-gesture-handler 并专门在您的视图/容器中使用捏合手势。

yarn add react-native-gesture-handler

https://docs.swmansion.com/react-native-gesture-handler/docs/api/gesture-handlers/pinch-gh

<PinchGestureHandler
        onGestureEvent=this._onPinchGestureEvent
        onHandlerStateChange=this._onPinchHandlerStateChange>
  <View style=styles.container collapsable=false>
  </View>
</PinchGestureHandler>

您的处理程序：

 let previousScale = 1;
_onPinchHandlerStateChange = (event) => 
    if (event.nativeEvent.oldState === State.ACTIVE) 
      //Handle Zoom here based on the values..
          let newScale = previousScale * event.nativeEvent.scale;
           if(newScale > previousZoom)
            console.log("zoomed in");
           else
            console.log("zoomed out");
           
    
  ;

【讨论】：

我没听懂。现在我只知道我必须使用 PinchGestureHandler 但我不知道如何显示用户是放大还是缩小？如果您可以提供根据触摸放大或缩小显示的代码，那将非常有帮助

检查编辑。如果您可以阅读文档，您可以自己完成。

State.ACTIVE 在这里我得到的状态是未定义的，而且文档也很差，它在任何地方都没有帮助。

从'react-native-gesture-handler'导入状态；文档很好，请至少阅读一次。