2018 年 9 月

第 33 卷 9

本文章是由機器翻譯。

Xamarin Forms-Xamarin 產能和 Visual Studio 2017 平台改善

藉由Alessandro Del Del |2018 年 9 月

使用 Xamarin 和 Visual Studio 中,在 Windows 和 Mac 上的行動裝置應用程式開發是 microsoft 已大量投資,以改善品質和其行動應用程式開發工具與平台的能力非常重要。在 5 月的 Build 2018 會議 Microsoft 宣佈了新一代的工具開發跨平台應用程式使用 C# 中,並著重於產能和效能。其中包括 Visual Studio 2017、 新功能與改進的 Visual Studio for Mac 的 Xamarin 工具和 Xamarin.Forms 3.0 的版本更新。

在本文中,我會說明適用於使用 C# 和 Visual Studio 2017,逐步解說的功能和解決問題在於舊版中的更新中的 Xamarin 的行動裝置應用程式開發人員最新消息。您需要 Visual Studio 2017 版本 15.7.3 或更新版本才可使用新的功能,但建議您安裝最新可用版本 (在本文撰寫 15.7.4)。我會先產能更新及 Visual Studio 2017 中,新增項目,然後我會描述什麼是適用於 iOS 和 Android 平台支援的新。

Visual Studio 2017 Tools for Xamarin

Visual Studio 2017 IDE 最近已新增和更新的工具改善適用於 Xamarin,包括 XAML 編輯器更新,適用於 iOS 和 Android 的更新、 增強的平台支援和 Xamarin.Forms 的新版本的整合式的工具。這些改進而言相當重要,值得討論,因此這篇文章的第一個部分將逐步引導完成相關的程式碼撰寫體驗和整合式平台支援的功能。

XAML 編輯器更新使用 Xamarin.Forms 開發人員將受益於新的 XAML 程式碼編輯器,現在由相同磁碟機的 Windows Presentation Foundation (WFP) 」 和 「 通用 Windows 平台 (UWP) 的引擎。這是非常重要的幾個原因:

  • 完整、 豐富的 IntelliSense 支援:舊版的 IntelliSense 無法讓撰寫 XAML 標記進行痛苦。新版本新增,我將說明更多詳細資料的 linting、 模糊比對和子字串比對。
  • 若要繫結運算式的增強的支援:IntelliSense 現在會列出可用的物件,如 {Binding} 標記延伸模組為基礎的繫結,並使用 {StaticResource} 標記延伸模組時也會列出可用的資源。
  • 快速動作與重構:燈泡建議現在都可在 Xamarin.Forms 中,XAML 的就如同已適用於 WPF 和 UWP,輕鬆地來解析 XML 命名空間、 移除未使用的命名空間,以及組織相關的語境建議使用的程式碼。

功能,稱為模糊比對提供的演算法,可協助您尋找適當的完成,根據您所輸入的內容。比方說,如果您輸入 Sdk,並按下 Tab 鍵,IntelliSense 會將 StackLayout 標記。當您輸入的控制項名稱相符的子字串提供可能的完成清單。例如,如果您輸入的版面配置時,IntelliSense 就會提供 StackLayout、 AbsoluteLayout 和 RelativeLayout 作為可能的完成,以及根據相同的輸入結尾標記 (請參閱**[圖 1**)。當您只記得控制項的名稱部分,這個功能就特別有用。

適用於 Xamarin.Forms XAML 編輯器中的比對的子字串
[圖 1 個相符的子字串在適用於 Xamarin.Forms XAML 編輯器

關於字串比對另一個有趣的功能是 CamelCase 比對,可提供 CamelCase 類型為基礎的快速鍵。比方說,如果您輸入 RL,然後按 Tab 鍵,編輯器會插入 RelativeLayout 標記。Linting,使用程式碼編輯器中立即識別一些程式碼問題,例如當已指定一次以上。

許多讀者會知道如何實用的功能,例如燈泡,快速動作與建議是,從 C# 程式碼編輯器和 XAML 程式碼編輯器,在 WPF 和 UWP 的使用經驗。現在這些函式可用於 Xamarin.Forms。比方說,如果偵測到的程式碼問題,您可以按一下燈泡圖示 (或按 Ctrl +。) 和 Visual Studio 會顯示可能的修正方法,如您在中所見**[圖 2**、 其中的程式碼編輯器會偵測遺漏的 XML 命名空間和建議新增適當的命名空間宣告。

燈泡會提供內建的程式碼問題的快速動作
[圖 2 燈泡會提供內建的程式碼問題的快速動作

您可以使用燈泡及快速動作,以移除未使用的命名空間及排序命名空間,以協助保持您的程式碼更簡潔。IntelliSense 也會有完整的支援,現在的繫結標記延伸使用的運算式。比方說,如果您有想要使用 PersonViewModel 類別做為您的 UI,而且繫結內容宣告為本機資源之後,IntelliSense 會那麼幫助您建立的繫結運算式顯示可用資源的清單。

使用繫結內容設定,IntelliSense 可協助建立繫結運算式,顯示的繫結的物件所公開的屬性清單。[圖 3提供的範例,您也可以看到名為 FullName,在檢視模型中定義的屬性。

IntelliSense 可讓您更輕鬆地建立繫結運算式
[圖 3 IntelliSense 可讓您更輕鬆地建立繫結運算式

除了繫結是受歡迎的現有功能,例如查看定義並移至定義,也就是現在更為可靠,Xamarin.Forms XAML 編輯器中的增強功能。事實上,這兩項功能是之前的最新的 Visual Studio 更新有問題。現在您可以快速瀏覽至物件或 XAML 或 C# 程式碼中定義的資源定義排除手動瀏覽您的程式碼的事半功倍的效果。查看定義會移至定義開啟不同的編輯器視窗,指向 [所需的資源時,直接在使用中編輯器視窗中,開啟互動式的快顯視窗。

Xamarin.iOS 遠端更新XAML 編輯體驗不是唯一的區域,Microsoft 努力提高生產力。適用於 Xamarin.iOS 工具也已經改良。

如您所知,建置使用 Visual Studio 2017 中的 Xamarin iOS 應用程式需要,您的 Windows PC 和 Mac 電腦上安裝相同版本的 Xamarin.iOS SDK。版本不相符時,Visual Studio 會回報警告,而且您必須手動更新您的 Mac。這不再是必要的。Visual Studio 2017 現在提供以代表您 Mac 上安裝 Xamarin.iOS SDK 最新版本。您只要按一下 [Mac] 對話方塊中之組中的安裝,並等候更新完成。

Xamarin 工具適用於自動 iOS 佈建for iOS 可讓您需要一些初稿步驟,建立應用程式可以是很複雜。除了註冊在 Apple Developer Program,才能讓您在 Apple 開發人員帳戶登入,並將應用程式發佈至 App Store,您需要佈建您的 iOS 裝置。iOS 佈建可讓您部署和測試您的裝置上的應用程式。iOS 佈建通常是透過在 mac 上 Xcode簡潔,將 iOS 佈建需要您:

  • 建立開發小組:這包括在開發小組,讓他們登入並發佈應用程式中指定的 Apple 開發人員帳戶清單。
  • 設定佈建設定檔:佈建設定檔會打包成已編譯的應用程式套件,且包含三個項目: 應用程式唯一識別碼 (應用程式識別碼)、 一個或多個測試實體裝置,以及列舉的唯一裝置識別碼 」 (UDI) 清單上的應用程式所需的開發憑證若要執行的應用程式允許的裝置。 
  • 建立簽署的憑證:必須簽署所有應用程式,才能在 iOS 裝置,甚至進行開發中, 執行,因此需要簽署的憑證。不同類型的憑證可用於根據訂用帳戶層級 (例如開發和發行) 的每個開發人員帳戶。

Microsoft 的 Xamarin 小組已建立實用的文件,說明如何開始使用 iOS 佈建 (bit.ly/2NhzO0O),但事實上,複雜度是想要建置的應用程式的開發人員的最大屏障iOS。幸運的是,最新版的 Visual Studio 2017 包括支援自動 iOS 佈建。您只需要提供您在 Apple 開發人員帳戶和 Visual Studio 2017 會設定所有必要的成品,代表您透過連線到 Mac 電腦。若要這麼做,您必須先使您的 Apple ID,透過工具的 Visual studio |選項 |Xamarin |Apple 帳戶。在 [選項] 對話方塊中,您可以將關聯一或多個 Apple Id,按一下 [新增] 按鈕之後,Visual Studio 2017 會顯示相關聯的團隊和使用者角色的每個小組清單。

一旦您按一下 [確定] 時,您可以移至 [iOS 套件組合簽署] 索引標籤的 Xamarin.iOS 專案屬性並選取 [自動佈建選項 (請參閱**[圖 4**)。

啟用自動佈建
啟用自動佈建的 [圖 4

您將只需要選取您想要使用適用於從小組的下拉式清單中的開發小組和 Visual Studio 會產生所需的佈建設定檔和簽章來測試在實體裝置 (這必須連線到 Mac 上的應用程式所需的憑證機器)。

平台支援增強功能

最新的 Xamarin 版本包含的數個平台,包括 Android、 iOS、 Tizen 和 macOS 為目標的改進。在本文中,我將探討這兩種共用更新的專案範本精靈] 的平台改善適用於 iOS 和 Android。當您建立新的 iOS 或 Android 專案時,系統會提示您 (單一檢視、 主版詳細資料、 索引標籤式應用程式和空白應用程式) 的一般範本的清單。專案範本精靈] 也可讓您指定您想要在您的應用程式中支援何種裝置。此外,兩個平台特定的改進功能已增強的支援。

iOS 平台支援Xamarin.iOS 已經過重構,以包含完整的靜態型別系統。如此一來,您撰寫使用 Xamarin iOS、 macOS、 tvOS 和 watchOS 應用程式是現在之間 30%和 50%更小,因為連結器能夠在建置階段移除更多程式碼。記憶體使用量也降低了,尤其是在應用程式啟動。此外,應用程式啟動會現在更快因為大部分的型別註冊現在都在建置階段,而不是在執行階段。

Android 平台支援適用於 Android 的 Xamarin 支援現在包含名為 Android 裝置管理員] 中,隨附於 Visual Studio 2017,並可讓您更輕鬆地建立和維護 Android 模擬器映像的新工具。您可以啟動 Android 裝置管理員,透過 [工具 |Android |Android 裝置管理員。

不只可以建立和編輯模擬器映像,您可以快速啟動的模擬器執行個體,透過 [開始] 按鈕。這項工具提供大量不在本文的範圍內的選項,請參閱文件,網址bit.ly/2LhFUB1如需詳細資訊。包含在新的更新是 Android oreo 版 SDK (API 層級 27) 和功能,稱為 [自動安裝 Android Sdk 的版本。如果您開啟並建置專案時,需要您不需要您的電腦上的 Android sdk 版本時,會出現通知,可協助您下載所需的版本,在背景中。這項功能預設為停用,所以您不必開啟 [工具] |選項 |Xamarin |Android 的設定,並選取啟用自動安裝 Android Sdk。

值得一提的是 Microsoft 也已宣佈在 HYPER-V 執行 Google Android 模擬器的預覽。這會是非常重要的部分,是因為許多開發人員用來搭配 Visual Studio Android 模擬器,這以 HYPER-V 為基礎和最近已停用 microsoft。新的預覽可讓您需要的 Windows 10 April 2018 update 以安裝 Windows HyperVisor 平台和 Visual Studio 2017 15.8 Preview 1 (或更新版本)。因為模擬器仍處於預覽狀態,我不將它涵蓋在本文中,但您可以閱讀有關在由 Miguel de Icaza 非常詳細且有趣的部落格文章bit.ly/2JsVrcq

Xamarin.Forms 的更新

Microsoft Build 2018 大會 Xamarin.Forms 3.0 發行五月,進行多個最近 Xamarin.Forms 3.1 可透過 NuGet。供開發人員建置以 C# 的跨平台應用程式,更新會帶來令人讚嘆的新功能和重大的平台,以及 UI 增強功能。

在平台端,效能會有主要的提升改善快速轉譯器,引進 2.5 版與去年的形式。轉譯器啟用 Xamarin.Forms visual 元素翻譯成原生檢視,可以取得很昂貴,特別是使用複雜的檢視的工作。Microsoft 重新設計的方式轉譯器來提升轉譯速度和效能的 3.0 版。

在 UI 端,Xamarin.Forms 3.0 引進了新的版面配置,稱為 FlexLayout。其運作方式類似 StackLayout,垂直或水平排列子系的視覺元素同時也能夠包裝的子系的視覺元素,如果單一資料列或資料行中沒有足夠的空間。下列程式碼片段顯示如何輕鬆地使用 FlexLayout 範例:

<FlexLayout Wrap="Wrap" JustifyContent="SpaceAround">
  <!-- Place new controls here -->
  <Label Text="A label" FlexLayout.AlignSelf="Center"/>
  <Image Source="Image1.jpg" FlexLayout.AlignSelf="Center"/>
  <Button x:Name="Button1" Text="Tap here" FlexLayout.AlignSelf="Center"/>
</FlexLayout>

許多其他 FlexLayout 屬性,但最重要的三個:

  • Wrap:指定是否 FlexLayout 內容應換至下一個資料列是否第一個範圍中沒有足夠的空間 FlexWrap 列舉中的值。可能的值為換行 (換行至下一個資料列)、 NoWrap (保留一個資料列內容的檢視) 和反向 (換行至下一個資料列,在相反方向)。
  • 方向:如果應該在單一資料列或資料行中排列 FlexLayout 的子系會決定 FlexDirection 列舉中的值。預設值是資料列,但其他可能的值資料行、 RowReverse 和 ColumnReverse (其中反向表示子檢視會配置,順序相反)。
  • JustifyContent:指定子檢視應該如何排列其周圍的額外空間時 FlexJustify 列舉中的值。有簡單易懂的值,例如開始、 中心、 結束時,以及更細微的選項。這些包括的 SpaceAround,其中項目間距的開頭和結束時,空間的一個單位使用,而且兩個單位之間的空間,讓項目和空間填滿線條,以及 SpaceBetween,會以固定間隔子項目等於單位和 no 之間的空間空間的任一端的列,再讓項目和空間填滿線條。SpaceEvenly 值會導致子項目,所以相同的空間量因為有開頭和結尾的項目是從父代的邊緣會設定每個項目之間的間距。

在子檢視,您可以設定 FlexLayout.AlignSelf 附加屬性,以指定應該如何檢視對齊於 FlexLayout 軸內。這是型別的物件 FlexAlignItems 和可能的值為自動、 啟動、 中心、 結束和 Stretch。FlexLayout 控制項的完整文件位於bit.ly/2LaMzgt。雖然很值得一提,CSS 樣式必須符合 Xamarin.Forms 行動應用程式中使用,另一個有趣的加法是支援的階層式樣式表 (CSS),(請參閱bit.ly/2miMcSO) 且並非所有的 CSS 樣式支援。因此,XAML 樣式的補充,而不是替代項目,應該考慮這項功能。此外,CSS 樣式被剖析,並在執行階段評估,不是在建置階段。

在 Xamarin.Forms 中的 CSS 樣式可以宣告並使用不同的方式。其中一個選項是新增為資源,以在頁面中,如下列程式碼片段中的樣式表標記中:

<ContentPage.Resources>
  <ResourceDictionary>
    <StyleSheet>
      <![CDATA[
    ^ contentpage {
      背景色彩: lightgray;}
    stacklayout {
      margin:20; }
    ]]>
    </StyleSheet>
  </ResourceDictionary>
</ContentPage.Resources>

CSS 的內容會包含在 CDATA 區段。每個視覺項目,您可以提供所需的屬性/值組。另一個選項是使用.css 檔案中,從現有的樣式,如下所示:

<ContentPage.Resources>
  <ResourceDictionary>
    <StyleSheet Source="/Assets/mystyle.css" />
   </ResourceDictionary>
</ContentPage.Resources>

請記住.css 檔案必須隨附於您的應用程式,其建置動作] 屬性設定為 EmbeddedResource。CSS 樣式亦可宣告和使用 C# 程式碼。下列程式碼片段示範如何宣告及將樣式加入至頁面的資源:

using (var reader =
  new StringReader
  ("^contentpage { background-color: lightgray; } stacklayout { margin: 20; }"))
{
  this.Resources.Add(StyleSheet.FromReader(reader));
}

您甚至可以載入的.css 檔案,在執行階段使用下列程式碼片段,其中 Page1 代表應用程式中的頁面,而 Project1 代表您的專案名稱:

this.Resources.Add(StyleSheet.FromAssemblyResource(
  IntrospectionExtensions.GetTypeInfo(typeof(Page1)).Assembly,
  "Project1.Assets.mystyle.css"));

另一項非常有用新增至 Xamarin.Forms 是 Visual State Manager (bit.ly/2NVH4AS),這您可能已經知道您是否使用 WPF 和 UWP 的體驗。有了它,您可以變更您在 XAML 中中, 宣告的檢視狀態為基礎的 UI。例如,您可以使用 Visual State Manager 來變更檢視,以根據其狀態中,色彩中的程式碼片段所示**[圖 5**。

[圖 5 變更背景色彩

<Entry>
  <VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="CommonStates">
      <VisualState x:Name="Normal">
        <VisualState.Setters>
          <Setter Property="BackgroundColor" Value="White" />
        </VisualState.Setters>
      </VisualState>
      <VisualState x:Name="Focused">
        <VisualState.Setters>
          <Setter Property="BackgroundColor" Value="LightGray" />
        </VisualState.Setters>
      </VisualState>
      <VisualState x:Name="Disabled">
        <VisualState.Setters>
          <Setter Property="BackgroundColor" Value="Gray" />
        </VisualState.Setters>
      </VisualState>
    </VisualStateGroup>
  </VisualStateManager.VisualStateGroups>
</Entry>

使用中的標記**[圖 5**,項目會自動變更它的背景色彩,其狀態變更時。在此情況下,您需要將項目的 IsEnabled 屬性設定為 False,停用的檢視,並觸發已停用狀態。狀態必須分組為稱為 VisualStateGroup 的物件。每個狀態被以您新增和一樣使用樣式,因此可提供您想要變更的屬性及其值的名稱 set 存取子規格的 VisualState 物件。當然,您可以指定多個屬性 setter。

Xamarin.Forms 可定義一組稱為通用的狀態,例如 [標準]、 [Focused 和 [已停用 (請參閱上述 CommonState 名稱 VisualStateGroup); 的狀態這些狀態通用於每個檢視。其他狀態可能僅特定檢視,不適用於其他人。Visual State Manager 提供簡潔又俐落的方法,控制 UI 行為,全都在您的 XAML 程式碼。

Xamarin.Forms 3.0 也可讓您輕鬆地實作由右至左的當地語系化。裝置類別現在會公開 [FlowDirection] 屬性,它會從裝置中讀取此當地語系化資訊。您可以再指派其值要檢視的 [FlowDirection] 屬性,如下所示:

<ContentPage FlowDirection="{x:Static Device.FlowDirection}">

當然您也可以結合 FlowDirection 屬性檢視的 XAML,並確定您的檢視模型會公開傳回 Device.FlowDirection 值的屬性中。Xamarin.Forms 3.0 的版本之後的幾個星期 Microsoft 發佈了 3.1 版,以提供 bug 修正,並導入了許多改進效能、 可靠性和視覺項目。比方說,使用 SelectionMode 屬性,現在在 ListView 控制項中,可以使用,如下所示:

<ListView SelectionMode="None">
  ...
</ListView>

可能的值為 None,和單一。這會是一項重要改善,是因為舊版需要您手動撰寫程式碼來停用的項目選取或建立 ListView 的自訂轉譯器。控制項現在也支援指定不同的色彩選擇器開啟時,可以完成這件事您 OnColor] 屬性的類型色彩,此參數,就像這樣:

<Switch OnColor="Blue"/>

Xamarin.Forms 3.1 之前,您必須撰寫自訂轉譯器來取得這個結果。同樣地,滑桿控制項允許指定透過 ThumbColor、 MaximumTrackColor 和 MinimumTrackColor 屬性的色彩。其他新增項目是項目和編輯器檢視和控制文字預測和 Api,可讓您在 iOS 中的檢視表中控制陰影的 IsSpellCheckEnabled 屬性。

可繫結的範圍會值得花一點時間瀏覽,請指定這項功能要求多次由開發人員社群。Put 簡潔、 s p a n 類別,用於更複雜的字串格式時,現在繼承自 BindableObject,使文字格式設定支援資料繫結至相關的所有屬性。已引進新的可繫結屬性,稱為樣式,因此您可以使用應用程式資源中定義的 XAML 樣式。下列 XAML 程式碼片段提供一個範例:

<Label>
  <Label.FormattedText>
    <FormattedString>
      <FormattedString.Spans>
        <Span Text="{Binding TitleText}" Style="{StaticResource TitleStyle}" />
        <Span Text="{Binding SubtitleText}" Style="{StaticResource SubTitleStyle}" />
        <Span Text="{Binding SomeText}" Style="{StaticResource NormalStyle}" />
      </FormattedString.Spans>
    </FormattedString>
  </Label.FormattedText>
</Label>

您可以在 Xamarin.Forms 3.1 中找到可用的新增功能的完整清單,在版本資訊頁面,在bit.ly/2NkVA3T

總結

持續提前 Xamarin,不只支援不斷演變的平台和作業系統,同時提升品質和開發工具的生產力。在本文中我探討了大量的新功能和更新功能解決許多問題,從程式碼編輯器] 與 [平台的整合式的工具和 CSS 支援。多個尚未來臨隨著其他更新的發行。最好定期檢查 Xamarin 部落格 (blog.xamarin.com) 若要隨時掌握最新消息與公告。


Alessandro Del Sole已成為 Microsoft MVP,自 2008年起,Xamarin 認證程式開發人員。他著有許多書籍、 電子書,說明影片及有關使用 Visual Studio.NET 開發的文件。Del Sole 為 Fresenius 醫療照護擔任資深軟體工程師,將焦點放在建置.NET 和醫療保健的市場的行動裝置應用程式。您可以關注他的 Twitter: @progalex

感謝下列 Microsoft 技術專家檢閱這篇文章:David Britch,Amy Burns

Amy Burns 是波士頓內容開發人員在 Microsoft。她已自 2013 年,且特別強調 Xamarin.iOS (和 iOS 佈建) 上的 Xamarin 文件小組的寫入器和 Visual Studio for mac。

David Britch 適用於 Microsoft 的 Xamarin 文件小組。他寫過的範圍包括書籍、 指導方針文件、 參考實作、 白皮書、 影片和講師引導的訓練課程軟體開發發行集。


MSDN Magazine 論壇中的這篇文章的討論