Embedding fonts

In this post i will show how to embed custom fonts into your app. You can find some free fonts here.

Step 1. – Make the font file usable

Fist we have to do is to add our fonts to the project – simply copy font file to desired folder in your project, e.g. “Fonts” folder. On the properties of the font file we have to set few properties:

  • Build action: Content,
  • Copy to Output Directory: Copy if newer

This is critical, if you do not set this two properties you wont be able to actually use font file.

Font file in Solution explorer

Settings Build action and Copy to Output Directory values

 Step 2. – Actually use the font file

To use the font file we have to reference the file, in xaml, like this:

 <TextBlock FontSize="35" FontFamily="Fonts/BOMB.ttf#RMbomb" Text="SAMPLE TEXT" VerticalAlignment="Center" />  

Pay attention to the FontFamily property of the TextBlock. First set the path to the font file, in my case:  Fonts/BOMB.ttfthen add: “#”, and at the end add font name:  RMbomb.  To see what’s your font name just open font file in Windows Font Viewer, and font name will be in the title bar.

Here is how that all looks in actual Windows Phone application.

 

Source code

Download source here.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s