0

我希望能够在可缩放视图上松开捏合时将图像重置为旧尺寸，但我无法这样做。

我仍然是初学者，希望在这里得到一些帮助，在我尝试测试此功能的地方添加了整个虚拟代码。

正在使用的包在这里https://www.npmjs.com/package/@dudigital/react-native-zoomable-view

我愿意使用任何其他包，只要它使捏缩放按预期工作。

如果有人可以提供帮助，那就太好了，我正在添加一些我为此获得的代码，当我在重置后尝试再次缩放时，它会出现故障，它不起作用。

感谢您的任何想法和帮助。

import React, { useState } from "react";
import {
  StyleSheet,
  FlatList,
  Image,
  Dimensions
} from "react-native";

import ReactNativeZoomableView from "@dudigital/react-native-zoomable-view/src/ReactNativeZoomableView";

const { width, height } = Dimensions.get("window");



export default function App() {
  const [zoomEnabled, setZoomEnabled] =useState(true);
  const [initialZoom, setInitialZoom] = useState(1);

const sizeHandler = () => {
  
  setZoomEnabled(false);
  setInitialZoom(1);
};
  const list = [
    {
      url: "https://www.gettyimages.com/gi-resources/images/500px/983794168.jpg",
      id: "1",
    },
    {
      url: "https://killerattitudestatus.in/wp-content/uploads/2019/12/gud-night-images.jpg",
      id: "2",
    },
  ];

return (
    <FlatList
      pagingEnabled
      style={styles.screen}
      data={list}
      keyExtractor={(item, index) => item.id}
      renderItem={({ item }) => {
        return (
          <ReactNativeZoomableView>
            zoomEnabled={zoomEnabled}
            doubleTapZoomToCenter={true}
            maxZoom={1.5}
            minZoom={1}
            zoomCenteringLevelDistance={0.2}
            zoomStep={0.1}
            initialZoom={initialZoom}
            bindToBorders={true}
            onZoomEnd={()=>sizeHandler()}
            
          >
            <Image
              style={styles.image}
            source={{ uri: item.url }}
          />
          </ReactNativeZoomableView>
        );
      }}
    />
  );
}

const styles = StyleSheet.create({
  screen: {
    flex: 1,
  },
  image: {
    height: height,
    width: width,
  },

});
4

0 回答 0