Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WPF multiple Font files of the same family

I have the following font files.

MyFont-Regular.tff

MyFont-Bold.tff

MyFont-Italic.tff

How do I use them?

I can do the following,

<TextBlock 
FontFamily="/Fonts/MyFont/MyFont-Regular.ttf#My Font"
Text="This is my font"/>

By what if i wan't to use styles like italic and bold? Can't i declare that My Font consists of several files each containing the fonts style?

like image 507
CodeMonkey Avatar asked Jan 20 '16 15:01

CodeMonkey


3 Answers

You cannot. You can, however, wrap your custom font into a style/resource:

<App.Resources>
    <FontFamily x:Key="CustomRegular">/Fonts/MyFont/MyFont-Regular.ttf#My Font</FontFamily>
    <FontFamily x:Key="CustomBold">/Fonts/MyFont/MyFont-Bold.ttf#My Font</FontFamily>
    <FontFamily x:Key="CustomItalic">/Fonts/MyFont/MyFont-Italic.ttf#My Font</FontFamily>
</App.Resources>

Then use it like this:

<TextBlock FontFamily="{StaticResource CustomItalic}">Hello world</TextBlock>

Need part of the text italic?

<TextBlock FontFamily="{StaticResource CustomRegular}">
    <Run FontFamily="{StaticResource CustomItalic}">Hello</Run>
    <Run>World</Run>
</TextBlock>

Best of luck.

like image 141
Jerry Nixon Avatar answered Oct 13 '22 18:10

Jerry Nixon


Here is a better way of doing it:

  1. Add a /Fonts folder to your solution.
  2. Add the True Type Fonts (*.ttf) files to that order
  3. Include the files to the project
  4. Select the fonts and add them to the solution
  5. Set BuildAction: Resource and Copy To Output Directory: Do not copy. Your .csproj file should now should have a section like this one:

     <ItemGroup>
      <Resource Include="Fonts\NotoSans-Bold.ttf" />
      <Resource Include="Fonts\NotoSans-BoldItalic.ttf" />
      <Resource Include="Fonts\NotoSans-Italic.ttf" />
      <Resource Include="Fonts\NotoSans-Regular.ttf" />
      <Resource Include="Fonts\NotoSansSymbols-Regular.ttf" />
    </ItemGroup>
    
  6. In App.xaml add <FontFamily> Resources. It should look like in the following code sample. Note that the URI doesn't contain the filename when packing with the application.

    <Applicaton ...>
    <Application.Resources>
        <FontFamily x:Key="NotoSans">pack://application:,,,/Fonts/#NotoSans</FontFamily>
        <FontFamily x:Key="NotoSansSymbols">pack://application:,,,/Fonts/#NotoSansSymbols</FontFamily>
    </Application.Resources>
    </Application>
    
  7. Apply your Fonts like this:

    <TextBlock x:Name="myTextBlock" Text="foobar" FontFamily="{StaticResource NotoSans}" 
               FontSize="10.0" FontStyle="Normal" FontWeight="Regular" />
    
  8. You can also set the font imperatively:

    var uri = new Uri("pack://application:,,,/");
    myTextBlock.FontFamily = new FontFamily(uri, "./Fonts/#NotoSans");
    

References

  • MSDN: Packaging Fonts with Applications
like image 20
MovGP0 Avatar answered Oct 13 '22 18:10

MovGP0


This actually is possible! Instead of specifying FontFamily="/Fonts/MyFont/MyFont-Regular.ttf#My Font" you should rather specify only the folder with your font files and the name of the font:

FontFamily="/Fonts/MyFont/#My Font"

WPF then inspects all font files in that directory and loads them into one FontFamily if the font name matches the name specified after the #.

This way you can easily define one FontFamily in your resources and use its styles by specifying the properties FontWeight and FontStyle:

<FontFamily x:Key="MyFont">/Fonts/MyFont/#My Font</FontFamily>

<!-- somewhere else: -->
<TextBlock
    Text="Hello World"
    FontFamily="{StaticResource MyFont}"
    FontWeight="Bold"/>

This will automatically use your TTF files from that folder.

like image 4
gehho Avatar answered Oct 13 '22 18:10

gehho