使用 react-native 缩放大于屏幕分辨率的图像

Question

我正在使用 react-native-lightbox 来缩放图像。我有一个缩略图，当按下它时，会加载一个大于屏幕分辨率的图像，以便在不损失质量的情况下进行可能的缩放。

打开灯箱时出现问题，图像被裁剪到屏幕尺寸，我无法将其放大到全尺寸。

在Android上运行良好，所以我认为它与Retina Screen有关。

对此有什么想法，或者您知道可以让我完成此任务的组件吗？

代码如下：

    <Lightbox
        key={images.photo_id}
        activeProps={{
            resizeMode: 'contain',
            source: { uri: images.photo_sizes.full },
            style: { flex: 1, width: null, height: null }
        }}
    >
        <Image
            source={{ uri: images.photo_sizes.thumbnail }}
            style={ flex: 1, height: 200, width: null }
            resizeMode='cover'
        />
    </Lightbox>

谢谢！

Answer 1

你可以在ios中使用scrollview来实现pinch zoom，只需将图片如下图并设置maximumZoomScale和minimumZoomScale值即可。它只适用于 ios。

<ScrollView maximumZoomScale={5} scrollEnabled={true} minimumZoomScale={1} showsHorizontalScrollIndicator={false} showsVerticalScrollIndicator={false}>
 <Image
  style={{height:100, width: 300}}
  source={{ uri: "https://img0.gaadicdn.com/images/car-
          images/496x206/Lamborghini/Lamborghini-Huracan/Lamborghini-
          Huracan-Performante/047.jpg" 
        }}
  />
</ScrollView>