Introduction

If you have bit of experience with Mobile or Web development, you might have noticed most of the clients or end user’s expectations are gone high. One of the best way is to add custom font and you can feel big difference on how app’s look and feel.

iOS and MacOS preinstalled fonts

https://developer.apple.com/fonts/system-fonts/

Android preinstalled font

Android default

For fonts to work on the app, they have to be installed in the app. Below is the example of adding font files in android inside Assets folder.

Define the font in the application resources in app.xml file as shown below

    <Application.Resources>
        <ResourceDictionary>
            <OnPlatform x:TypeArguments="x:String"
                        x:Key="PoppinsLight">
                <On Platform="Android"
                    Value="Poppins-Light.ttf#Poppins" />
            </OnPlatform>
        </ResourceDictionary>
    </Application.Resources>

Now we have to create styles as shown below

        <Style x:Key="IssueHeader"
               TargetType="renderers:ShieldLabel">
            <Setter Property="FontFamily"
                    Value="{StaticResource PoppinsLight}" />

Then we can use it as shown below

<Label Style="{StaticResource IssueHeader}" Text="Hello World" />