你如何在react-native中实现双指缩放？

Question

我一直在研究PanResponder.我目前的工作假设是我会检测是否有两个向外移动的触摸,如果有,则增加onPanResponderMove函数中的元素大小.

这似乎是一种混乱的方式.有更顺畅的方式吗？

Answer 1

如果您只需要简单的捏缩放功能，请使用ScrollView（doc在这里）

只需根据需要提供maximumZoomScale（大于1）和minimumZoomScale。

Answer 2

注意：此答案与平移响应器无关，而是解决了如何在 React Native 中实现捏合缩放的主要问题。

在没有 expo 的情况下使用 Expo 或 React-Native，您可以PinchGestureHandler从 react-native-gesture-handler导入。这里还有其他手势处理程序：react-native-gesture-handler

import { PinchGestureHandler } from 'react-native-gesture-handler';

在示例中，假设我们正在使用相机并且我们想要检测缩放的捏合：

<PinchGestureHandler
    onGestureEvent={this.onPinchGestureEvent}
  >
    <View>
          <Camera
              type={cameraType}
              flashMode={flashMode}
              zoom={zoom}
              style={styles.preview}
              ref={camera => this.camera = camera}
          />
    </View>
        </PinchGestureHandler>

然后我们可以像这样对手势事件采取行动：

   onPinchGestureEvent = event => {
      console.log(event.nativeEvent.scale);
    }