.NET MAUI 中的字型

根據預設，.NET 多平臺應用程式 UI （.NET MAUI） 應用程式會在每個平台上使用 Open Sans 字型。 不過，可以變更此預設值，而且可以註冊其他字型以在應用程式中使用。

所有顯示文字的控制項都會定義可設定為變更字型外觀的屬性：

• FontFamily，類型為 string。
• FontAttributes，為FontAttributes類型，這是一個包含三個成員的列舉：None、Bold和Italic。 這個屬性預設值為 None。
• FontSize 的類型為 double。
• FontAutoScalingEnabled， bool定義應用程式的 UI 是否反映作業系統中設定的文字縮放偏好設定。 這個屬性預設值為 true。

這些屬性由 BindableProperty 物件支援，這表示它們可以成為資料繫結的目標並且可以設定樣式。

所有顯示文字的控制項都會自動使用字型縮放，這表示應用程式的 UI 會反映作業系統中設定的文字縮放喜好設定。

註冊字型

TrueType 格式（TTF）和 OpenType 字型（OTF）可以新增至您的應用程式，可以通過檔案名稱或別名參考，並在MauiProgram類別的CreateMauiApp方法中執行註冊。 這是透過呼叫ConfigureFonts物件的MauiAppBuilder方法來完成。 然後，在物件上 IFontCollection 呼叫方法 AddFont ，將所需的字型新增至您的應用程式：

namespace MyMauiApp
{
    public static class MauiProgram
    {
        public static MauiApp CreateMauiApp()
        {
            var builder = MauiApp.CreateBuilder();
            builder
                .UseMauiApp<App>()
                .ConfigureFonts(fonts =>
                {
                    fonts.AddFont("Lobster-Regular.ttf", "Lobster");
                });

            return builder.Build();
        }
    }  
}

在上面的範例中，AddFont 方法的第一個引數是字體檔案名，而第二個引數則是可選的別名，用於在使用字體時進行引用。

您可以將字型拖曳至專案的 Resources\Fonts 資料夾，以將字型新增至您的應用程式專案，其中其建置動作會自動設定為 MauiFont。 這會在專案檔中建立對應的項目。 或者，可以使用專案檔中的萬用字元來註冊應用程式中的所有字型：

<ItemGroup>
   <MauiFont Include="Resources\Fonts\*" />
</ItemGroup>

字型也可以新增至應用程式專案的其他資料夾。 不過，在此案例中，其建置動作必須在 [屬性] 視窗中手動設定為 MauiFont。

在建置階段，字型會複製到您的應用程式套件。 如需停用字型封裝的相關資訊，請參閱 停用字型封裝。

使用字型

已註冊的字型可以透過將顯示文字的控制項屬性設定 FontFamily 為字型名稱來取用，而不使用副檔名：

<!-- Use font name -->
<Label Text="Hello .NET MAUI"
       FontFamily="Lobster-Regular" />

或者，可以通過引用其別名來使用它：

<!-- Use font alias -->
<Label Text="Hello .NET MAUI"
       FontFamily="Lobster" />

對等的 C# 程式代碼為：

// Use font name
Label label1 = new Label
{
    Text = "Hello .NET MAUI!",
    FontFamily = "Lobster-Regular"
};

// Use font alias
Label label2 = new Label
{
    Text = "Hello .NET MAUI!",
    FontFamily = "Lobster"
};

在 Android 上，您可以將下列系統字型設定為屬性的 FontFamily 值來取用：

• 等寬
• 襯線
• 無襯線（或無襯線）
• 無襯線黑色（或無襯線黑色）
• 無襯線緊縮（或無襯線緊縮）
• 無襯線凝光（或無襯線凝光）
• 無襯線光（或無襯線光）
• 無襯線媒介（或無襯線媒介）

例如，可以透過下列 XAML 取得等寬系統字型：

<Label Text="Hello .NET MAUI"
       FontFamily="monospace" />

對等的 C# 程式代碼為：

// Use font name
Label label1 = new Label
{
    Text = "Hello .NET MAUI!",
    FontFamily = "monospace"
};

設定字型屬性

顯示文字的控制項可以設定 FontAttributes 屬性來指定字型屬性：

<Label Text="Italics"
       FontAttributes="Italic" />
<Label Text="Bold and italics"
       FontAttributes="Bold, Italic" />

對等的 C# 程式代碼為：

Label label1 = new Label
{
    Text = "Italics",
    FontAttributes = FontAttributes.Italic
};

Label label2 = new Label
{
    Text = "Bold and italics",
    FontAttributes = FontAttributes.Bold | FontAttributes.Italic
};    

設定字型大小

顯示文字的控制項可以設定 FontSize 屬性來指定字型大小。 屬性 FontSize 可以設定為值 double ：

<Label Text="Font size 24"
       FontSize="24" />

對等的 C# 程式代碼為：

Label label = new Label
{
    Text = "Font size 24",
    FontSize = 24
};

停用字型自動縮放

所有顯示文字的控制項預設都會啟用字型縮放功能，這表示應用程式的 UI 會反映作業系統中設定的文字縮放偏好設定。 不過，您可以將文字型控制項的屬性設為 FontAutoScalingEnabled，以停用此行為。

<Label Text="Scaling disabled"
       FontSize="18"
       FontAutoScalingEnabled="False" />

當您想要保證文字以特定大小顯示時，此方法很有用。

設定每個平台的字型屬性

OnPlatform和On類別可用於 XAML 來設定每個平臺的字型屬性。 以下範例設定了不同的字體系列和大小：

<Label Text="Different font properties on different platforms"
       FontSize="{OnPlatform iOS=20, Android=22, WinUI=24}">
    <Label.FontFamily>
        <OnPlatform x:TypeArguments="x:String">
            <On Platform="iOS" Value="MarkerFelt-Thin" />
            <On Platform="Android" Value="Lobster-Regular" />
            <On Platform="WinUI" Value="ArimaMadurai-Black" />
        </OnPlatform>
    </Label.FontFamily>
</Label>

此 DeviceInfo.Platform 屬性可在程式碼中使用，以設定每個平臺的字型屬性：

Label label = new Label
{
    Text = "Different font properties on different platforms"
};

label.FontSize = DeviceInfo.Platform == DevicePlatform.iOS ? 20 :
    DeviceInfo.Platform == DevicePlatform.Android ? 22 : 24;  
label.FontFamily = DeviceInfo.Platform == DevicePlatform.iOS ? "MarkerFelt-Thin" :
    DeviceInfo.Platform == DevicePlatform.Android ? "Lobster-Regular" : "ArimaMadurai-Black";

如需提供平臺特定值的詳細資訊，請參閱 裝置資訊。 如需有關OnPlatform標記擴展的資訊，請參閱按照平臺自訂 UI 外觀。

顯示字型圖示

要在 .NET MAUI 應用程式中顯示字型圖示，您可以在FontImageSource物件中指定字型圖示資料。 衍生自 ImageSource 類別的這個類別具有下列屬性：

• Glyph – 字型圖示的 Unicode 字元值，指定為 string。
• Size – 一個 double 值，以裝置無關的單位表示轉譯字型圖示的大小。 預設值是 30。 此外，此屬性可以設定為具有名稱的字型大小。 如需與裝置無關的單位的詳細資訊，請參閱 與裝置無關的單位。
• FontFamily – 代表 string 字體圖示所屬的字體系列。
• Color – 顯示字型圖示時要使用的選用 Color 值。

此資料用於建立 PNG，該 PNG 可由任何能夠顯示 ImageSource 的檢視來顯示。 這種方法允許字型圖示 （例如表情符號） 由多個檢視顯示，而不是將字型圖示顯示限制為單一文字呈現檢視，例如 Label.

以下 XAML 範例由 Image 檢視顯示單一字型圖示：

<Image BackgroundColor="#D1D1D1">
    <Image.Source>
        <FontImageSource Glyph="&#xf30c;"
                         FontFamily="{OnPlatform iOS=Ionicons, Android=ionicons.ttf#}"
                         Size="44" />
    </Image.Source>
</Image>

此程式碼會在 Image 檢視中顯示來自 Ionicons 字型系列的 XBox 圖示。 請注意，雖然此圖示的 Unicode 字元是 \uf30c，但必須在 XAML 中逸出，因此會變成 。 對等的 C# 程式代碼為：

Image image = new Image { BackgroundColor = Color.FromArgb("#D1D1D1") };
image.Source = new FontImageSource
{
    Glyph = "\uf30c",
    FontFamily = DeviceInfo.Platform == DevicePlatform.iOS ? "Ionicons" : "ionicons.ttf#",
    Size = 44
};

下列螢幕截圖顯示數個字型圖示：