第 25 章的摘要。 頁面變化

  • 發行項

Download Sample 下載範例

注意

這本書於2016年春季出版，此後一直沒有更新。 這本書中有很多仍然有價值，但一些材料已經過時，有些主題不再完全正確或完整。

到目前為止，您已看到兩個衍生自 Page的類別： ContentPage 和 NavigationPage。 本章提供另外兩個：

這些頁面類型提供比 NavagationPage 第 24 章所 討論更複雜的瀏覽選項。頁面流覽。

主圖形和詳細數據

MasterDetailPage定義 類型的兩個Page屬性： Master 和 Detail。 一般而言，您會將每一個屬性設定為 ContentPage。 這 MasterDetailPage 兩個頁面之間的顯示和切換。

在這兩個頁面之間切換有兩種基本方式：

  • 分割 主要和詳細數據並排的位置
  • 詳細數據頁面涵蓋或部分涵蓋主版頁面的彈出視窗

快顯方法有數種變化（投影片、重疊和交換），但這些通常是平臺相依的。 您可以將 的 MasterDetailPage 屬性設定MasterDetailBehavior為 列舉的成員MasterBehavior：

不過，此屬性對手機沒有任何影響。 電話 一律有快顯行為。 只有平板電腦和桌面視窗可以有分割行為。

探索行為

MasterDetailBehaviors 範例可讓您試驗不同裝置上的預設行為。 此程式包含主圖形和詳細數據的兩個不同的 ContentPage 衍生專案（兩者皆設定屬性），另一個 Title 衍生自 MasterDetailPage 的類別會結合它們。 詳細數據頁面會括在 中 NavigationPage ，因為UWP程式在不使用它的情況下將無法運作。

Windows 8.1 和 Windows 電話 8.1 平臺需要將點陣圖設定為Icon主版頁面的 屬性。

回到學校

SchoolAndDetail 範例採用稍微不同的方法來建構程式，以顯示 SchoolOfFineArt 文檔庫中的學生。

Master和 Detail 屬性是使用 SchoolAndDetailPage.xaml 檔案中的可視化樹狀結構定義，其衍生自 MasterDetailPage。 這種排列方式可讓數據系結在主頁面和詳細數據頁面之間設定。

這個 XAML 檔案也會將 IsPresented 的 MasterDetailPage 屬性設定為 True。 這會導致主版頁面在啟動時顯示;預設會顯示詳細數據頁面。 當從ListView主版頁面選擇項目時，SchoolAndDetailPage.xaml.cs檔案會設定IsPresented為 false 。 然後會顯示詳細資料頁面：

Triple screenshot of School And Detail

您自己的使用者介面

雖然 Xamarin.Forms 提供使用者介面以在主檢視和詳細數據檢視之間切換，但您可以自行提供。 若要這麼做︰

  • 將 IsGestureEnabled 屬性設定為 false 以停用撥動
  • ShouldShowToolbarButton覆寫 方法並返回false以隱藏 Windows 8.1 和 Windows 電話 8.1 上的工具列按鈕。

然後，您必須提供在主版和詳細數據頁面之間切換的方法，例如 ColorsDetail 範例所示範。

MasterDetailTaps 範例示範在主版和詳細數據頁面上使用 TapGestureRecognizer 的另一種方法。

TabbedPage

TabbedPage是頁面集合，您可以在使用索引標籤之間切換。 其衍生自 MultiPage<Page> ，且不會定義自己的公用屬性或方法。 MultiPage<T>不過，會定義 屬性：

您可以使用頁面物件填入此 Children 集合。

另一種方法可讓您使用這兩個ListView屬性自動產生索引卷標式頁面，來定義TabbedPage子系，就像這樣：

不過，當集合包含多個專案時，此方法在iOS上無法正常運作。

MultiPage<T> 定義另外兩個屬性，讓您追蹤目前檢視的頁面：

MultiPage<T> 也會定義兩個事件：

離散索引標籤面

DiscreteTabbedColors 範例包含三個索引卷標式頁面，以三種不同的方式顯示色彩。 每個索引標籤都是 ContentPage 衍生專案，然後 TabbedPage 衍生 的 DiscreteTabbedColorsPage.xaml 會結合這三個頁面。

針對出現在 TabbedPage中的每個頁面， Title 屬性都必須在索引標籤中指定文字，而 Apple Store 也需要使用圖示，因此 Icon 屬性會設定為 iOS：

Triple screenshot of Discrete Tabbed Colors

StudentNotes 範例的首頁會列出所有學生。 點選學生時，這會巡覽至衍生工具 StudentNotesDataPage，其可視化樹狀結構中包含三ContentPage個TabbedPage物件，其中一個允許為該學生輸入一些筆記。

使用 ItemTemplate

MultiTabbedColor 範例會使用 NamedColor Book.Toolkit 連結庫中的Xamarin.Forms 類別。 MultiTabbedColorsPage.xaml 檔案會將 DataTemplate 的 屬性TabbedPage設定為可視化樹狀結構，其開頭ContentPage包含 屬性的系結NamedColor（包括 屬性的Title系結）。

不過，這在iOS上是有問題的。 只有少數專案可以顯示，而且沒有好方法給他們圖示。