如何从选项卡屏幕导航到外部屏幕?

时间:2019-09-23 18:27:13

标签: reactjs react-native react-navigation react-navigation-stack

我一直试图通过单击选项卡屏幕上的操作按钮来打开相机模块。但是我刚刚能够在选项卡中打开这台相机,这是我不想要的。

如何在选项卡之外显示相机?

那是我的代码:

import React from 'react'
import { 
    View, 
    ScrollView
 } from 'react-native'
import ActionButton from 'react-native-action-button'
import { Icon } from 'react-native-elements'
import { createStackNavigator } from 'react-navigation-stack'
import { createAppContainer } from 'react-navigation'

import Cards from '../../componentes/Card'
import Camera from './LeitorQR'


class Manual extends React.Component {
    static navigationOptions = {
        header: null
    }
    render() {

        return (
            <View style={{ flex: 1, backgroundColor: '#eff2f7' }}>

                <ScrollView style={{ flex: 1 }}>
                    <Cards
                        image={{ uri: 'https://img.freepik.com/fotos-gratis/torneira-de-agua-aberta_23-2148113510.jpg?size=626&ext=jpg' }}
                        title='exemplo'
                        subtitle='asdasd'
                        linkManual='https://react-native-training.github.io/react-native-elements/docs/card.html#image'
                        linkVideo='https://react-native-training.github.io/react-native-elements/docs/card.html#image'
                    />
                </ScrollView>

                <ActionButton buttonColor='#3c4858' position='right'>

                    <ActionButton.Item
                        buttonColor='#8492a6'
                        title='Escanear'
                        size={50}
                        onPress={() => this.props.navigation.navigate('Camera')} >

                        <Icon name='barcode-scan'
                            color='white'
                            type="material-community" />

                    </ActionButton.Item>

                    <ActionButton.Item
                        buttonColor='#8492a6'
                        title='Digitar Código'
                        size={50}
                        onPress={() => null}>

                        <Icon name='barcode'
                            color='white'
                            type="material-community"
                        />

                    </ActionButton.Item>

                </ActionButton>

            </View>

        )
    }
}


const CameraStack = createStackNavigator({
    Manual: Manual,
    Camera: Camera
})

const ManualContainer = createAppContainer(CameraStack)

export default ManualContainer

除了this.props.navigation.navigate function

,我不知道其他任何方式

0 个答案:

没有答案