Surface Duo용 TwoPaneView React Native

  • 아티클

여기에 표시된 태그를 사용하여 동적 레이아웃을 만들 수 있습니다.

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

panePriority 레이아웃의 다른 기능을 사용하면 각 화면 구성에 표시되는 내용을 제어할 수 있습니다. Windows TwoPaneView 설명서 및 API 참조는 컨트롤의 작동 방식에 대한 몇 가지 힌트를 제공합니다(아직 미리 보기 상태임을 기억하세요!).

설치

react-native-twopaneview 설치 지침을 따릅니다.

  1. Android/build.gradle을 수정하여 Kotlin 지원을 추가합니다.

    buildscript {
  ext {
    ...
+   kotlinVersion = "1.3.50"
  }
...

  dependencies {
+   classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:${kotlinVersion}")
...

  2. 실행 npm install react-native-twopaneview 하여 패키지를 추가합니다.

  3. 다음 옵션을 포함하여 수정 android:configChanges 합니다.

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

샘플

설치되면 샘플 에 사용해 보세요.

원본

TwoPaneView는 GitHub 사용할 수 있는 오픈 소스 구성 요소입니다.