React Native TwoPaneView para o Surface Duo

Você pode criar um layout dinâmico com a marcação mostrada aqui:

<TwoPaneView panePriority={this.state.panePriority} panePriorityVerticalSpanning={this.state.panePriority} >
    {/* Pane A */}
    <MasterContent/>
    {/* Pane B */}
    <DetailContent/>
</TwoPaneView>

O panePriority e outros recursos do layout permitem controlar o que é mostrado em cada configuração de tela. a documentação do Windows TwoPaneView e a referência de API fornecem algumas dicas sobre como o controle funciona (embora lembre-se de que ele ainda está em visualização!).

Instalação

Siga as instruções de instalação reagir-Native-twopaneview :

  1. Modifique Android/Build. gradle para adicionar suporte a Kotlin:

    buildscript {
      ext {
        ...
    +   kotlinVersion = "1.3.50"
      }
    ...
    
      dependencies {
    +   classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:${kotlinVersion}")
    ...
    
  2. Execute npm install react-native-twopaneview para adicionar o pacote.

  3. Modifique android:configChanges incluindo estas opções:

    android:configChanges="keyboard|keyboardHidden|orientation|screenSize|smallestScreenSize|screenLayout"
    

Exemplos

Depois de instalado, dê uma tentativa aos exemplos .

Origem

TwoPaneView é um componente de código-fonte aberto, disponível em GitHub.