Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Image snaps to horizontal center after scaling #13

Closed
yfunk opened this issue Apr 22, 2021 · 3 comments
Closed

Image snaps to horizontal center after scaling #13

yfunk opened this issue Apr 22, 2021 · 3 comments

Comments

@yfunk
Copy link

yfunk commented Apr 22, 2021

Description

When performing any gesture to change the image scale, the image seems to always center itself horizontally after the gesture has ended. This is fine when scaling the image to be smaller than the container (scale < 1), but should not be happening when zooming in (scale > 1).

Right now this causes the "focus" to shift away from the point that was zoomed into after ending the gesture. For me this issue is happening on Android using the package versions listed below, I was not yet able to test it on an iOS device.

scaling.mp4

Minimal code example

export const ImageScreen = () => {
  const source = 'https://homepages.cae.wisc.edu/~ece533/images/cat.png';
  return <Gallery data={[source]} />;
}

Package versions

  • react-native: 0.64.0
  • react-native-gesture-handler: 1.10.3
  • react-native-reanimated: 2.1.0
  • react-native-awesome-gallery: 0.1.0 (also on 0.0.9)
@pavelbabenko
Copy link
Owner

Fixed in https://github.com/Flair-Dev/react-native-awesome-gallery/releases/tag/v0.1.1

@The-CodeNinja
Copy link

The-CodeNinja commented Nov 22, 2022

Facing a similar issue.
The scaled image snaps back to the vertical centre.

react-native-awesome-gallery: 0.3.5

<Gallery
 loop={true}
        emptySpaceWidth={0}
        style={{
          top: -57,
          position: 'absolute',
        }}
        onIndexChange={index => {
          setCurrentPage(index)
        }}
        ref={galleryRef}
        data={[...links]}
        renderItem={({ item }) => {
          return (
            <Pressable key={item.docID}>
                <Image
                  ...
                />
            </Pressable>
          )
        }}
        keyExtractor={(_item, index) => `${index}`}
      />

@krik-chry
Copy link

@pavelbabenko Is this still an issue? I notice that when I zoom a lot it recenters the image, instead of staying in the place i stopped the gesture

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants