Udostępnij za pośrednictwem

Xamarin.Forms Układ TwoPaneView

  • Artykuł

Klasa TwoPaneView reprezentuje kontener z dwoma widokami, które mają rozmiar i umieść zawartość w dostępnym miejscu — obok siebie lub u góry do dołu. TwoPaneView dziedziczy z Grid tak najprostszym sposobem, aby myśleć o tych właściwościach jest tak, jakby były stosowane do siatki.

Konfigurowanie obiektu TwoPaneView

Postępuj zgodnie z tymi instrukcjami, aby utworzyć układ dwuekranowy w aplikacji:

  1. Postępuj zgodnie z instrukcjami rozpoczynania pracy , aby dodać pakiet NuGet i skonfigurować klasę systemu Android MainActivity .

  2. Zacznij od podstaw TwoPaneView , używając następującego kodu XAML:

    <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>

Napiwek

Powyższy kod XAML pomija wiele typowych atrybutów z ContentPage elementu . Podczas dodawania elementu TwoPaneView do aplikacji pamiętaj, aby zadeklarować xmlns:dualScreen przestrzeń nazw, jak pokazano poniżej.

Omówienie trybów TwoPaneView

Tylko jeden z tych trybów może być aktywny:

  • SinglePane obecnie widoczne jest tylko jedno okienko.
  • Wide dwa okienka są ułożone poziomo. Jedno okienko znajduje się po lewej stronie, a drugie znajduje się po prawej stronie. Gdy na dwóch ekranach jest to tryb, gdy urządzenie jest pionowe.
  • Tall dwa okienka są rozmieszczone w pionie. Jedno okienko znajduje się u góry, a drugie znajduje się na dole. Gdy na dwóch ekranach jest to tryb, gdy urządzenie jest poziome.

Kontrolka TwoPaneView, gdy znajduje się tylko na jednym ekranie

Następujące właściwości mają zastosowanie w przypadku TwoPaneView zajmowania jednego ekranu:

  • MinTallModeHeight wskazuje minimalną wysokość kontrolki musi być w trybie wysokim.
  • MinWideModeWidth wskazuje minimalną szerokość kontrolki musi być w trybie szerokim.
  • Pane1Length Ustawia szerokość okienka Pane1 w trybie szerokim, wysokość okienka 1 w trybie Wysoki i nie ma wpływu na tryb SinglePane.
  • Pane2Length Ustawia szerokość okienka Pane2 w trybie szerokim, wysokość okienka 2 w trybie Wysoki i nie ma wpływu na tryb SinglePane.

Ważne

Jeśli element jest rozpięty TwoPaneView na dwóch ekranach, te właściwości nie mają wpływu.

Właściwości stosowane w przypadku jednego lub dwóch ekranów

Następujące właściwości mają zastosowanie w przypadku TwoPaneView zajmowania jednego lub dwóch ekranów:

  • TallModeConfiguration wskazuje, gdy w trybie wysokim, układ Górny/Dolny lub jeśli chcesz, aby tylko jedno okienko było widoczne zgodnie z definicją TwoPaneViewPriority.
  • WideModeConfiguration wskazuje, gdy w trybie szerokim układ lewy/prawy lub jeśli chcesz, aby tylko jedno okienko było widoczne zgodnie z definicją twoPaneViewPriority.
  • PanePriority Określa, czy ma być wyświetlane okienko1, czy okienko 2, czy w trybie SinglePane.