CODEWITHSUNDEEP
c#fontswindows-phone-8
Depechie
Depechie

Reputation: 6142

Custom font usage in Windows Phone 8

I have a weird problem with the Windows Phone 8 emulator! I have a small test app where I change the 'page name' textbox on the mainpage so that it shows using a custom font. Now in the visual studio designer I see that font and when running the app I also see it in the emulator, so all is well...

But when I move the main page into a folder called View and change the WMAppManifest.xml to reflect this move > Navigation page is now set to View/MainPage.xaml. I'm still seeing this custom font in my designer, but not anymore in the emulator!!

I don't own a wp8 device yet... so can anyone verify this for me, if this problem is the same when you try to deploy the failure project to the phone?

And does anybody have any clue why this is happening? Very annoying not able to see the correct design in the emulator.

Working and failing projects

Upvotes: 5

Views: 7416

Answers (3)

Mehmet Taha Meral
Mehmet Taha Meral

Reputation: 3843

First of all, you should save the external ttf into your project(If you want to use external font).

Then, you can use this:

FontFamily="Helvetica.ttf#Helvetica"

FontFamily="Cookies.ttf#Cookies"

When the .ttf font file is in the root folder, works fine in Design and Runtime.

FontFamily="/FontsTestApp;component/Cookies.ttf#Cookies"

Same as above.

FontFamily="/Font/Cookies.ttf#Cookies

When the .ttf font file is in the sub folder "font". Works fine in Design and Runtime.

FontFamily="../Fonts/Cookies.ttf#Cookies";

When the XAML file which uses the font resides in another subfolder. Works fine in Design and Runtime.

FontFamily="../Fonts/Cookies.ttf#Cookies";

If the XAML file is in the root folder, the font gets applied only at runtime not at design time.

Upvotes: 0

user2036611
user2036611

Reputation: 31

I hope you found the solution already. Please check out How to add Custom Fonts

This worked for me on Windows Phone 8 (Lumia 920)
It is very important to hashtag the font name after the .ttf
You can find the font name if you preview the ttf file on your PC and write the exact same font name.

Upvotes: 3

Depechie
Depechie

Reputation: 6142

Ok found the solution myself... it's because of the reference to the font inside the styles.xaml.

It should be a full path! So instead of setting:

<Setter Property="FontFamily" Value="Fonts/ClementePDae-Light.ttf#ClementePDae" />

Set this:

<Setter Property="FontFamily" Value="/PhoneApp1;component/Fonts/ClementePDae-Light.ttf#ClementePDae" />

Than everything works!

Upvotes: 9

Related Questions