最新.NET MAUI有什麼驚喜?
.NET 6 Preview 7 現已發佈啦,我們為 .NET 多平台應用程序 UI (MAUI) 引入了所有的新布局。這是性能和可靠性的重大變化。我們很高興我們還增加了一些關於accessibility方面的基於新的SemanticService、字體縮放選項和對Xamarin.Forms 效果的兼容性的功能。
新的布局
到目前為止,你在.NET MAUI中使用的布局都是Xamarin.Forms布局,他們知道如何調整渲染器和新的基於控件的處理程序的大小和位置。我們開始採用這種方法是為了快速將 UI 放在屏幕上,並集中精力完成我們的 UI 40 控件庫,並證明我們能夠與從 Xamarin.Forms 遷移的項目兼容。與此同時,我們一直在基於新的 LayoutManager 方法構建優化布局,利用我們 7 年的 Xamarin.Form 布局經驗來優化一致性、性能和可維護性。
在這個預覽中,舊的布局現在只能在Microsoft.Maui.Controls.Compatibility命名空間中找到,而新的布局默認是啟用的:
堆棧布局現在包裝了兩個布局,側重於水平和垂直方向。我們建議您選擇一個適合您的布局需要。堆棧布局仍然有一個您可以設置的方向屬性,在某些情況下,當你的自適應布局根據屏幕大小或設備習慣改變方向時,這是必要的。
每個布局都有一個相應的布局管理器負責測量和定位視圖。Measure方法接受高度和寬度的限制,並負責測量所有布局的子元素。然後,ArrangeChildren功能根據布局規則設置每個視圖的大小和位置。對於有些情況,您可以覆蓋布局的CreateLayoutManager方法,以提供ILayoutManager接口的自定義實現。
您會注意到的即時更新之一是調整了這些布局上的默認間距值:0。如果您使用過舊版布局,那麼您已經知道之前在那裡設置的各種不同的任意值。零設定了更明確的期望,並指引您去設置更滿足需求的值。為方便起見,請在全局樣式中設置這些起始值:
<ResourceDictionary>
<Style TargetType="StackLayout">
<Setter Property="Spacing" Value="6"/>
</Style>
<Style TargetType="Grid">
<Setter Property="ColumnSpacing" Value="6"/>
<Setter Property="RowSpacing" Value="6"/>
</Style>
</ResourceDictionary>
絕對布局和相對布局現在只存在於兼容性命名空間中,我們建議您仔細考慮是否真的需要使用它們。在可能的情況下,使用上面列出的布局之一。同時,您可以通過添加新命名空間並為 XAML 引用添加前綴來更新代碼以使用它們:
<ContentPage
xmlns:cmp="clr-namespace:Microsoft.Maui.Controls.Compatibility;assembly=Microsoft.Maui.Controls"
...
>
<cmp:AbsoluteLayout>
...
</cmp:AbsoluteLayout>
</ContentPage>
.NET 升級助手正在針對所有這些更改進行更新,如果在升級過程中沒有為您處理,我們將盡最大努力指導您完成這些更改。
在接下來的衝刺階段,我們將重點關注改進這些新布局,因此請查看它們並記錄您在嘗試使用它們時觀察到的任何問題。
可訪問性更改和改進
我們每個月都會與來自不同公司的幾位開發人員會面,這些公司在交付能夠滿足最高可訪問性評級的應用程序方面投入了大量資金。通過這些會議,我們對可訪問性支持做了一些改變和增加,使每個人都能更容易地生產可訪問性應用程序。
TabIndex 和 IsTabStop 屬性已移除
Xamarin.Forms 中引入了 TabIndex 和 IsTabStop 屬性,以幫助開發人員控制屏幕閱讀器讀取 UI 元素的順序。在實踐中,他們最終會讓人感到困惑並且無法滿足這種需求。在 .NET MAUI 中,我們建議採用一種深思熟慮的設計方法,按照您希望的方式來排列您的UI,而不是尋找編程方式來操作您的界面結構。對於必須控制指令的情況,我們建議使用社區工具包的 SemanticOrderView,該工具在相同的 .NET MAUI 版本中也可以使用。
SetSemanticFocus 和 Announce 方法
作為新 SemanticExtensions 類的一部分,我們添加了一個新的 SetSemanticFocus 方法,允許您將屏幕閱讀器焦點移動到特定元素。將此與設置輸入焦點的 VisualElement.Focus 進行比較。
<VerticalStackLayout>
<Label
Text="Explore SemanticExtensions below"
TextColor="RoyalBlue"
FontAttributes="Bold"
FontSize="16"
Margin="0,10"/>
<Button
Text="Click to set semantic focus to label below"
FontSize="14"
Clicked="SetSemanticFocusButton_Clicked"/>
<Label
x:Name="semanticFocusLabel"
Text="Label receiving semantic focus"
FontSize="14"/>
</VerticalStackLayout>
private void SetSemanticFocusButton_Clicked(object sender, System.EventArgs e)
{
semanticFocusLabel.SetSemanticFocus();
}
在Essentials中,我們添加了另一個新方法Announce,它設置屏幕閱讀器要宣布的文本。例如,單擊按鈕,您可以觸發以下重要信息來讀取:
void Announce_Clicked(object sender, EventArgs e)
{
SemanticScreenReader.Announce("Make accessible apps with .NET MAUI");
}
字體縮放
所有平台上的所有控件默認都啟用了字體縮放功能。這意味着當你的應用程序用戶在操作系統中調整他們的文本縮放首選項時,你的UI將反映他們的選擇。默認情況下,這會生成一個更容易訪問的應用程序。
每個控件都有一個添加的 FontAutoScalingEnabled,它甚至可以與 FontImageSource 一起用於你的字體圖標。設置 FontSize 是你的 100% 大小,並鎖定它,你將設置 FontAutoScalingEnabled=”false”。
<VerticalStackLayout>
<Label
Text="Scaling disabled"
FontSize="18"
FontAutoScalingEnabled="False"/>
<Label
Text="Scaling enabled"
FontSize="18"/>
</VerticalStackLayout>
請務必查看您的屏幕並根據需要調整樣式,以確保它們適用於所有尺寸。
其他亮點
在這個版本中還增加了幾個值得注意的內容。
- 我們增加了對Effects的支持,它將支持從Xamarin.Forms升級的項目#1574。
- 對AppThemeBinding的改進,支持深色和淺色主題模式#1657。
- 滾動視圖處理程序#1669。
- Android Shell移植到core #979。
- Shell導航傳遞複雜對象#204。
- Visual Tree Helper添加了XAML熱重載#1845。
- 切換到System.ComponentModel.TypeConverter #1725。
- Window生命周期事件#1754。
- 頁面導航事件#1812。
- CSS前綴更新為-maui #1877。
對於一組完整的更改,請查看分支比較。
現在開始
首先,安裝 .NET 6 Preview 7。接下來使用 maui-check 添加 maui 工作負載。還要確保您已更新到 Visual Studio 2022 的最新預覽版。
在Visual Studio 2022的未來版本中,MAUI將與其他工作負載一起安裝。現在,我們建議您通過命令行安裝所有需要的組件。
準備好了嗎?打開Visual Studio 2022預覽3並創建一個新項目。搜索並選擇.NET MAUI。
有關 .NET MAUI 入門的其他信息,請參閱我們的文檔。
歡迎反饋
Visual Studio 2022 預覽版正在快速啟用 .NET MAUI 的新功能。當您在調試、部署和編輯器相關體驗方面遇到任何問題時,請使用「幫助」>「發送反饋」菜單報告您的體驗。
目前,我們也正在對 Visual Studio 2022中最新 Windows 應用程序 SDK 單項目 MSIX 擴展 和.NET MAUI進行最後的故障排除,以解決調試失敗的問題。您可以直接成功部署 Windows 應用程序並從「開始」菜單運行它。
請通過在 GitHub 上的 dotnet/maui 與我們互動,讓我們了解您使用 .NET MAUI Preview 7 創建新應用程序的體驗。
如果想了解未來的版本,請訪問我們的產品路線圖,如果想了解特性的完整性,請訪問我們的狀態wiki。