ReactNative ScrollView 不会滚动或缩放答案

【问题标题】：ReactNative ScrollView won't scroll or zoomReactNative ScrollView 不会滚动或缩放
【发布时间】：2018-02-22 06:17:16
【问题描述】：

使用 create-react-native-app，在 Android 设备上进行测试。我正在尝试在滚动视图中显示全屏照片。图像显示比我的屏幕大，但我既不能滚动也不能缩放。

export default function Photo({ filename }) {
  return (
    <ScrollView
      centerContent
      contentContainerStyle={{ flex: 1 }}
      maximumZoomScale={2}
      minimumZoomScale={1}
    >
      <View style={{ flex: 1 }}>
        <Image style={{ flex: 1 }} source={{ uri: assetPath(filename) }} />
      </View>
    </ScrollView>
  );
}

这个组件是从顶级 react-router Route 渲染的：

  <NativeRouter>
    <AndroidBackButton>
      <View style={styles.container}>
        <Route path="/" exact component={PhotoListContainer} />
        <Route
          path="/photos/:filename"
          component={({ match }) => (
            <Photo filename={match.params.filename} />
          )}
        />
      </View>
    </AndroidBackButton>
  </NativeRouter>

在我看到的示例中，有一个显着的区别：Image 元素通常没有任何样式。但是如果我删除样式属性，图像就会完全消失。我怀疑我的问题至少有一部分源于不了解 flex 和对 RN 不熟悉，而且解决方案很简单。可以的话请帮忙！

【问题讨论】：

您是否尝试将resizeMode="contain" 属性添加到图像中？
看了你的评论才试了一下。这使图像更好地适应屏幕，以便您可以看到整个事物。但它不支持缩放。
你检查过这个吗？ stackoverflow.com/questions/36368919/…
还有这个中号帖子：medium.com/@mheavers/…
感谢您的链接。我已经阅读了中篇文章，但是您链接的 SO 问题可能会有所帮助。非常感谢。

标签： android react-native flexbox android-scrollview

【解决方案1】：

这些属性，minimumzoomscale 和 maximumzoomscale 仅适用于 IOS，不适用于 Android

Link to docs

第二件事是只有当您的视图超出屏幕时滚动才可用。

【讨论】：