[Bug]: Component jumps when lifting one finger

[adambremler]

Summary

When zooming with SnapbackZoom or ResumableZoom, lifting one finger changes the focal point and makes the component jump according to the new focal point. This is very commonly noticed since it usually jumps when you let go with both fingers. Both fingers don't always leave the screen at the exact same moment.

Environment

expo 51.0.11 react-native-gesture-handler 2.16.1 react-native-reanimated 3.10.1

Steps to Reproduce

Can be recreated with the most basic example. No props to SnapbackZoom.

// ...

const uri = // ...

// ...

<SnapbackZoom>
  <Image source={{ uri }} />
<SnapbackZoom>

// ...

A minimal fix could be to ignore pinch gestures where numberOfPointers is not equal to 2.

[Glazzes]

I'm pretty aware of the bug you're mentioning as it has been fixed previously, could you be so kind and share some footage of the bug? I've tried to replicate it in all components sharing the same zoom implementation but none of them display the behaviour you're mentioning.

[adambremler]

Sure @Glazzes!

Here I zoom with the focal point on the dog's nose. As I lift my left finger, the focal point (dog's nose) moves to where my right finger is. This was done with the latest version of main today on iOS.

It would be nice if the focal point stayed where it was, but still allowed for movement with the finger that's left. So there's no snapping, but we can still pan the image around with one finger.

https://github.com/user-attachments/assets/3baf4140-39fd-4cb1-a64a-f79c78c76b28

[Glazzes]

You have truly caught me off guard with this one, this wasn't the bug I was expecting to see again, the pinch gesture should end as soon as there are less than two pointers as it is the expected behavior.

At the last moments of the video you moved the image after the focal point displacement, are you able to resume the pinch gesture if you place the second finger on the screen again? and are you able to drag it around with one finger after the focal point displacement?

[adambremler]

Yes I'm able to drag it around with one finger!

And yes I'm also able to resume the pinch gesture if I place my second finger on the screen again. Then the focal point also moves again to in between the fingers.

[Glazzes]

This behaviour is not normal from Gesture Handler at all, I think this must be an issue with the version of iOS you're using, you should reach out to them and ask them whether this is expected or not, even adding a double pointer check from my part would not work because the pinch can be resumed at a any point.

To give you an idea how broken this behaviour is, in my implementation the pan gesture is disabled as soon as you start pinching, when you pan and pinch at the same time is actually only the pinch gesture working, so yeah this is weird.

[Volper212]

I am facing this bug on Android (I am working with ResumableZoom) - what's weird is that I feel like it worked before after installing this library, but now this bug appears on every pinch. But I may be mistaking it with my previous implementation without this library which doesn't have this issue.

[Volper212]

I modified my previous implementation to include focalX and focalY and suddenly it also started to have a similar issue when compared to this library. Interesting.

[Glazzes]

@Volper212 Sadly this is a Gesture handler issue, it does occur on both platforms, even seen it reported in other libraries, however the conditions which trigger this behavior are totally unclear to me, my best guest is that it's a problem with the newest Android and iOS versions.