1.0.0 • Published 5 years ago
@mopa/react-native-image-zoom v1.0.0
react-native-image-zoom
React Native图片缩放组件。
Installation
npm install @mopa/react-native-image-zoom --save
Usage
import React from 'react';
import { Image, Dimensions } from 'react-native';
import ImageZoom from '@mopa/react-native-image-zoom';
export default class App extends React.Component {
render() {
return (
<ImageZoom
zoomWidth={Dimensions.get('window').width}
zoomHeight={Dimensions.get('window').height}
imageWidth={300}
imageHeight={300}
>
<Image style={{width:300, height:300}} source={{ uri: 'imageurl' }} />
</ImageZoom>
);
}
}
Document
Props | Type | Description | Default Value |
---|---|---|---|
zoomWidth | number | 缩放区域宽 | 200 |
zoomHeight | number | 缩放区域高 | 200 |
imageWidth | number | 图片宽 | 200 |
imageHeight | number | 图片高 | 200 |
onClick | func | 单击回调 | () => {} |
enableDoubleClickZoom | bool | 是否允许双击 | true |
doubleClickTimeInterval | number | 双击时间间隔 | 175 |
onDoubleClick | func | 双击回调 | () => {} |
enablePanToMove | bool | 是否允许移动 | true |
enablePinchToZoom | bool | 是否允许缩放 | true |
minScale | number | 最小缩放比例 | 0.6 |
maxScale | number | 最大缩放比例 | 10 |
###License
IST
1.0.0
5 years ago