Android Branding Fonts

(Android docs reference)

Applying a custom font to the Capture can be achieved by editing android resources.

The steps to accomplish this are:

  1. Add font files
  2. Create font family
  3. Add to theme

Step 1: Add Font Files

First, create a font resources folder (/android/app/src/main/res/font). Then, copy all necessary .ttf font files to the font resources folder.

NOTE: You may have to rename your font files to make them compatible with the Android resources naming convention - in that only lowercase letters and underscores are allowed. eg. a file named MyFavouriteFont-Italic.ttf should be renamed to my_favourite_font_italic.ttf. If this is not done, Android will not parse the files and the following steps will not work.

Step 2: Create Font Family

Now, you must create an Android font family that includes the fonts you’ve imported and wish to use. The steps to do so are as follows.

First, create two <my_font_name>_font_family.xml files, one in the font resources folder (/android/app/src/main/res/font), and one in the font-v26 resources folder (/android/app/src/main/res/font-v26). These separate files are required for compatibility with old and new Android versions.

Next, populate the files appropriately. This will consist of creating a font-family tag containing the required font tags.

Normally, this will be two separate font tags, one containing the regular font, and one containing the italic version. Each font tag will include entries for:

  • <app/android>:font - a reference to the actual font file, in the form of @font/<font filename without extension>
  • <app/android>:fontStyle - normal or italic, usually you’ll include one of each
  • <app/android>:fontWeight - The font weight, 400 for normal weight

Use the below example as a template for your font family resource files.

<!-- res/values/font/<my_font_name>_font_family.xml -->
<?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
    app:font="@font/my_favourite_font_regular"
    app:fontStyle="normal"
    app:fontWeight="400" />
  <font
    app:font="@font/my_favourite_font_italic"
    app:fontStyle="italic"
    app:fontWeight="400" />

</font-family>


<!-- res/values/font-v26/<my_font_name>_font_family.xml -->
<?xml version="1.0" encoding="utf-8"?>
<font-family xmlns:android="http://schemas.android.com/apk/res/android">
  <font
    android:font="@font/my_favourite_font_regular"
    android:fontStyle="normal"
    android:fontWeight="400" />
  <font
    android:font="@font/my_favourite_font_italic"
    android:fontStyle="italic"
    android:fontWeight="400" />

</font-family>

Step 3: Add to Theme

The final step is to set your newly created font family as the default font for the theme. In your values resources folder (/android/app/src/main/res/values/) styles file in which you added the New.Theme.Sensibill.CaptureStandalone style, add references to the font family you created above.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="New.Theme.Sensibill.CaptureStandalone" parent="Base.New.Theme.Sensibill.CaptureStandalone">
        <!-- Font -->
        <!-- Add Font font family here, replacing `my_font_name` with your own font name -->
        <item name="fontFamily">@font/my_font_name_font_family</item>
        <item name="android:fontFamily">@font/my_font_name_font_family</item>

        <!-- Other theme custoimzation... -->
    </style>
</resources>