ScrollView 内的大图像不会让滚动

Question

我正在尝试将图像（按图像全尺寸）添加到 ScrollView 组件中，我的想法是让图像保持其自身大小（不限制它），而是让水平和垂直滚动（取决于图像）。所以我在 ScrollView 中使用 Image.getSize()，这是我的组件，

import React, { Component } from 'react';
import { Image, ScrollView } from 'react-native';

export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      width: 10,
      height: 10,
      image: 'http://www.francedimanche.fr/parole/wp-content/uploads/2017/08/Angelina-Jolie.png',
    }
  }

  componentDidMount() {
    Image.getSize(this.state.image, (width, height) => {
      this.setState({ width, height });
    });
  }

  render() {
    return (
      <ScrollView>
        <Image
          style={{ width: this.state.width, height: this.state.height }}
          source={{uri: this.state.image}}
        />
      </ScrollView>
    );
  }
}

谢谢！

Answer 1

您可以在 ScrollView 中水平或垂直。要获得两者，您只需将它们嵌套即可：

  <ScrollView horizontal={true}>
    <ScrollView>
      <Image
        style={{ width: this.state.width, height: this.state.height }}
        source={{uri: this.state.image}}
      />
    </ScrollView>
  </ScrollView>

ScrollView 内的大图像不会让滚动

Big image inside ScrollView won't let scroll

react-native

react-native-scrollview