第 2 章的摘要。 應用程式剖析

注意

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

Xamarin.Forms在應用程式中,佔用螢幕上空間的對象稱為視覺元素,由 VisualElement 類別封裝。 Visual Elements 可以分割成三個對應至這些類別的類別:

Page衍生專案會佔用整個螢幕,或幾乎整個螢幕。 頁面 Layout 的子系通常是用來組織子視覺元素的衍生專案。 的 Layout 子系可以是其他 Layout 類別或 View 衍生專案(通常稱為 元素),這些是熟悉的物件,例如文字、點陣圖、滑桿、按鈕、清單框等等。

本章示範如何藉由將 焦點放在 Label,也就是顯示文字的 View 衍生專案,來建立應用程式。

Say hello

安裝 Xamarin 平臺後,您可以在 Visual Studio 或 Visual Studio for Mac 中建立新的 Xamarin.Forms 解決方案。 Hello 解決方案會針對一般程式代碼使用可攜式類別庫。

注意

可攜式類別庫已由 .NET Standard 連結庫取代。 書籍中的所有範例程式代碼都已轉換為使用 .NET 標準連結庫。

此範例示範在 Xamarin.Forms Visual Studio 中建立的解決方案,而不需要修改。 解決方案包含四個專案:

注意

Xamarin.Forms不再支援 Windows 8.1、Windows 電話 8.1 或 Windows 10 行動裝置版,但Xamarin.Forms應用程式會在 Windows 10 桌面上執行。

您可以將其中任何一個應用程式項目設為啟始專案,然後在裝置或模擬器上建置並執行程式。

在您的許多 Xamarin.Forms 程式中,您不會修改應用程式專案。 這些通常仍然很小的存根只是為了啟動程式。 您大部分的焦點都是所有應用程式通用的連結庫。

檔案內部

Hello 程式所顯示的視覺效果定義於 類別的App建構函式中。 App 衍生自 Xamarin.Forms 類別 Application

注意

使用 XAML 檔案建立頁面的 Visual Studio 解決方案範本 Xamarin.Forms 。 直到第 7 章,本書才會涵蓋 XAML。

Hello PCL 專案的 [參考] 區段包含下列Xamarin.Forms元件:

  • Xamarin.Forms.核心
  • Xamarin.Forms.Xaml
  • Xamarin.Forms平台

五個應用程式專案的 [參考] 區段包含適用於個別平臺的其他元件:

  • Xamarin.Forms.Platform.Android
  • Xamarin.Forms.Platform.iOS
  • Xamarin.Forms.Platform.UWP
  • Xamarin.Forms.Platform.WinRT
  • Xamarin.Forms.Platform.WinRT.Tablet
  • Xamarin.Forms.Platform.WinRT。電話

注意

這些專案 的 [參考] 區段不再列出元件。 相反地,專案檔包含參考 NuGet 套件的 Xamarin.Forms PackageReference 標籤。 Visual Studio 中的 [參考] 區段會列出Xamarin.Forms套件,而不是Xamarin.Forms元件。

每個應用程式專案都包含對命名空間中靜態 Forms.Init 方法的 Xamarin.Forms 呼叫。 這會初始化連結 Xamarin.Forms 庫。 每個平台都會定義不同版本的 Forms.Init 。 您可以在下列類別中找到對此方法的呼叫:

此外,每個平臺都必須具現化 App 共用文檔庫中的類別位置。 這會在下列類別的呼叫 LoadApplication 中發生:

否則,這些應用程式專案通常是「不執行任何動作」程式。

PCL 或 SAP?

在可攜式類別庫 (PCL) 或共用資產專案 (SAP) 中,可以建立 Xamarin.Forms 具有通用程式代碼的解決方案。 若要建立 SAP 解決方案,請選取 Visual Studio 中的 [共用] 選項。 HelloSap 解決方案示範不修改的 SAP 範本。

注意

可攜式類別庫已由 .NET Standard 連結庫取代。 書籍中的所有範例程式代碼都已轉換為使用 .NET 標準連結庫。 否則,PCL 和 .NET Standard 連結庫在概念上非常類似。

連結庫方法會將平臺應用程式專案所參考的連結庫專案中的所有通用程式代碼組合在一起。 透過 SAP 方法,通用程式代碼實際上存在於所有平臺應用程式專案中,而且會在其中共用。

大部分 Xamarin.Forms 的開發人員偏好連結庫方法。 在這本書中,大部分的解決方案都使用連結庫。 那些使用 SAP 的人會在 項目名稱中包含 Sap 後綴。

透過 SAP 方法,共享專案中的程式代碼可以使用 C# 預處理器指示詞 (#if, #elif, 和 #endif) 搭配這些預先定義的識別元,為各種平台執行不同的程式碼:

  • Ios: __IOS__
  • Android: __ANDROID__
  • UWP: WINDOWS_UWP

在共享連結庫中,您可以判斷您在運行時間執行的平臺,如本章稍後所示。

文字的標籤

Greetings 解決方案示範如何將新的 C# 檔案新增至 Greetings 專案。 此檔案會定義名為 GreetingsPage 的類別,該類別衍生自 ContentPage。 在這本書中,大部分的專案都包含單 ContentPage 一衍生專案,其名稱為附加後綴 Page 的專案名稱。

建構函式會 GreetingsPage 具現化 Label 檢視,這是顯示文字的 Xamarin.Forms 檢視。 屬性 Text 會設定為 所 Label顯示的文字。 此程式會將 設定 LabelContentContentPage屬性。 類別的 App 建構函式接著會具現化 GreetingsPage ,並將其設定為其 MainPage 屬性。

文字會顯示在頁面左上角。 在 iOS 上,這表示其與頁面的狀態欄重疊。 此問題有數個解決方案:

解決方案 1. 在頁面上包含邊框間距

Padding設定頁面上的屬性。 Padding 類型 Thickness為 ,結構具有四個屬性:

Padding 定義排除內容之頁面內的區域。 這可讓 Label 避免覆寫 iOS 狀態列。

解決方案 2. 只包含 iOS 的填補(僅限 SAP)

只在 iOS 上使用 SAP 搭配 C# 預處理器指示詞來設定 'Padding' 屬性。 這在 GreetingsSap 解決方案中示範。

解決方案 3. 只包含 iOS 的填補(PCL 或 SAP)

在用於書籍的 Xamarin.Forms 版本中,Padding可以使用 或 Device.OnPlatform<T> 靜態方法來選取 Device.OnPlatform PCL 或 SAP 中 iOS 特有的屬性。 這些方法現在已被取代

方法 Device.OnPlatform 可用來執行平臺特定的程式代碼,或選取平臺特定的值。 在內部,它們會使用 Device.OS 靜態只讀屬性,這會傳回 列舉的成員 TargetPlatform

Device.OnPlatform方法、Device.OS屬性和TargetPlatform列舉現在都已被取代。 請改用 屬性, Device.RuntimePlatform 並將傳回值與下列靜態欄位進行比較 string

  • iOS,字串 “iOS”
  • Android,字串 “Android”
  • UWP,字串 “UWP”,參考 通用 Windows 平台

靜態 Device.Idiom 唯讀屬性是相關的。 這會傳回 的成員 TargetIdiom,其具有下列成員:

針對 iOS 和 Android,和 Phone 之間的Tablet截斷是 600 個單位的直向寬度。 針對 Windows 平臺, Desktop 表示在 Windows 10 下執行的 UWP 應用程式,並 Phone 指出在 Windows 10 應用程式下執行的 UWP 應用程式。

解決方案 3a. 在標籤上設定邊界

屬性 Margin 已引入太晚,無法包含在書籍中,但它也是型 Thickness 別,您可以在 上 Label 設定它,以定義檢視以外的區域,該區域包含在檢視的版面配置計算中。

屬性 Padding 僅適用於 LayoutPage 衍生專案。 屬性 Margin 適用於所有 View 衍生專案。

解決方案 4. 將標籤在頁面內

您可以將 LabelPage 的屬性VerticalOptionsLabel設定HorizontalOptions為類型的LayoutOptions值,將內置中 (或將它放在其他八個位置的其中一個中)。 結構 LayoutOptions 會定義兩個屬性:

一般而言,這些屬性不會直接使用。 相反地,這兩個屬性的組合是由類型的 LayoutOptions八個靜態只讀屬性所提供:

HorizontalOptionsVerticalOptions 是版面配置中 Xamarin.Forms 最重要的屬性,並在第 4 章中 更詳細地討論。捲動堆疊

以下是兩者都設定LayoutOptions.Center為 的 HorizontalOptionsVerticalOptions 屬性Label的結果:

問候語程式的三重螢幕快照

解決方案 5. 將標籤內的文字置中

您也可以將 的 屬性VerticalTextAlignmentLabel設定HorizontalTextAlignment為 列舉成員TextAlignment,將 文字置中(或將文字放在頁面上的八個其他位置中:

  • Start,表示左或上層 (視方向而定)
  • Center
  • End,表示右或下 (視方向而定)

這兩個屬性只由 Label定義,而 HorizontalAlignmentVerticalAlignment 屬性則由所有View衍生專案定義View及繼承。 視覺效果結果看起來可能很類似,但與下一章所示範的非常不同。