Glazzes / react-native-zoom-toolkit

Zoom anything you want! Most complete pinch to zoom utilities for React Native
https://glazzes.github.io/react-native-zoom-toolkit/
MIT License
193 stars 11 forks source link

[Gallery] feat: Added onZoomBegin and onZoomEnd callbacks for gallery #38

Closed HadesShadows closed 3 months ago

HadesShadows commented 4 months ago

I was the one who raised the issue, this is a code that I have written for gallery. I have not used other components therefore not added these callback support there as I haven't seen the code

These callbacks will support index: number to allow developers to have more control on the zoom event

What is added?

Name Type Default Description
onZoomBegin (index: number) => void undefined Callback triggered when component is zoomed.
onZoomEnd (index: number) => void undefined Callback triggered when component returns back to original state.

How it works?

useAnimatedReaction(
    () => scale.value,
    (value, previousValue) => {
      if (value !== 1 && !hasZoomed.value) { //if the value != 1, that means it is not in default state
        hasZoomed.value = true;
        onZoomBegin && runOnJS(onZoomBegin)(activeIndex.value);
      } else if (value === 1 && previousValue !== 1 && hasZoomed.value) { 
        /* 
          when the component is initally rendered, the value will be 1 and prevValue
            will not be 1, this condition will be true, and onZoomEnd() will be triggered
            to counter that, hasZoomed is used 
        */
        hasZoomed.value = false;
        onZoomEnd && runOnJS(onZoomEnd)(activeIndex.value);
      }
    },
    [scale]
  );

Note: I haven't tested the code snippet in iOS since I don't have macOS, but it is working as expected in android

Glazzes commented 4 months ago

Hi there, I'll not have time to review and test your changes until monday because of personal reasons, but I will be sure to test it as soon as I can.

HadesShadows commented 4 months ago

No Problem, take your time

cw-nikhilnaik commented 4 months ago

Whats the status on the pr?

Glazzes commented 4 months ago

@cw-nikhilnaik Pending, I've been working on another issue these days and personal issues are a thing aswell.

Glazzes commented 3 months ago

@HadesShadows Hi there, I just tested your changes against one of the newest features I've made and it works pretty well with it, I'm merging it 👍

I will release a new version soon!