CODEWITHSUNDEEP
xamluwpuwp-xaml
astropringles
astropringles

Reputation: 879

How to set Global Custom Font in App.xaml

I have a custom font in my assets folder and need to assign this font as the global font for the app. This is what I thought of but it's not working.

<FontFamily x:Key="MetricWebRegular">
                ms-appx:///Assets/Fonts/MetricWeb-Regular.ttf#Metric Web
</FontFamily>

I'm calling this by adding it to a style setter in a textbox.

Upvotes: 2

Views: 3010

Answers (1)

Grace Feng
Grace Feng

Reputation: 16652

This is what I thought of but it's not working.

It's hard to know what is going wrong here, just base on your code, it should work. Firstly, I don't have your font resource, I downloaded one from Internet and tested like this:

<Application.Resources>
    <FontFamily x:Key="MetricWebRegular">ms-appx:///Assets/Blambot-Custom.ttf#Blambot Custom</FontFamily>
</Application.Resources>

then use this resource in the style setter in a textbox:

<Page.Resources>
    <Style x:Key="TextBoxStyle" TargetType="TextBox">
        ...
        <Setter Property="FontFamily" Value="{StaticResource MetricWebRegular}" />    
        ...

          </Setter>
      </Style>
  </Page.Resources>

And my TextBox:

<TextBox Text="Hello 11111222333" FontSize="30" Style="{StaticResource TextBoxStyle}" />

It works perfectly:

enter image description here

Here is my font download Uri. I downloaded it and changed its name here so it will meet the format as yours.

So,

  1. Make sure your font file has no problem.

  2. ms-appx:///Assets/Fonts/MetricWeb-Regular.ttf#Metric Web this path means your font file is under the Fonts folder of the Assets folder, make sure the path is right.

  3. If you want to use this resource, you need to use StaticResource and its key.

  4. If you want to override the default font family, you can override the ContentControlThemeFontFamily resource like this:

<FontFamily x:Key="ContentControlThemeFontFamily">ms-appx:///Assets/Blambot-Custom.ttf#Blambot Custom</FontFamily>, the result of my layout is here:

enter image description here

If there is still problem, you can leave a comment to post the download url of your font file resource, so can we download it and have a test.

Upvotes: 2

Related Questions