.NET MAUI TwoPaneView 版面配置

TwoPaneLayout 控制項提供具有兩個子系的調適型配置容器： Pane1 和 Pane2 。 在雙螢幕和可折迭裝置上，控制項會將窗格放在轉軸或折迭的任一端。 在所有其他裝置類型上，配置行為是可設定的，而且可以根據控制項上設定的屬性來顯示一或兩個窗格。

開始使用

新增Microsoft.Maui.Controls.Foldable NuGet，即可在.NET MAUI 檔中取得將 TwoPaneView 控制項新增至專案的指示。

下列程式碼是 TwoPaneView 的簡單 XAML 範例，其中顯示：

• foldable 根項目中所需的命名空間
• 在 TwoPaneView 元素上設定的屬性 (也可以使用系結或以程式設計方式設定)
• Pane1 和 Pane2 您新增版面配置的容器

<ContentPage xmlns:foldable="clr-namespace:Microsoft.Maui.Controls.Foldable;assembly=Microsoft.Maui.Controls.Foldable">
    <foldable:TwoPaneView
            TallModeConfiguration="SinglePane"
            WideModeConfiguration="LeftRight"
            PanePriority="Pane1">
        <foldable:TwoPaneView.Pane1>
            <StackLayout>
                <Label Text="Pane1 Content" />
            </StackLayout>
        </foldable:TwoPaneView.Pane1>
        <foldable:TwoPaneView.Pane2>
            <StackLayout>
                <Label Text="Pane2 Content" />
            </StackLayout>
        </foldable:TwoPaneView.Pane2>
    </foldable:TwoPaneView>
</ContentPage>

根據預設，TwoPaneView 會嘗試一律轉譯這兩個窗格，這表示當應用程式在單一螢幕上執行時，檢視會在兩個窗格之間分割。 當只有一個畫面上呈現時，可以使用下列屬性來影響版面配置：

• MinTallModeHeight – 指出控制項必須進入高模式的最低高度。
• MinWideModeWidth – 指出控制項必須進入 Wide 模式的最小寬度。
• Pane1Length – 以 Wide 模式設定 的 Pane1Pane1 寬度、高模式的高度，而且在 SinglePane 模式中沒有任何作用。
• Pane2Length – 以 Wide 模式設定 的 Pane2 寬度、 Pane2 高模式的高度，在 SinglePane 模式中沒有任何作用。

在 Surface Duo (和其他可折迭裝置) 上，應用程式可以跨越轉軸或折迭。 TwoPaneView 控制項具有額外屬性，其可決定兩個窗格相互呈現的方式 (在單螢幕或雙螢幕中皆相同)：

• TallModeConfiguration – 當處於高模式時，窗格可以是 Top/Bottom、Bottom/Top，或只能顯示單一窗格。
• WideModeConfiguration – 在寬模式中時，窗格可以是 Left/Right、Right/Left 或單一窗格。
• PanePriority – 是要顯示 Pane1 ，還是 Pane2 選擇在 SinglePane 模式中為高或寬模式。

顯示模式有三種：

• SinglePane – 目前只顯示一個窗格。
• Wide – 水平配置這兩個窗格。 其中一個窗格置於左邊，另一個則置於右邊。 在 Surface Duo 上，兩個畫面處於直向模式。
• Tall – 垂直配置這兩個窗格。 其中一個窗格置於上方，另一個則置於下方。 在 Surface Duo 上，兩個畫面處於橫向模式。

範例

從 GitHub 下載並執行 TwoPaneView 遊樂場範例 。 此螢幕擷取畫面顯示範例如何公開 TwoPaneView 控制項的各種屬性以進行實驗：

疑難排解

如果您從 觀察到非預期的行為或配置 TwoPaneView ，請檢查 設定指示，包括 UseFoldable() 產生器方法和 ConfigurationChanges 屬性。