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