Martman
Martman

Reputation: 332

Why is the custom font not being used? Xamarin.Forms.iOS

I am working with custom fonts right now and currently a font named: "Yellowtail-Regular.tff". I created a map called Fonts in my iOS folder and I added the tff file in there. After that I went to my Info.plist and created a Fonts provided by application and in there I created a new string called Fonts/Yellowtail-Regular.ttf.

When I now try to use it like this:

<Label FontFamily = "Yellowtail" Text = "Testing my label" />

The standard font (Helvetica Neue) still remains. I also tried with:

<Label FontFamily = "Yellowtail-Regular" Text = "Testing my label" />

But with the same outcome.

Am I missing a step or am I doing something wrong?

Upvotes: 3

Views: 3862

Answers (2)

SushiHangover
SushiHangover

Reputation: 74209

If you are using Yellowtail-Regular.ttf from http://www.1001freefonts.com/yellowtail.font, then that font name under iOS would be just Yellowtail.

Each platform has different naming conventions, so using Device.OnPlatform might look something like:

public Label()
{
  FontFamily = Device.OnPlatform("Yellowtail", "Yellowtail-Regular", "/Assets/Yellowtail-Regular.ttf#Yellowtail-Regular");      
}

To confirm your iOS font family name, on macOS open your .ttf using Font Book and the name that macOS/iOS will use is the one in the title bar of the app.

Upvotes: 7

uday augustin
uday augustin

Reputation: 101

Some times font book will display the name with spaces.

In my case: Font name is : SFProDisplay-Ultralight. But the font book shown the name as "SF Pro Display Ultralight". Due to this custom font is not working in iOS.

So you can use the below code to find the correct font name and apply it in the iOS. Add this code in the AppDelegate launch method. Then you can find the list of viable font names in the Application output.

foreach (var family in UIFont.FamilyNames)
{
    System.Diagnostics.Debug.WriteLine($"{family}");

    foreach (var names in UIFont.FontNamesForFamilyName(family))
    {
        System.Diagnostics.Debug.WriteLine($"{names}");
    }
}

After that you can use xaml to refer the font.

<OnPlatform x:Key="SFProDisplayUltraLight" x:TypeArguments="x:String">
    <On Platform="iOS" Value="SFProDisplay-Ultralight" />
    <On Platform="Android" Value="SF-Pro-Display-Ultralight.otf#SF Pro Display Ultralight" />
</OnPlatform>

Then Apply it for the control.

<Lable Text="Welcome" FontFamily="{StaticResource SFProDisplayUltraLight}"/>

Upvotes: 7

Related Questions