react-native-modal-dialog

For more usage, goto this online example: expo

# install
npm install react-native-modal-dialog --save

Simple use:

    // Inject method:
    render() {
        return <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#eee', }}>
            <Text style={styles.textButton} onPress={() => { this.refs.dialog.alert("message") }}>Alert</Text>
            <Text style={styles.textButton} onPress={() => { this.refs.dialog.confirm("message") }}>Confirm</Text>
            <Text style={styles.textButton} onPress={() => {
                this.refs.dialog.prompt("message", "placeholder", (text) => { this.setState({ text, }) }, );
            }}>Prompt:{this.state.text}</Text>
            {Dialog.inject()}
        </View>;
    };
    // Pre-build method:
    return <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#eee', }}>
        <Text style={styles.textButton} onPress={() => { this.refs.alert.show() }}>Alert</Text>
        <Text style={styles.textButton} onPress={() => { this.refs.confirm.show() }}>Confirm</Text>
        <Text style={styles.textButton} onPress={() => { this.refs.prompt.show(); }}>Prompt:{this.state.text}</Text>
        <Alert ref='alert' message='message'></Alert>
        <Confirm ref='confirm'><Text>children</Text></Confirm>
        <Prompt ref='prompt'>
            <TextInput placeholder='first' />
            <TextInput placeholder='second' />
        </Prompt>
    </View>;
    // {Xxx.inject()} == <Xxx ref='xxx'></Xxx>
    // this.refs.dialog.xxx(message, {...}) == this.refs.xxx.show({...})

Custom use: Example.js