從 Xamarin.Forms 變更版面配置行為

發行項
07/18/2024

在執行升級的 .NET 多平臺應用程式 UI （.NET MAUI）應用程式時，您可能會注意到配置行為不同。其中有些是版面配置間距值變更的結果。如需詳細資訊，請參閱 Xamarin.Forms 的預設值變更。

下表顯示 Xamarin.Forms 和 .NET MAUI 版面配置之間的其他行為變更：

版面配置	Xamarin.Forms	.NET MAUI	建議
全部	在某些情況下，不接受重設大小要求。	會接受重設大小要求。
Grid	您可以從 XAML 推斷資料列和資料列。	數據行和數據列必須明確宣告。	新增 ColumnDefinitions 和 RowDefinitions。
HorizontalStackLayout		`*AndExpand` 沒有作用。
RelativeLayout		需要相容性命名空間。	Grid請改用，或為相容性命名空間新增 `xmlns` 。
StackLayout	子系可以在堆疊方向填滿空間。	子系會堆疊並超出可用空間。	如果您需要子檢視來填滿空間，請變更為 Grid。
VerticalStackLayout		`*AndExpand` 沒有作用。

.NET MAUI 控制件通常會遵守明確的大小要求。如果您要求控件寬度為 200 個裝置獨立單位，則 .NET MAUI 會讓該控件寬 200 個單位，即使控件的容器只有 100 個單位寬。

Xamarin.Forms 的預設版面配置值變更

Xamarin.Forms 會針對某些屬性值使用任意預設值，例如填補、邊界和間距。 .NET MAUI 會將這些任意屬性值變更為零。

若要在未設定明確值的專案中保留 Xamarin.Forms 預設值，請將隱含樣式新增至您的專案。如需隱含樣式的詳細資訊，請參閱隱含樣式。

注意

.NET MAUI 專案範本包含資源字典，可為大部分控件提供預設樣式。建議您透過修改或繼承這些資源字典，在應用程式中採用類似的方法。

下表列出 Xamarin.Forms 與 .NET MAUI 之間已變更的版面配置屬性值：

屬性	Xamarin.Forms 值	.NET MAUI 值
`Grid.ColumnSpacing`	6	0
`Grid.RowSpacing`	6	0
`StackLayout.Spacing`	6	0

下列樣式會保留 Xamarin.Forms 預設值：

<!-- Forms defaults -->
<Style TargetType="Grid">
    <Setter Property="ColumnSpacing" Value="6"/>
    <Setter Property="RowSpacing" Value="6"/>
</Style>
<Style TargetType="StackLayout">
    <Setter Property="Spacing" Value="6"/>
</Style>
<Style TargetType="Frame">
    <Setter Property="Padding" Value="{OnPlatform 20,iOS=19}"/>
</Style>

Frame

Frame 已在 .NET MAUI 中取代為 Border。不過，隨附於從 Xamarin.Forms 輕鬆移轉。 .NET MAUI 版面配置可正確測量FramePadding所有平臺，而 Xamarin.Forms 跨平臺有一些差異。這可能會導致您的應用程式在 .NET MAUI 中看起來不相同。如果您使用預設值，上述範例會說明此情況。

方格

Xamarin.Forms 與 .NET MAUI 之間行為的最大變更 Grid 是網格線不會自動為您新增遺漏的數據列和數據行。例如，在 Xamarin.Forms 中，您可以將控件新增至， Grid 而不指定其數據列行為：

<Grid>
    <Label Text="Hello"/>
    <Label Grid.Row="1" Text="World"/>
</Grid>

在 Xamarin.Forms 中，儘管未宣告 Grid 包含兩個數據列，但系統會自動為您新增第二個數據列。 .NET MAUI 不會這麼做。相反地，您必須使用屬性明確指定中的GridRowDefinitions資料列數目。

重要

根據預設，.NET MAUI 會 Grid 建立具有一個資料行和一個資料列的。因此，如果這是您的意圖，就不需要設定 ColumnDefinitions 和 RowDefinitions 屬性。

在 Xamarin.Forms 中，當 Label 位於其 ColumnDefinition 寬度設定為 Auto的數據行時，會隱含發生換行符和尾端截斷等換行符。在 .NET MAUI 中，在此案例中，換行符不會隱含發生，因為數據行會延伸超過畫面的寬度以容納子系的內容。如果您想要 Label 將包裝在邊緣， Grid 您應該將適當的 ColumnDefinition 設定為 * 或值。

StackLayout

.NET MAUI 中的堆棧配置與StackLayout VerticalStackLayout HorizontalStackLayoutStackLayout Xamarin.Forms 中的有數個差異。

主要差異在於 .NET MAUI 堆疊配置非常簡單。它們會以單一方向堆棧子檢視，直到它們全部堆疊為止。它們會持續到最後一個子系已堆疊，即使這會將它們帶出堆棧方向的可用空間。因此，.NET MAUI 堆疊配置會以特定方向排列控件。它們不會細分一個空間。這與 Xamarin.Forms StackLayout完全不同，它會根據情況和任何 *AndExpand 配置選項的存在，例如 FillAndExpand 或 CenterAndExpand，變更其版面配置行為。 Xamarin.Forms StackLayout 有時會細分空間，並擴充至其容器邊緣或停止。在其他情況下，它會擴充到其容器之外。

.NET MAUI HorizontalStackLayout 和 VerticalStackLayout中的新堆疊配置無法辨識配置 *AndExpand 選項。如果他們遇到具有這類配置選項的子系，他們只會將其 AndExpand 視為不存在。例如，FillAndExpand 會成為 Fill。不過，為了簡化從 Xamarin.Forms 移轉，.NET MAUI StackLayout 會接受 *AndExpand 版面配置選項，不過它們已標示為過時。若要避免使用過時成員的警告，您應該將使用 *AndExpand 版面配置選項的版面配置轉換為適當的版面配置類型。可以達成如下：

如果您的版面配置是以外的 StackLayout任何專案，請移除的所有用法 AndExpand。就像在 Xamarin.Forms 中一樣，在 .NET MAUI 中，版 AndExpand 面配置選項不會影響以外的 StackLayout任何配置。
拿掉與堆疊方向正交的任何 AndExpand 屬性。例如，如果您有 StackLayout 的 Orientation Vertical，且其子系具有 HorizontalAligment="CenterAndExpand" - 該版面配置選項沒有作用，而且可以移除。
如果您在上有任何剩餘AndExpand的屬性，則應該將該屬性轉換成 Grid StackLayout 。StackLayout Grid設計為細分空間，並提供 Xamarin.Forms 中提供的版面配置AndExpand。下列範例顯示使用屬性的 AndExpand Xamarin.FormsStackLayout：
```
<StackLayout>
    <Label Text="Hello world!"/>
    <Image VerticalOptions="FillAndExpand" Source="dotnetbot.png"/>
</StackLayout>
```
這可以轉換成 Grid .NET MAUI 中的：
```
<Grid RowDefinitions="Auto, *">
    <Label Text="Hello world!"/>
    <Image Grid.Row="1" Source="dotnetbot.png"/>
</Grid>
```
執行此轉換時，在中StackLayout標示AndExpand的任何項目都應該位於其本身的數據列或資料列中，其大小*為 Grid。

重要

會 StackLayout 繼續其堆疊方向，直到其內容用盡為止。它不會沿著該軸細分其容器。如果您要將內容限制為方向的限制空間，您應該使用另一個版面配置，例如 Grid。

RelativeLayout

RelativeLayout不建議在 .NET MAUI 中使用。請改為盡可能使用 Grid 。

如果您絕對需要 RelativeLayout，可以在命名空間中找到 Microsoft.Maui.Controls.Compatibility ：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:compat="clr-namespace:Microsoft.Maui.Controls.Compatibility;assembly=Microsoft.Maui.Controls"
             x:Class="MyMauiApp.MyPage"
             Title="MyPage">
    <compat:RelativeLayout>
        <!-- Your code goes here -->
    </compat:RelativeLayout>
</ContentPage>

ScrollView

雖然 ScrollView 通常不被視為版面配置，但它可以視為配置，因為它用來捲動其子內容。在 Xamarin.Forms 中， ScrollView 堆疊時不會一致運作。其大小下限有一些任意限制，部分取決於其內容，有時會壓縮，讓其他專案以不一致且有時出人意料的方式放入頁面內 StackLayout 。

在 .NET MAUI 中，除非另有限制，否則會 ScrollView 擴充為它想要的大小。這表示，在可以無限擴充的 VerticalStackLayout中， ScrollView 將會擴充到其完整內容高度，而且不會捲動。如果您是 Xamarin.Forms 使用者，此行為可能會造成混淆。

共用方式為