React Native Portal

React Native Portal

Render a component anywhere. Anything inside a <Portal> component will be rendered on an ancestor <Portal.Host> component.

Installation

npm i --save @burstware/react-native-portal

Usage

import React from 'react'
import { View, Text, StyleSheet } from 'react-native'
import Portal from '@burstware/react-native-portal'

function Test (props) {
  return (
    <View style={[StyleSheet.absoluteFill, { alignItems: 'center', backgroundColor: 'blue' }]}>
      <Portal.Host>
        <View style={{ width: '75%', height: '100%' }}>
          <Portal>
            <View style={{ width: '100%', height: '100%', backgroundColor: 'white' }}>
              <Text>This should be on top</Text>
            </View>
          </Portal>
        </View>
      </Portal.Host>
    </View>
  )
}

Documentation

npm start