Android EasyFont Library Example

In this tutorial, we are going to learn how to use Android EasyFont Library in your android project. If you have used a different typeface in your application apart from the default typeface that android provides for us you will understand how difficult it might be to load and track all the Typeface fonts you stored in the assets folder of your android project.

In the past, I wrote android tutorials on how to use native and custom fonts in android app and also using Font Awesome in Android project. So if you are planning to use any of the method mentioned above, I will suggest you go through these tutorials.

The main advantages of using Android EasyFont in your project is the ease of usage and moreover, all the fonts will be manage by android EasyFont library.

The main disadvantage of using this plugin is that all the font you will get access to have already been added to the library so if you want fonts that are not included in the EasyFont library, you have to add it yourself outside of the library.

The Android EasyFont Library includes some of the fonts listed below.

1. Roboto

2. Android Nation

3. Droid Serif

4. Freedom

5. Fun Raiser

6. Green Avocado

7. Recongnition

8. WalkWay

9. WindSong

10. Tangerine

11. Ostrich

12. Caviar Dreams

13. Capture It

14. Campagne

In other to get a visual understanding of what we are going to create in this android tutorial, I have add below some screen shots from the application.

SOME SCREENSHOT FROM THE APPLICATION

Android easy font library

CREATE NEW ANDROID PROJECT

Lets start to soil our hands in code. Start up your IDE. For this tutorial, I am using the following tools and environment, feel free to use what works for you.

Windows 10

Android Studio

Sony Xperia ZL

Min SDK 14

Target SDK 25

To create a new android application project, follow the steps as stipulated below.

Go to File menu

Click on New menu

Click on Android Application

Enter Project name: AndroidEasyFont

Package: com.inducesmile.androideasyfont

Select Empty Activity

Name your activity: MainActivity

Keep other default selections

Continue to click on next button until Finish button is active, then click on Finish Button.

ADD LIBRARY DEPENDENCIES IN BUILD.GRADLE

Open the build.gradle (module), since we are going to use EasyFont library, add the library to the dependencies section and then click on SYNC to add it to your project. This will make it possible for our android project to access all the classes and method that are exposed by this library.

Open build.gradle file, add the code below to the file.

apply plugin: 'com.android.application'
apply plugin: 'com.android.application'
android {
    compileSdkVersion 25
    buildToolsVersion "24.0.1"
    defaultConfig {
        applicationId "com.inducesmile.easyfont"
        minSdkVersion 14
        targetSdkVersion 25
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}
dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    compile 'com.android.support:appcompat-v7:25.0.1'
    compile 'com.vstechlab.easyfonts:easyfonts:1.0.0'
    testCompile 'junit:junit:4.12'
}

 STRINGS.XML

We are going to update our project strings.xml file located in the values folder inside the res folder. Open the file and add the code below to it.

<resources>
    <string name="app_name">EasyFont</string>
    <string name="this_is_a_roboto_font">This is a Roboto font</string>
    <string name="easyfont">Android Easy Font Library</string>
    <string name="this_is_a_walkway_font">This is a WalkWay font</string>
    <string name="this_is_a_tangerine_font">This is a Tangerine font</string>
    <string name="this_is_a_caviar_dreams_font">This is a Caviar Dreams font</string>
</resources>

 COLORS.XML

Open the colors.xml file in the same location as the strings.xml file and add the code below to the file.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
</resources>

 ACTIVITY_MAIN.XML

In the main activity layout file, we are going to test about four fonts to understand how it works. So add four TextView widgets which will represent each of the font we will use.

Open the activity_main.xml and add the code below.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.inducesmile.easyfont.MainActivity">
    <TextView
        android:id="@+id/roboto"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:layout_marginTop="24dp"
        android:text="@string/this_is_a_roboto_font" />
    <TextView
        android:id="@+id/walkway"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:layout_marginTop="40dp"
        android:text="@string/this_is_a_walkway_font" />
    <TextView
        android:id="@+id/tangerine"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:layout_marginTop="40dp"
        android:text="@string/this_is_a_tangerine_font" />
    <TextView
        android:id="@+id/dreams"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:layout_marginTop="40dp"
        android:text="@string/this_is_a_caviar_dreams_font" />
</LinearLayout>

As you can see, the layout file is very simple. Next, we have to get the instances of the TexView widgets in the MainActivity class using the findViewById() method of the Activity class.

MainActivity Class

Open the MainActivity class and get the instances of the TextView. We will use the setTypeFace() method of the widget class.

The parament to be passed in this method is the TypeFace object we will like to use. This is achieved by call the EasyFont.obotoLight(this);

Add the code below to this class.

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

import com.vstechlab.easyfonts.EasyFonts;

public class MainActivity extends AppCompatActivity {

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

        setTitle(getString(R.string.easyfont));

        TextView robotoFont = (TextView)findViewById(R.id.roboto);
        robotoFont.setTypeface(EasyFonts.robotoLight(this));

        TextView walkWayFont = (TextView)findViewById(R.id.walkway);
        walkWayFont.setTypeface(EasyFonts.walkwayBlack(this));

        TextView tangerineFont = (TextView)findViewById(R.id.tangerine);
        tangerineFont.setTypeface(EasyFonts.tangerineRegular(this));

        TextView dreamsFont = (TextView)findViewById(R.id.dreams);
        dreamsFont.setTypeface(EasyFonts.caviarDreams(this));
    }
}

This brings us to the end of this tutorial. I hope that you have learn something. Run your app and see for yourself.

Remember to subscribe with your email address to be among the first to receive my new android blog post once it is published.

OTHER INTERESTING POSTS:

Add a Comment