tinysymphony / react-native-zoom-image

Image Viewer Component For React Native (like twitter)

react-native-zoom-image

ZoomImage component for React Native Application (ios / android)

Only works with https network images [With the limitation of the current react-native, we can't get original size of required images. This component just zooms them with given size (provided by imgStyle prop)]

If you need to support http network images, modify info.plist please :)

Examples

Usage

install from npm

npm install --save react-native-zoom-image

import in project

import ZoomImage from 'react-native-zoom-image';
import {Easing} from 'react-native'; // import Easing if you want to customize easing function

let styles = {
  img: {} // custom styles of original image component
};
// in render function
<ZoomImage
  source={{uri: 'https://ooo.0o0.ooo/2017/03/31/58de0e9b287f6.jpg'}}
  imgStyle={{width: 250, height: 230}}
  style={styles.img}
  duration={200}
  enableScaling={false}
  easingFunc={Easing.ease}
/>

Properties

Prop	Type	Default	Description
disabled	bool	false	Whether to disable the component or not.
startCapture	bool	false	Whether to capture start touch event or not.
moveCapture	bool	false	Whether to capture move event or not.
responderNegotiate	function	-	Use custom conditions to enable or disable gesture over image modal.
easingFunc	function	Easing.linear	The easing function of animation.
showDuration	number	100	The duration of showing the image modal.
closeDuration	number	140	The duration of closing the image modal.
rebounceDuration	number	800	The total duration of resetting the position of image. The actual duration changes by the displacement of the image in Y-axis. If the displacement equals to the height of screen, the duration shall be 800ms.
enableScaling	bool	false	Whether to scale the image when it is polled.

Instance methods

Method	Params	Description
openModal	-	Open image modal
closeModal	-	Close image modal.

LICENSE MIT

react-native-zoom-image's Issues

安装有问题啊

装不上

是否支持多张图左右滑动

原生实现的大图浏览，左右滑动带有弹性效果，包括双击放大，拖拽等，都有很多动画效果，这些用 RN 实现貌似体验上差异很大，这个组件是否支持呢？

Carousel Usage

Can i use this component as an image slider/carousel?

change image source

我修改了一下你的库，当不点击的时候显示中等清晰度的图片，然后点击的时候我替换成高清图片地址。但是替换完成后弹出来的Modal展示的图片尺寸不对，显示的是一个截取后的正方形图片。有没有什么办法解决这个问题呀，谢谢

安卓本地图片支持吗

no onload property?