Limit translate

[rafatrace]

Possible to not let translate out of margins, limit in some way to not go over width and height. I will try to explain with an image.

*phone width

[imansalhi]

Though i have done some thing about this solution, i am not able to create fork on this package because the country i live in is under the sanction and dear Github does not allow me to do any thing on github. however i write the solution hear for you:

go to nodemodules/react-native-pinch-zoom-view/index.js

you will see a method as _handlePanResponderEnd = (e, gestureState) => {}

erase it and create this instead:

_handlePanResponderEnd = (e, gestureState) => {
    
    if (this.props.resetTranstalte) {

      gestureState.dx = 0;
      gestureState.dy = 0;

      let offsetX = this.state.lastX + gestureState.dx / this.state.scale;
      let offsetY = this.state.lastY + gestureState.dy / this.state.scale;

      this.setState({
        offsetX, offsetY,
        lastX: offsetX,
        lastY: offsetY,
        lastScale: this.state.scale
      });
    } else {
      this.setState({
        lastX: this.state.offsetX,
        lastY: this.state.offsetY,
        lastScale: this.state.scale
      });

    }

  };

now give resetTranstalte={true} to your component:

<PinchZoomView resetTranstalte={true}/>

there is also another solution. if you want to not having any translation on screen you can go to _handlePanResponderMove method and remove the part of code which has cam under the // translate comment:

_handlePanResponderMove = (e, gestureState) => {
    // zoom
    if (gestureState.numberActiveTouches === 2) {
      let dx = Math.abs(
        e.nativeEvent.touches[0].pageX - e.nativeEvent.touches[1].pageX
      );
      let dy = Math.abs(
        e.nativeEvent.touches[0].pageY - e.nativeEvent.touches[1].pageY
      );
      let distant = Math.sqrt(dx * dx + dy * dy);
      let scale = (distant / this.distant) * this.state.lastScale;
      //check scale min to max hello
      if (scale < this.props.maxScale && scale > this.props.minScale) {
        this.setState({ scale, lastMovePinch: true });
      }
    }
    // translate <<<<hereeeeee is the coment......................remove below code........
    else if (gestureState.numberActiveTouches === 1) {
      if (this.state.lastMovePinch) {
        gestureState.dx = 0;
        gestureState.dy = 0;
      }
      let offsetX = this.state.lastX + gestureState.dx / this.state.scale;
      let offsetY = this.state.lastY + gestureState.dy / this.state.scale;
      // if ( offsetX < 0  || offsetY <  0 )
      this.setState({ offsetX, offsetY, lastMovePinch: false });
    }
  };