React-native-router-flux: Como usar o modal

Tente colocar sua cena root dentro do modal.
Como isso:

<Router>
    <Scene key="modal" modal>
       <Scene key="root" hideNavBar hideTabBar>
            <Scene key="tabBar" tabs>
              <Scene key="listings" component={Listings} title="Listings" initial right={MapButton} />
              <Scene key="favorites" component={Favorites} title="Favorites" />
              <Scene key="messages" component={Messages} title="Messages" />
              <Scene key="profile" component={Profile} title="Profile" />
            </Scene>
        </Scene>
        <Scene key="map" component={Map} title="Map" hideNavBar />

Você deve fazer a cena raiz como modal como @luco sugeriu. Por favor, verifique o projeto de exemplo, o login é implementado como modal

Isso ainda não funciona.

<Router>
    <Scene key="modal" modal>
      <Scene key="root" hideNavBar hideTabBar>
        <Scene key="tabBar" tabs>
          <Scene key="listings" component={Listings} title="Listings" initial right={MapButton} />
          <Scene key="favorites" component={Favorites} title="Favorites" />
          <Scene key="messages" component={Messages} title="Messages" />
          <Scene key="profile" component={Profile} title="Profile" />
        </Scene>
        <Scene key="map" component={Map} title="Map" hideNavBar />
        <Scene key="listingDetail" component={ListingDetail} title="Listing Detail" clone />
      </Scene>
    </Scene>
  </Router>

Não faz sentido para mim que envolver tudo na cena modal faria com que uma cena específica fosse modal quando não quero que o resto (como ListingDetail) seja modal. Existe um parâmetro específico em Actions.map que eu preciso usar?

Infelizmente, é um problema de navegação de reação - ele não suporta animações diferentes para filhos de pilha. Não consigo reproduzir seu problema (o código parece bom), é por isso que peço a todos que bifurquem e modifiquem este exemplo de repositório se quiserem que seus problemas sejam resolvidos. O modal de login do exemplo funciona bem como você pode ver

Então você está dizendo que não há como oferecer suporte a uma transição modal para iOS? Ou seja, um que desliza do fundo?

O que você quer dizer? Eu te disse duas vezes que o Example tem tela de login modal (que desliza de baixo para cima)

Ok, mas você também disse que meu código parece bom ....

Eu tentei o meu melhor para seguir o exemplo, mas como não há documentação, não posso dizer qual é o motivo de tudo estar lá. Não posso simplesmente copiar e colar esse código, pois obviamente minhas rotas são diferentes.

O mesmo eu poderia dizer sobre seu código - não vejo todo o projeto e todos os detalhes. Por exemplo, você pode usar Actions.map e pode até não ser gerado (e ser nulo) durante a compilação.

Será um prazer fornecer mais exemplos de código se você me informar o que precisa. Actions.map funciona, apenas faz a transição do lado para dentro do que eu espero que seja do fundo.

Você está dizendo que não pode ter transições push e modal no mesmo aplicativo?

OH MEU DEUS. Não no aplicativo, mas em um contêiner. Após uma análise mais profunda, seu código apresenta erro - 'map' ainda filho do contêiner 'normal' (key = root), não modal (key = 'modal'). Parece que você não entende o que está fazendo. Talvez este componente seja muito complexo para você...

Tente isto:

<Router>
    <Scene key="modal" modal>
      <Scene key="root" hideNavBar hideTabBar>
        <Scene key="tabBar" tabs>
          <Scene key="listings" component={Listings} title="Listings" initial right={MapButton} />
          <Scene key="favorites" component={Favorites} title="Favorites" />
          <Scene key="messages" component={Messages} title="Messages" />
          <Scene key="profile" component={Profile} title="Profile" />
        </Scene>
      </Scene>
        <Scene key="map" component={Map} title="Map" hideNavBar />
        <Scene key="listingDetail" component={ListingDetail} title="Listing Detail" clone />
    </Scene>
  </Router>

Obrigado, isso corrige o problema. Como você espera que eu entenda algo quando não há uma linha de documentação sobre isso? Tem havido muitas pessoas abrindo questões sobre esse recurso modal, talvez isso seja um indicativo da necessidade de documentos ...

Alguns posts recentes aqui são sobre sintaxe JSX e entendimento de containers de navegação, não sobre documentação.
Adicionei mais informações sobre modal.

Oi,

trabalhou para mim

<Router navigationBarStyle={{backgroundColor: '#FF5722'}} titleStyle={{color: '#fff'}}>
        <Modal>
            <Stack key="root">
                <Scene key='login_screen' component={LoginScreen} title='login' hideNavBar={true} />
            </Stack>
            <Scene key='cadastro_screen' component={CadastroScreen} title='Cadastro' hideNavBar={false} />
        </Modal>
</Router>

Quando adiciono o wrapper modal, recebo 2 navbar na parte superior da minha visualização, quando adiciono hideNavBar, ambos desaparecem. Como posso resolver esse problema, quero apenas uma barra de guias e não duas obviamente ... ?

Use <Modal hideNavBar> porque <Modal> vai adicionar sua própria barra de navegação, então você acaba tendo duas com a da sua cena raiz.