Now you can Subscribe using RSS

Submit your Email

Sunday

Fonts in XML | Custom Fonts in Android Support Library

Vishal Shrestha
Finally, after years of dreaming and praying external fonts are fully supported in Android. By fully I mean you can use it directly in XML, add them to styles, create your own font family. Have same fonts through out the app. It is great! Yes, I am enjoying every bit of this easy font styling instead of having to write a custom class extending required view just to have the font you like, oh what a pain it was! I am happy and this post will make you happy, so lets dive right into code. Yeaaahhhh! The scream of joy!
No more of this stupid method: Custom Fonts In Android Using Custom Class.

different-fonts-letters
Just Some Random Fonts


Custom Fonts in Android
Since Android 8.0, fonts in XML has been introduced. It means fonts can be used as resources. Just add the font file in font folder in your resources directory. Alright people, let's get going. Open your resources folder, create a new folder font in it. Inside it just copy all the fonts you want. For this project I've added montserrat fonts. I like them they are sexy just like myself. HaHa. And now you can just create Styles for your Android App and use the style where you want. For example, create a style like this:

<style name="AccentTitleTextStyle" parent="AppTheme">
        <item name="android:textSize">@dimen/title_text_size</item>
        <item name="android:fontFamily">@font/montserrat_bold</item>
        <item name="android:textColor">@color/colorAccent</item>
</style> 


Now all you need to do is just use this style whereever you want through-out your Android app provided you have added montserrat_bold font in your font folder inside resources.
If you want a default font through out an Android App without applying to every single view, then you can just add the font in your default App Theme like this:

<!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:fontFamily">@font/montserrat_bold</item>
    </style>


Now you'll have the font mentioned in fontFamily property. But this allow only one font, wouldn't it be nice if we could create a Font family and change it just by setting fontStyle property just as we do now with the default Roboto Font? Yes, it would be. And yes we can! Yaaahhhh. Okay come back to earth and create a new XML file in font folder. I'll just call it montserrat as all the fonts I have belong to Montserrat Family. Okay let's go insiiddee the montserrat.xml file:

<?xml version="1.0" encoding="utf-8"?>
<font-family xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <font
        android:font="@font/montserrat_regular"
        android:fontStyle="normal"
        android:fontWeight="400"

        app:font="@font/montserrat_regular"
        app:fontStyle="normal"
        app:fontWeight="400" />

    <font
        android:font="@font/montserrat_light_italic"
        android:fontStyle="italic"
        android:fontWeight="400"

        app:font="@font/montserrat_light_italic"
        app:fontStyle="italic"
        app:fontWeight="400" />

</font-family>


So Simple, now if you use this file as the fontFamily in a style and use that style in views then you can just type fontStyle as italic and your view will use montserrat_light_italic as the style. To use this in Android version as low as 4.1 (API level 16), you need to use a support library >= 26. The app:font lines are so than your fonts can be used in versions lower than API level 26.
This is it. Go, cry tears of joy and use your favorite font in you app!
If you have any issues, feel free to comment below. I'll help, I am happy. :D

Vishal Shrestha / Author & Founder

A developer by profession, a born Adventurer. I mainly do Android but like to get my hands dirty with web development and a little bit of Python. I would't rather go on a Trek than a party and you can find me having a few rounds with the heavy bag to let out the steam ;)

WORK

Research and Development at : Ekghanti

Mobile Technology Lead at : Vimvox Lab

For Business info : My Portfolio Site

0 comments:

Post a Comment

Coprights @ 2017 | The Code City by Vishal Shrestha Vishal Shrestha