How would you implement zoom in response mode?

Question

I was looking for a PanResponder. My current working hypothesis is that I would detect if there are two touches that move outward, and if so, increase the size of the element in the function onPanResponderMove.

This seems like a dirty way to do it. Is there a smoother path?

Answer 1

If you need only simple scaling functions, just use ScrollView ( doc here )

Just give maximum ZoomScale (more than one) and minimum ZoomScale as you wish.

Answer 2

Pan Responder, .

, evt, . , React-Native.

evt is a synthetic touch event with the following form:

nativeEvent
    changedTouches - Array of all touch events that have changed         since the last event
    identifier - The ID of the touch
    locationX - The X position of the touch, relative to the element
    locationY - The Y position of the touch, relative to the element
    pageX - The X position of the touch, relative to the root element
    pageY - The Y position of the touch, relative to the root element
    target - The node id of the element receiving the touch event
    timestamp - A time identifier for the touch, useful for velocity calculation
    touches - Array of all current touches on the screen

, , , / .

Answer 3

-native-svg: https://snack.expo.io/@msand/zoomablesvg-v2.0.2

https://github.com/msand/zoomable-svg/blob/master/index.js

/ .

Answer 4

.

.

, .

I wrote an NPM module that does this.

response-native-pinch-zoom-responder