Como ter uma navegação em um modal com react-native-router-flux
Preciso ter uma navegação dentro de um modal no meu aplicativo nativo de reação
Usando a nova versão doreact-native-router-flux
, não parece possível fazer isso. Posso criar uma animação vertical para exibir a próxima cena, o que não é o mesmo que ter um modal no topo de uma cena.
<Scene key="login" direction="vertical">
<Scene key="loginModal" component={Login} schema="modal" title="Login"/>
<Scene key="loginModal2" hideNavBar={true} component={Login2} title="Login2"/>
</Scene>
No meu caso, preciso que meu modal tenha um fundo de cor transparente, para que eu possa ver a cena por trás do modal.
A única maneira de fazer isso seria usar o componente<Modal>
do react-native e ter uma navegação nele, mas não parece haver uma maneira de definir algo assim noRouter
.
O que eu precisaria é mais algo assim:
{/* LoginModal would be a wrapper which can render children */}
<Scene key="login" component={LoginModal}>
<Scene key="loginModal" component={Login} title="Login"/>
<Scene key="loginModal2" hideNavBar={true} component={Login2} title="Login2" panHandlers={null} duration={1}/>
</Scene>
Então, emLoginModal
seria renderizar algo como isto:
render(){
return (
<Modal animated={true} transparent={true} visible={true}>
{/* Render the scene that needs to be rendered,
including the navigation bar */}
{this.props.children}
</Modal>
);
Existe uma maneira de eu conseguir isso? Ou você conhece alguma maneira melhor de ter um sistema de rotas semelhante para reagir nativo?
Obrigado.