我想将内容(垂直排列的多个图像)放在一个比手机屏幕大的React Native ScrollView(现在仅限iOS,Android将会更晚)中,然后开始缩小以便同时显示所有内容.
有没有在componentDidMount调用中使用ScrollView.scrollResponderZoomTo的任何好例子,该调用缩小以适应屏幕中的内容,类似于
<ScrollView
style={{width: 500, height: 1000}}
// + whatever other properties make this work required way
>
<View style={{width: 2000, height: 5000}}>
<Image style={{width: 2000, height: 2000}} source={.....}/>
<Image style={{width: 2000, height: 3000}} source={.....}/>
</View>
</ScrollView>
Run Code Online (Sandbox Code Playgroud)
我尝试设置'zoomScale'属性,但似乎被忽略并始终使用值1.
根据这个问题(https://github.com/facebook/react-native/issues/2176),可以使用scrollResponderZoomTo函数,但是当我尝试使用它时,似乎无论我给出什么值它缩小得太远而且偏离中心.
F8示例应用程序有一个ZoomableImage模块(https://github.com/fbsamples/f8app/blob/b5df451259897d1838933f01ad4596784325c2ad/js/tabs/maps/ZoomableImage.js),该模块使用Image.resizeMode.contain样式使图像适合屏幕,但这会失去图像的质量,所以当你放大它会变得模糊.