Zoomin works just on double click and after zoom can not moved

[ghost]

Zoom in works just on double and when gets zoom in that time we can not move the image Also can not be zoom with finger motion. Also a little is slow

Please help me

[SimonErich]

Hey @muhammadwfa . Will take a look at it tomorrow. :)

[ghost]

Ok thank you, And I am using image inside a react-native-modal from react community

[SimonErich]

Hey, I have looked into it and I could reproduce it with my example repo. It seems like the callbacks seem to slow down the performance considerably. When I used the exact same code base and ejected from expo it worked perfectly well, without a problem.

Are you using callbacks (onZoomAfter, ...) ? Are you using expo?

If so, maybe try ejecting from it and if it helps to remove the callbacks, just to find the problem. Did you use an older version of react-native-zoomable-view or did you just add it to your project?

[ghost]

Hi, I am not using expo

[SimonErich]

Can you please provide a small example repo, where we can reproduce the error?

[ghost]

this is the example I am usng but on a modal!

<ReactNativeZoomableView
   maxZoom={1.5}
   minZoom={0.5}
   zoomStep={0.5}
   initialZoom={1}
   bindToBorders={true}
   onZoomAfter={this.logOutZoomState}
   style={{
      padding: 10,
      backgroundColor: 'red',
   }}
>
   <Text>This is the content</Text>
</ReactNativeZoomableView>

[SimonErich]

Hello Muhammad, can you provide an example with your modal code? And please also provide the code u use in "logOutZoomState" method. This can impact performance as well.

[Kyonru]

Yeah, looks like the issue is on modals. I'm using react-native-navigation modal, and i'm getting the same behavior.

[SimonErich]

@Kyonru can you please provide a small minimal example with react-navigation modals? I haven't used them yet.

Can you just fork https://github.com/DuDigital/react-native-zoomable-view-example with react-navigation modals working, then I'll take a look and try to fix it.

[SimonErich]

Issue has been closed because of inactivity. If you have the same problem, please provide a small example for us to work with.

[spocky]

Hi,

I'm getting the same issue as well, using react-native modals. Just need to import "Modal" from "react-native" and surround the ReactNativeZoomableView from your example code in a :

<Modal visible={true}  transparent>
.....
</Modal>

Strangely enough, if I patch your _handleStartShouldSetPanResponder method to return "true" instead of "false" it works as expected. Hopefully that will be enough for you to fix.

Edit : In order to make it work in Modals, instead of returning true in my basic patch above, _handleStartShouldSetPanResponder should probably return that same value as _handleMoveShouldSetPanResponder. Also in your _handleStartShouldSetPanResponder, maybe you can return the value of this.props.onStartShouldSetPanResponder if it's overridden (as you do in _handleMoveShouldSetPanResponder).

Edit 2: Not sure you've seen it, ping @SimonErich

[spocky]

Just to confirm the latest commit fixed the issue, thanks @SimonErich !