React Native 图片查看组件:react-native-image-viewer,纯JS组件,小巧快速的图标查看组件。支持图片放大缩小,支持图片加载失败设置替代图片,支持将图片保存到本地等功能。
效果图
安装方法
使用示例
export default class Component06 extends Component {
constructor(props) {
super(props);
}
constructor(props) {
super(props);
}
render() {
return (
<View style={{ flex: 1 }}>
<ImageViewer
imageUrls={images}
failImageSource={{
url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',width: Dimensions.get('window').width,height: Dimensions.get('window').width,}}
/>
主要参数说明
- imageUrls 图片URL地址的数组
- enableImageZoom 是否允许缩放
- failImageSource 加载失败时显示的图片
- loadingRender 加载loading
- renderHeader 头部样式
- renderFooter 底部样式
- renderIndicator 页码指示器样式
完整示例
完整代码:https://github.com/forrest23/ReactNativeComponents 本次示例代码在 Component06文件夹中。
原文链接:https://www.f2er.com/js/33458.html