Skip to content

I can not found a befitting viewer in Github ๐Ÿ˜Œ๐Ÿ˜Œ๏ผŒso I have to write one.

Notifications You must be signed in to change notification settings

dashdoc/react-native-single-image-zoom-viewer

ย 
ย 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

14 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

react-native-single-image-zoom-viewer

move && zoom anywhere

Getting Start

install

npm i react-native-single-image-zoom-viewer --save

import & use

// import
import SingleImageZoomViewer from 'react-native-single-image-zoom-viewer'

// use in any component
// use remote image from uri
<SingleImageZoomViewer source={{uri:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=1972890221,1494503013&fm=26&gp=0.jpg'}}/>

// use local image,
<SingleImageZoomViewer source={require('./example-image.png')} width={200} height={{200}}/>

props

props type needed detail default
source RN Image Source yes use {uri:uri} or require('local uri') like use React Native Image none
width Number no if the source is {uri:uri},it will auto set,if not it is default to be 200,or your setting see detail
height Number same as width same as width
style Object no the container style object {flex:1,backgroundColor:'black'}

Problem may occur

use http resource

  1. open info.plist in Xcode
  2. add App Transport security setting below Information Property List
  3. add Allow Arbitrary Load below App Transport security setting and set value yes

About

I can not found a befitting viewer in Github ๐Ÿ˜Œ๐Ÿ˜Œ๏ผŒso I have to write one.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%