How to use Roboto in xml layout

Nouvel Travay picture Nouvel Travay · Dec 23, 2015 · Viewed 37.4k times · Source

I hear it often nowadays: “Roboto is the default font type”. But how do I use this default font type? What I mean specifically is that in the old days when I used to download the assets, etc., I used to have to specify things like

<item name="typeface">roboto_bold</item>

Imagine I am interested in using all of say (in turn)

roboto_thin
 roboto_thin_italic
 roboto_light
 roboto_light_italic
 roboto_regular
 roboto_italic
 roboto_medium
 roboto_medium_italic
 roboto_bold
 roboto_bold_italic
 roboto_black
 roboto_black_italic
 roboto_condensed_light
 roboto_condensed_light_italic
 roboto_condensed_regular
 roboto_condensed_italic
 roboto_condensed_bold
 roboto_condensed_bold_italic
 roboto_slab_thin
 roboto_slab_light
 roboto_slab_regular
 roboto_slab_bold

How do I specify them in my xml layout file or style.xml file?

Answer

piotrek1543 picture piotrek1543 · Dec 24, 2015

I've already found some possibilities

Using fontfamily

The simplest way would be add fontFamily attribute to your specific view like TextView

According to How to change fontFamily of TextView in Android

From android 4.1 / 4.2 / 5.0, the following Roboto font families are available:

android:fontFamily="sans-serif"           // roboto regular
android:fontFamily="sans-serif-light"     // roboto light
android:fontFamily="sans-serif-condensed" // roboto condensed
android:fontFamily="sans-serif-thin"      // roboto thin (android 4.2)
android:fontFamily="sans-serif-medium"    // roboto medium (android 5.0)

http://developer.android.com/reference/android/widget/TextView.html#attr_android:typeface

in combination with

android:textStyle="normal|bold|italic"

this 14 variants are possible:

  • Roboto regular
  • Roboto italic
  • Roboto bold
  • Roboto bold italic
  • Roboto-Light
  • Roboto-Light italic
  • Roboto-Thin
  • Roboto-Thin italic
  • Roboto-Condensed
  • Roboto-Condensed italic
  • Roboto-Condensed bold
  • Roboto-Condensed bold italic
  • Roboto-Medium
  • Roboto-Medium italic

You can also do this programmatically using code as below:

textView.setTypeface(Typeface.create("sans-serif-thin", Typeface.NORMAL));

Using typeface

Available built-ibn fonts are:

  • normal
  • sans
  • serif
  • monospace

You can cobine them like below:

   android:typeface="sans" | "serif" | "monospace"

See android:typeface.

Using styles.xml

You set style in styles.xml` like that:

<style name="boldText">
    <item name="android:textStyle">bold|italic</item>
    <item name="android:textColor">#FFFFFF</item>
</style>

and to use this style in main.xml layout file just use:

style="@style/boldText"

Combining Text atrributes

You can mix TextView attributes like in code below:

 android:fontFamily="serif" 
 android:textStyle="italic"

Using third-party libraries

Foundry - apply custom typefaces through XML layouts and styles.

android-typeface-helper - Typeface helper for Android

Additional lecture

You may also want to read about Roboto typeface and Typography Google's Design Guide.

Similar StackOverflow Issues: