Bagikan melalui

Tata letak Xamarin.Forms TwoPaneView

  • Artikel

Kontrol TwoPaneView tersedia di pratinjau Xamarin.Forms.DualScreen NuGet . Kode berikut menunjukkan contoh XAML sederhana:

<ContentPage xmlns:dualScreen="clr-namespace:Xamarin.Forms.DualScreen;assembly=Xamarin.Forms.DualScreen">
    <dualScreen:TwoPaneView>
        <dualScreen:TwoPaneView.Pane1>
            <StackLayout>
                <Label Text="Pane1 Content" />
            </StackLayout>
        </dualScreen:TwoPaneView.Pane1>
        <dualScreen:TwoPaneView.Pane2>
            <StackLayout>
                <Label Text="Pane2 Content" />
            </StackLayout>
        </dualScreen:TwoPaneView.Pane2>
    </dualScreen:TwoPaneView>
</ContentPage>

Secara default TwoPaneView akan mencoba untuk selalu merender kedua panel, yang berarti bahwa saat aplikasi berjalan pada satu layar, tampilan akan dibagi di antara dua panel. Properti berikut ini dapat digunakan untuk memengaruhi tata letak saat hanya dirender pada satu layar:

  • MinTallModeHeight – menunjukkan tinggi minimum kontrol agar dapat memasuki mode tinggi.
  • MinWideModeWidth – menunjukkan lebar minimum kontrol agar dapat memasuki mode lebar.
  • Pane1Length – mengatur lebar Panel1 dalam mode Lebar, tinggi Panel1 dalam mode Tinggi, dan tidak berpengaruh dalam mode SinglePane.
  • Pane2Length – mengatur lebar Panel2 dalam mode Lebar, tinggi Panel2 dalam mode Tinggi, dan tidak berpengaruh dalam mode SinglePane.

Pada Surface Duo, aplikasi dapat dibenamkan di dua layar. Kontrol TwoPaneView memiliki properti tambahan yang menentukan di mana kedua panel dirender terkait satu sama lain (dalam layar tunggal atau ganda):

  • TallModeConfiguration – saat dalam mode tinggi, panel dapat berupa Atas/Bawah, Bawah/Atas, atau satu panel hanya dapat ditampilkan.
  • WideModeConfiguration – saat dalam mode lebar, panel dapat berupa Kiri/Kanan, Kanan/Kiri, atau satu panel saja.
  • PanePriority – apakah akan menampilkan Panel1 atau Panel2 jika dalam mode SinglePane dipilih untuk mode tinggi atau lebar.

Ada tiga mode tampilan:

  • SinglePane – hanya satu panel yang saat ini terlihat.
  • Lebar – dua panel ditata secara horizontal. Satu panel berada di sebelah kiri dan panel lainnya berada di sebelah kanan. Pada Surface Duo kedua layar berada dalam mode potret.
  • Tinggi – dua panel ditata secara vertikal. Satu panel berada di atas dan panel lainnya berada di bawah. Pada Surface Duo kedua layar berada dalam mode lanskap.

Baca selengkapnya di dokumentasi Xamarin. Beberapa pertimbangan desain dalam dokumentasi UWP TwoPaneView juga berlaku untuk kontrol Xamarin.

Pemecahan Masalah

Jika Anda mengamati perilaku atau tata letak yang tidak terduga dari TwoPaneView, periksa instruksi pengaturan, termasuk Init metode dan ConfigurationChanges atribut .