bindToBorder Doesn't work.

[mahiraltinkaya]

Hello there; I tried to explain with pictures and I show the styles clearly. I expect the image to stay in the layout, but the image gets bigger as possible.

Can you help me where am I going wrong?

  return (
    <Layout
      style={[
        {
          flex: 1,
          backgroundColor: "black",
          flexDirection: "column",
          width: MAX_WIDTH,
        },
      ]}
    >
      <Layout style={{ width: 350, height: 350 }}>
        <ReactNativeZoomableView
          ref={zoomBottom}
          maxZoom={1.3}
          minZoom={1}
          zoomEnabled={true}
          movementSensibility={3}
          initialZoom={1}
          bindToBorders={true}
          //   onZoomAfter={logOutZoomStateBottom}
          style={{ width: 350, height: 350, padding: 10 }}
        >
          <Image
            source={props.original}
            style={{ width: 320, height: 320 }}
            resizeMode="contain"
          ></Image>
        </ReactNativeZoomableView>
      </Layout>
      <Layout
        style={{
          flex: 1,
          width: MAX_WIDTH,
          backgroundColor: "black",
        }}
      ></Layout>
    </Layout>
  );

[tallesb]

Same issue. Any solution?

[n-ext]

Try adding overflow: 'hidden' to your Layout containing ReactNativeZoomableView

[tallesb]

Try adding overflow: 'hidden' to your Layout containing ReactNativeZoomableView

Thanks! This solution worked for me!

[mahiraltinkaya]

Try adding overflow: 'hidden' to your Layout containing ReactNativeZoomableView

Thank you mate. this worked for me!