Android: Using the built-in fonts and adding effects

This is the first article in my “five days of Android articles“.

Currently Android has a few built-in fonts that can be easily harnessed in your applications. Today I’m going to quickly go over how to use these as well as some added effects like creating shadows, bold, italic, colors, etc.

I created a new Android Project in Eclipse called “AndroidFonts”:

From here I modified the “main.xml” file in the layout folder.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:text="MonoSpace Font:"
	    android:textSize="16sp"
	    android:paddingLeft="5sp"
	    />
	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:paddingLeft="5sp"
	    android:typeface="monospace"
	    android:text="Hello Red Monospace"
	    android:textSize="16sp"
	    android:textColor="#ff0000"
	    />

	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:text="Sans Font:"
	    android:textSize="16sp"
	    android:paddingLeft="5sp"
	    />
	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:paddingLeft="5sp"
	    android:typeface="sans"
	    android:text="Hello Blue Sans"
	    android:textSize="16sp"
	    android:textColor="#0000ff"
	    />

	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:text="Serif Font:"
	    android:textSize="16sp"
	    android:paddingLeft="5sp"
	    />
	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:paddingLeft="5sp"
	    android:paddingRight="2sp"
	    android:typeface="serif"
	    android:text="Hello Green Serif"
	    android:textSize="16sp"
	    android:textColor="#00ff00"
	    />

	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:paddingLeft="5sp"
	    android:paddingTop="15sp"
	    android:typeface="normal"
	    android:text="I'm normal font but I'm also bold and italic"
	    android:textSize="16sp"
	    android:textStyle="bold|italic"
	    android:textColor="#ffffff"
	    />

	<TextView
		android:orientation="horizontal"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:paddingLeft="5sp"
	    android:paddingTop="15sp"
	    android:paddingBottom="15sp"
	    android:typeface="normal"
	    android:text="I'm normal (bold) font but I have a shadow"
	    android:textSize="16sp"
	    android:textStyle="bold"
	    android:shadowColor ="#0f0f0f"
	    android:shadowRadius="1.6"
	    android:shadowDx="1.5"
	    android:shadowDy="1.3"
	    android:textColor="#000000"
	    android:background="#ffffff"
	    />
</LinearLayout>

When I run the project I get this result in the emulator:

As you can see from the code I used the fonts: sans, serif, and monospace. Then I showed off how to make a string bold and italic:

android:textStyle="bold|italic"

Then a string utilizing the shadowing effect:

android:shadowColor ="#0f0f0f"
android:shadowRadius="1.6"
android:shadowDx="1.5"
android:shadowDy="1.3"

Colors are as simple as adding:

android:textColor="#ff0000"

Pretty easy!