react-native-viewer

show a ReactNative Component (Image or Gif or View) in fullscreen mode

Getting started

$ npm install react-native-viewer

OR

$ yarn add react-native-viewer

Usage

import RNViewer from "react-native-viewer";
 
export default class App extends Component {
  render() {
    return (
      <View style={{flex:1,justifyContent:'center',alignItems:'center'}}>
        <View
          style={{
            height: 100,
            width: 100,
          }}
        >
          <RNViewer
            style={{
              height: 100,
              width: 100
            }}
            realSize={{ width: ScreenWidth, height: ScreenWidth }}>
                <MyCustomComponent />
            </RNViewer>
        </View>
      </View>
    );
  }
}

props

prop	desc	example
style	component general style	{}
topBar	topBar component
topBarStyle	topBar component style	{}
bottomBar	bottomBar component
bottomBarStyle	bottomBar component style	{}
fullScreenSize	childComponent realSize( size in fullScreen )	{ width:300,heigth:300 }