Android Custom Fonts Tutorial

Advertisements


In android , you can define your own custom fonts for the strings in your application. You just need to download the required font from the internet, and then place it in assets/fonts folder.

After putting fonts in the assets folder under fonts folder, you can access it in your java code through Typeface class. First , get the reference of the text view in the code. Its syntax is given below:

TextView tx = (TextView)findViewById(R.id.textview1);

The next thing you need to do is to call static method of Typeface class createFromAsset() to get your custom font from assets. Its syntax is given below:

Typeface custom_font = Typeface.createFromAsset(getAssets(), "fonts/font name.ttf");

The last thing you need to do is to set this custom font object to your TextView Typeface property. You need to call setTypeface() method to do that. Its syntax is given below:

tx.setTypeface(custom_font);

Apart from these Methods, there are other methods de;fined in the Typeface class , that you can use to handle Fonts more effectively.

Sr.NoMethod & description
1create(String familyName, int style)
Create a Typeface object given a family name, and option style information
2create(Typeface family, int style)
Create a Typeface object that best matches the specified existing Typeface and the specified Style
3createFromFile(String path)
Create a new Typeface from the specified font file
4defaultFromStyle(int style)
Returns one of the default Typeface objects, based on the specified style
5getStyle()
Returns the Typeface's intrinsic style attributes

Example

Here is an example demonstrating the use of Typeface to handle CustomFont. It creates a basic application that displays a custom font that you specified in the fonts file.

To experiment with this example , you can run this on an actual device or in an emulator.

StepsDescription
1You will use Eclipse IDE to create an Android application and name it as CustomFonts under a package com.example.customfonts. While creating this project, make sure you Target SDK and Compile With at the latest version of Android SDK to use higher levels of APIs.
2Download a font from internet and put it under assets/fonts folder.
3Modify src/MainActivity.java file to add necessary code.
4Modify the res/layout/activity_main to add respective XML components
5Modify the res/values/string.xml to add necessary string components
6Run the application and choose a running android device and install the application on it and verify the results

Following is the content of the modifed main activity file src/com.example.customfonts/MainActivity.java.

package com.example.customfonts;

import android.app.Activity;
import android.graphics.Typeface;
import android.os.Bundle;
import android.view.Menu;
import android.widget.TextView;

public class MainActivity extends Activity {

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      TextView tx = (TextView)findViewById(R.id.hello);
      Typeface custom_font = Typeface.createFromAsset(getAssets(),
      "fonts/Erika Type.ttf");
      tx.setTypeface(custom_font);
   }

   @Override
   public boolean onCreateOptionsMenu(Menu menu) {
      // Inflate the menu; this adds items to the action bar if it is present.
      getMenuInflater().inflate(R.menu.main, menu);
      return true;
   }
}

Following is the modified content of the xml res/layout/activity_main.xml.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:orientation="vertical">

   <TextView
      android:id="@+id/hello"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:textSize="70dip"
      android:text="@string/hello_world" />

</LinearLayout>

Following is the content of the res/values/string.xml.

<?xml version="1.0" encoding="utf-8"?>
<resources>

   <string name="app_name">CustomFonts</string>
   <string name="action_settings">Settings</string>
   <string name="hello_world">Hello</string>

</resources>

Following is the content of AndroidManifest.xml file.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.example.customfonts"
   android:versionCode="1"
   android:versionName="1.0" >

   <uses-sdk
      android:minSdkVersion="8"
      android:targetSdkVersion="17" />

   <application
      android:allowBackup="true"
      android:icon="@drawable/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" >
      <activity
         android:name="com.example.customfonts.MainActivity"
         android:label="@string/app_name" >
         <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
         </intent-filter>
      </activity>
    </application>
</manifest>

Let's try to run our Custom Font application we just modified. I assume you had created your AVD while doing environment setup. To run the app from Eclipse, open one of your project's activity files and click Run Eclipse Run Icon icon from the toolbar. Eclipse installs the app on your AVD and starts it and if everything is fine with your setup and application, it will display following Emulator window:

Anroid Loading Spinner Tutorial

As you can see that the text that appeared on the AVD has not a default android font, rather it has the custom font that you specified in the fonts folder.

Note: You need to take care of the size and the character supported by the font , when using custom fonts.



Advertisements
Advertisements