yarn add react-native-lightbox
navigator
property is optional but recommended on iOS, see next section for Navigator
configuration.
import Lightbox from 'react-native-lightbox'; const LightboxView ({ navigator }) => ( <Lightbox navigator={navigator}> <Image style={{ height: 300 }} source={{ uri: 'http://knittingisawesome.com/wp-content/uploads/2012/12/cat-wearing-a-reindeer-hat1.jpg' }} /> </Lightbox> );Navigator setup/Android support
For android support you must pass a reference to a Navigator
since it does not yet have the Modal
component and is not on the official todo list. See the Example
project for a complete example.
const renderScene = (route, navigator) => { const Component = route.component; return ( <Component navigator={navigator} route={route} {...route.passProps} /> ); }; const MyApp = () => ( <Navigator ref="navigator" style={{ flex: 1 }} renderScene={renderScene} initialRoute={{ component: LightboxView, }} /> );Prop Type Description
activeProps
object
Optional set of props applied to the content component when in lightbox mode. Usable for applying custom styles or higher resolution image source. renderHeader(close)
function
Custom header instead of default with X button renderContent
function
Custom lightbox content instead of default child content willClose
function
Triggered before lightbox is closed onClose
function
Triggered when lightbox is closed onOpen
function
Triggered when lightbox is opened didOpen
function
Triggered after lightbox is opened underlayColor
string
Color of touchable background, defaults to black
backgroundColor
string
Color of lightbox background, defaults to black
swipeToDismiss
bool
Enables gestures to dismiss the fullscreen mode by swiping up or down, defaults to true
. springConfig
object
Animated.spring
configuration, defaults to { tension: 30, friction: 7 }
.
Check full example in the Example
folder.
MIT License. © Joel Arvidsson
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4