Android icons font

In this Android tip, I am going to show you how to use Heydings icons font in your application. Using font icons is better than images because the font icons can be scaled without losing quality. You are also easy to change colors, and apply shadow to the font icons.



To use the Heydings icons font, you need to download it from the link: http://www.fontsquirrel.com/fonts/heydings-common-icons. Then add the heydings_icons.ttf file to the assets folder of your project. In your code, you need to create an instance of Typeface for the icons font. Then set the Typeface instance to all widgets that display the font icons. To render the icons correctly, you need to know the codes that are mapped to the icons. For example, the question mark icon (?) is mapped to the code: 0054. You can get the codes used in the Heydings font from page: http://www.fonts2u.com/heydings-icons

Now to have an example application on using Heydings icons font, you create a new Android project. Then in the activity_main.xml file, you add four TextViews as shown below.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   tools:context="com.example.myfirstprogram.MainActivity" >

  
<LinearLayout
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:paddingBottom="5dp"
     android:orientation="horizontal"
     android:layout_alignParentBottom="true"
     android:background="#0B3861"
     >
    
  
   <TextView
     android:id="@+id/txtreg"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_weight="1"
     android:textSize="30sp"
     android:textColor="#ffffff"
     android:gravity="center"
     />
   <TextView
     android:id="@+id/txttracking"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_weight="1"
     android:textSize="30sp"
     android:textColor="#ffffff"
     android:gravity="center"
   />
   <TextView
     android:id="@+id/txtsms"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_weight="1"
     android:textSize="30sp"
     android:textColor="#ffffff"
     android:gravity="center"
    
     />
   <TextView
     android:id="@+id/txtqa"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_weight="1"
     android:textSize="30sp"
     android:textColor="#ffffff"
     android:gravity="center"
     />
</LinearLayout>

</RelativeLayout>


Then in the MainActivity class, you create an instance of Typeface for the Heyding icons font and set the instance to all the TextViews. You need to prefix the code of an icon with the \u to represent the code as unicode.

public class MainActivity extends ActionBarActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Create Typeface object to use the icons font
Typeface font= Typeface.createFromAsset(getAssets(), "heydings_icons.ttf");
TextView regIcon=(TextView)findViewById(R.id.txtreg);
TextView trackIcon=(TextView)findViewById(R.id.txttracking);
TextView smsIcon=(TextView)findViewById(R.id.txtsms);
TextView qaIcon=(TextView)findViewById(R.id.txtqa);
regIcon.setTypeface(font);
regIcon.setText("\u0041");
trackIcon.setTypeface(font);
trackIcon.setText("\u0040");
smsIcon.setTypeface(font);
smsIcon.setText("\u0045");
qaIcon.setTypeface(font);
qaIcon.setText("\u0051");

}
}

Android-icons-font

Posted by: Dara | post date: 01-30-2015 | Subject: Android Apps Development

write programming tip




This website intents to provide free and high quality tutorials, examples, exercises and solutions, questions and answers of programming and scripting languages:
C, C++, C#, Java, VB.NET, Python, VBA,PHP & Mysql, SQL, JSP, ASP.NET,HTML, CSS, JQuery, JavaScript and other applications such as MS Excel, MS Access, and MS Word. However, we don't guarantee all things of the web are accurate. If you find any error, please report it then we will take actions to correct it as soon as possible.