Android Custom Fonts Example

Total Views : 350
Zoom In Zoom Out Read Later Print

In this tutorial, i will explain how to set up android custom fonts in TextViews in our android application.

For a custom font for a TextView you have two method. you can use one of the as you want. first method only require 2 line of code for a custom font for a view. But second method require more coding for a font and also need to create a custom view for our TextView.

Method #1

You need to use only these two line of code if you want to set custom font using this method. This method is best when you want to use custom fonts only for one or two views or activity.

Custom Font

//Creating Typeface
Typeface tf = Typeface.createFromAsset(getAssets(), font_path);
// Applying font
textView.setTypeface(tf);

Method #2

Let's try second method if you want to create multiple font at once and use them whenever you want. This method should be used when you want to use your custom font for your complete android application.
1. creating custom font.

attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="MyTextView">
<attr name="custom_font">
<enum value="1" name="acmeRegular"/>
<enum value="2" name="airAmericaRegular"/>
<enum value="3" name="alegreyaSansMedium"/>
<enum value="4" name="alexBrushRegular"/>
<enum value="5" name="almendraItalic"/>
<enum value="6" name="brushsip"/>
<enum value="7" name="openSansRegular"/>
<enum value="8" name="salsaRegular"/>
</attr>
</declare-styleable>
</resources>

1.2 Creating Typeface from font file placed in assets.

FontFactory.java

package com.prodevsblog.customfont;

import android.content.Context;
import android.graphics.Typeface;

public class FontFactory {

private String FONT_ACME_REGULAR = "fonts/Acme-Regular.ttf";
private String FONT_AIR_REGULAR ="fonts/AirAmerica-Regular.otf";
private String FONT_ALEGREYA_MEDIUM = "fonts/AlegreyaSans-Medium.otf";
private String FONT_ALEX_BRUSH_REGULAR = "fonts/AlexBrush-Regular.ttf";
private String FONT_ALMENDRA_ITALIC="fonts/Almendra-Italic.otf";
private String FONT_BRUSHSIP ="fonts/BRUSHSTP.ttf";
private String FONT_SALSA_REGULAR ="fonts/Salsa-Regular.ttf";

Typeface acmeRegular;
Typeface airAmericaRegular;
Typeface alegreyaSansMedium;
Typeface alexBrushRegular;
Typeface almendraItalic;
Typeface brushsip;
Typeface salsaRegular;

public FontFactory(Context context){
acmeRegular = Typeface.createFromAsset(context.getAssets(),FONT_ACME_REGULAR);
airAmericaRegular = Typeface.createFromAsset(context.getAssets(),FONT_AIR_REGULAR);
alegreyaSansMedium = Typeface.createFromAsset(context.getAssets(),FONT_ALEGREYA_MEDIUM);
alexBrushRegular = Typeface.createFromAsset(context.getAssets(),FONT_ALEX_BRUSH_REGULAR);
almendraItalic = Typeface.createFromAsset(context.getAssets(),FONT_ALMENDRA_ITALIC);
brushsip = Typeface.createFromAsset(context.getAssets(),FONT_BRUSHSIP);
salsaRegular = Typeface.createFromAsset(context.getAssets(),FONT_SALSA_REGULAR);
}
}

1.3 Creating custom TextView for our custom fonts.

MyTextView

package com.prodevsblog.customfont;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Typeface;
import android.util.AttributeSet;
import android.support.v7.widget.AppCompatTextView;

public class MyTextView extends AppCompatTextView {

private int typefaceType;
private FontFactory mFontFactory;

public MyTextView(Context context, AttributeSet attrs) {
super(context, attrs);
applyFont(context, attrs);
}

public MyTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
applyFont(context, attrs);
}

public MyTextView(Context context) {
super(context);
}

private void applyFont(Context context, AttributeSet attrs) {
TypedArray array = context.getTheme().obtainStyledAttributes( attrs, R.styleable.MyTextView, 0, 0);
try {
typefaceType = array.getInteger(R.styleable.MyTextView_custom_font, 0);
} finally {
array.recycle();
}
if (!isInEditMode()) {
setTypeface(getTypeFace(typefaceType));
}

}

public Typeface getTypeFace(int type) {
if (mFontFactory == null)
mFontFactory = new FontFactory(getContext());

switch (type) {
case Constants.FONT_ACME_REGULAR:
return mFontFactory.acmeRegular;
case Constants.FONT_AIR_REGULAR:
return mFontFactory.airAmericaRegular;
case Constants.FONT_ALEGREYA_MEDIUM:
return mFontFactory.alegreyaSansMedium;
case Constants.FONT_ALEX_BRUSH_REGULAR:
return mFontFactory.alexBrushRegular;
case Constants.FONT_ALMENDRA_ITALIC:
return mFontFactory.almendraItalic;
case Constants.FONT_BRUSHSIP:
return mFontFactory.brushsip;
case Constants.FONT_SALSA_REGULAR:
return mFontFactory.salsaRegular;
default:
return mFontFactory.salsaRegular;
}
}

public interface Constants {
int FONT_ACME_REGULAR = 1,
FONT_AIR_REGULAR = 2,
FONT_ALEGREYA_MEDIUM= 3,
FONT_ALEX_BRUSH_REGULAR = 4,
FONT_ALMENDRA_ITALIC = 5,
FONT_BRUSHSIP = 6,
FONT_SALSA_REGULAR = 7;
}
}

2. Using fonts in xml layout.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="acmeRegular"
android:text="Acme Regular"
android:textSize="20sp"
android:id="@+id/acmeRegular"
android:padding="5dp"
/>
<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="airAmericaRegular"
android:text="Air America Regular"
android:textSize="20sp"
android:id="@+id/airAmericaRegular"
android:padding="5dp"
/>
<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="alegreyaSansMedium"
android:text="Alegreya Sans Medium"
android:textSize="20sp"
android:id="@+id/alegreyaSansMedium"
android:padding="5dp"
/>
<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="alexBrushRegular"
android:text="Alex Brush Regular"
android:textSize="20sp"
android:id="@+id/alexBrushRegular"
android:padding="5dp"
/>
<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="almendraItalic"
android:text="Almendra Italic"
android:textSize="20sp"
android:id="@+id/almendraItalic"
android:padding="5dp"
/>
<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="brushsip"
android:text="Brushsip"
android:textSize="20sp"
android:id="@+id/brushsip"
android:padding="5dp"
/>
<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="openSansRegular"
android:text="Open Sans Regular"
android:textSize="20sp"
android:id="@+id/openSansRegular"
android:padding="5dp"
/>
<com.prodevsblog.customfont.MyTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:custom_font="salsaRegular"
android:text="Salsa Regular"
android:textSize="20sp"
android:id="@+id/salsaRegular"
android:padding="5dp"
/>
</LinearLayout>

</android.support.constraint.ConstraintLayout>

MainActivity.java

package com.prodevsblog.customfont;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}

If you have any problem with above code you can comment or simply download our working code for this project.


See More

Latest Photos