首页 > 解决方案 > 适用于 android 的 Scrollable Pinch to Zoom 图像的最佳选择?

问题描述

我设法通过在 React Native 中使用 ScrollView 来实现可滚动的 - 捏缩放 - 图像或视频,如下所示:

<View style={styles.main}>
    <ScrollView
      ref={scrollRef}
      onScroll={(event) => {
        if (event.nativeEvent.zoomScale > 1) {
          setScrollIsZoomed(true);
        } else {
          setScrollIsZoomed(false);
        }
      }}
      scrollEventThrottle={2}
      showsVerticalScrollIndicator={false}
      showsHorizontalScrollIndicator={false}
      minimumZoomScale={1}
      maximumZoomScale={5}
      contentContainerStyle={styles.scrollView}
      alwaysBounceVertical={false}
    >
      {type === 'image' && (
        <FastImage
          source={{ uri: asset.file }}
          style={styles.image}
          resizeMode="contain"
        />
      )}
      {type === 'video' && (
        <TouchableWithoutFeedback onPress={muteHandler}>
          <Video
            muted={isVideoMuted}
            source={{
              uri: asset.file,
            }}
            style={styles.video}
            repeat={true}
            resizeMode="contain"
            ignoreSilentSwitch="ignore"
          />
        </TouchableWithoutFeedback>
      )}
    </ScrollView>

但是minimumZoomScalemaximumZoomScale道具仅适用于 IOS。这意味着这不适用于android。我看了这么多,我找不到一个合适的解决方案,它具有 ScrollView 如何放大的所有优点。

有什么建议么?

标签: react-nativereact-native-scrollviewreact-native-imagereact-native-gesture-handler

解决方案


推荐阅读