Search code examples
xamlfontswinrt-xamlwinui-3winui

How to change the font of a TextBox in WinUI3

I want to change the font for all TextBox controls in WinUI 3, but it is not working as expected. I specified the font in the ResourceDictionary of App as follows, but it was not applied to some controls, particularly TextBox, NumberBox, and the MenuFlyout of Button.

App.xaml

<?xml version="1.0" encoding="utf-8"?>
<Application
    x:Class="App1.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
                <!-- Other merged dictionaries here -->

            </ResourceDictionary.MergedDictionaries>
            <!-- Other app resources here -->
                <FontFamily x:Key="XamlAutoFontFamily">Arial Black</FontFamily>
                <FontFamily x:Key="ContentControlThemeFontFamily">Arial Black</FontFamily>
                <FontFamily x:Key="MTCMediaFontFamily">Arial Black</FontFamily>
                <FontFamily x:Key="PhoneFontFamilyNormal">Arial Black</FontFamily>
                <FontFamily x:Key="PhoneFontFamilySemiLight">Arial Black</FontFamily>
                <FontFamily x:Key="PivotHeaderItemFontFamily">Arial Black</FontFamily>
                <FontFamily x:Key="PivotTitleFontFamily">Arial Black</FontFamily>
                <FontFamily x:Key="SymbolThemeFontFamily">Segoe Fluent Icons,Segoe MDL2 Assets</FontFamily>
                <FontFamily x:Key="KeyTipFontFamily"></FontFamily>

                <Style TargetType="TextBox">
                    <Setter Property="FontFamily" Value="Arial Black" />
                </Style>
        </ResourceDictionary>
    </Application.Resources>
</Application>

XAML

<?xml version="1.0" encoding="utf-8"?>
<Window
    x:Class="App1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="App1">

    <StackPanel Orientation="Vertical" HorizontalAlignment="Center" VerticalAlignment="Center">
        <Button Content="Show Menu"
                HorizontalAlignment="Center"
                VerticalAlignment="Top"
                Margin="0,50,0,0">
            <Button.Flyout>
                <MenuFlyout>
                    <MenuFlyoutItem Text="Option 1" />
                </MenuFlyout>
            </Button.Flyout>
        </Button>

        <TextBox HorizontalAlignment="Center" VerticalAlignment="Bottom" Margin="0,0,0,50" Width="200" Text="Enter text here"/>
    </StackPanel>
</Window>

I understand that I can set FontFamily individually, but if anyone knows how to apply the font to TextBox and the MenuFlyout of Button, please let me know. enter image description here

Solution

  • I was able to do it with <TextBox Text="Enter text here" FontFamily="Arial" FontWeight="Black"/>, so I will go with this.