How to Change FontFamily of TextView in Android

How to Change FontFamily of TextView in Android

22 May 2024 Stephan Petzl Leave a comment Tech-Help

Changing the android:fontFamily of a TextView in Android can be a bit confusing, especially with the variety of options available. This article will guide you through the different methods to achieve this, ensuring you can select from pre-defined fonts or use custom fonts effectively.

Pre-Defined Font Families in Android

Android provides several built-in font families that you can use directly in your XML layouts. Below are some of the commonly available Roboto font families from Android 4.1 (Jelly Bean) onwards:

  • android:fontFamily="sans-serif" – Roboto Regular
  • android:fontFamily="sans-serif-light" – Roboto Light
  • android:fontFamily="sans-serif-condensed" – Roboto Condensed
  • android:fontFamily="sans-serif-black" – Roboto Black
  • android:fontFamily="sans-serif-thin" – Roboto Thin (Android 4.2+)
  • android:fontFamily="sans-serif-medium" – Roboto Medium (Android 5.0+)

These can be combined with android:textStyle="normal|bold|italic" to create a variety of text styles:

  • Roboto Regular
  • Roboto Italic
  • Roboto Bold
  • Roboto Bold Italic

Using Custom Fonts

Starting from Android Studio 3.0 and using the support library 26, it is straightforward to use custom fonts. This method works on devices running Android API version 16 and higher.

Steps to Add Custom Fonts

  1. Create a folder named font under the res directory.
  2. Download your desired font and place it inside the font folder. The structure should be like res/font/your_font.ttf.
  3. Ensure you declare both android: and app: attributes to support all versions.

Example XML Usage

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:fontFamily="@font/dancing_script"
    app:fontFamily="@font/dancing_script"/>

Programmatic Usage

Typeface typeface = ResourcesCompat.getFont(context, R.font.myfont);
textView.setTypeface(typeface);

Using Styles

You can also define a custom style in styles.xml and apply it to your TextView:

<style name="Regular">
    <item name="android:fontFamily">@font/dancing_script</item>
    <item name="android:textStyle">normal</item>
</style>
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    style="@style/Regular"/>

Creating Your Own Font Family

To create your own font family, right-click the font folder and go to New > Font resource file. The new font resource XML will open in the editor:

<font-family xmlns:android="http://schemas.android.com/apk/res/android">
    <font
        android:fontStyle="normal"
        android:fontWeight="400"
        android:font="@font/lobster_regular" />
    <font
        android:fontStyle="italic"
        android:fontWeight="400"
        android:font="@font/lobster_italic" />
</font-family>

XML Usage for Custom Font Family

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:fontFamily="@font/lobster"/>

Programmatic Usage for Custom Font Family

Typeface typeface = ResourcesCompat.getFont(context, R.font.lobster);
textView.setTypeface(typeface);

Conclusion

Changing the font of a TextView in Android is relatively simple with both pre-defined and custom fonts. By following the steps outlined above, you can enhance the visual appeal of your app with the right typography.

For more detailed documentation, you can refer to our guides on selecting Android SDK in Android Studio and resolving Cleartext HTTP traffic not permitted error in Android 8 and above.

How Repeato Can Help

When working on mobile apps, ensuring a consistent and visually appealing font throughout your application is crucial. Repeato, a no-code test automation tool for iOS and Android, can help you maintain this consistency by allowing you to create, run, and maintain automated tests for your app’s UI elements. By leveraging Repeato’s computer vision and AI capabilities, you can quickly verify that your fonts and other UI elements render as expected across different devices and screen sizes. This frees up your development team to focus on creating a great product and allows non-technical colleagues to take part in the testing process.

Check it out!

Like this article? there’s more where that came from!

Repeato

Documentation

Support

Legal

Repeato Reviews