FontAwesome Example

Hello friends
Today we are learn about what is "FontAwesome" why use and how to use in your android application.So lets start..

Q. What is FontAwesome ?

Font Awesome is a font and icon toolkit based on CSS and LESS. it was made by dave Gandy for use with the Twitter Bootstrap and later was incorporated into the BootstarapCDN.

Q. Why use FontAwesome ?

 Font Awesome give you scalable vector icons that can instantly be customize.


How to use FontAwesome ? Follow some instructions...

Create a new android studio project.

Basically you can use font awesome many type so i am going to tech you all these step by step.


Download file

Step 1>

 Copy below resource code and go to values folder and  paste in string.xml resource file

<resources>

    <string name="fa_arrow_down">&#xf063;</string>

    <string name="fa_bank">&#xf19c;</string>

    <string name="fa_birthday_cake">&#xf1fd;</string>

</resources>

 Go to mainactivity.xml

<LinearLayout

    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=".MainActivity">

    <TextView

android:id="@+id/text1"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_arrow_down"

        android:layout_weight="1" />

    <TextView

android:id="@+id/text2"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_bank"

        android:layout_weight="1" />

    <TextView

android:id="@+id/text3"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_birthday_cake"

        android:layout_weight="1" />

</LinearLayout>




and now go to MainActivity.java










@Override

protected void onCreate(Bundle savedInstanceState) {

   super.onCreate(savedInstanceState);

   setContentView(R.layout.activity_main);

   //Select TextView we want to change the Font

   TextView textView1 = (TextView) findViewById(R.id.text1);

TextView textView2 = (TextView) findViewById(R.id. text2);

TextView textView3 = (TextView) findViewById(R.id. text3);

   Typeface font = Typeface.createFromAsset(getAssets(),"fontawesome.ttf");

   //Set the typeface

   textView1.setTypeface(font);

textView2.setTypeface(font);

textView3.setTypeface(font);

}













now see ..







now you can change color this icon add some line of code.







<TextView

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_arrow_down"

android:textColor="#990000"

        android:layout_weight="1" />

    <TextView

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_bank"

android:textColor="#F50057"

        android:layout_weight="1" />

    <TextView

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_birthday_cake"

android:textColor="#FFF000"

        android:layout_weight="1" />




Now see..



















Step 2> 

        In another way create a custom class TextViewAwesom.java 

   public class TextViewAwesom  extends TextView {

    private final static String NAME = "FONTAWESOME";

    private static LruCache<String, Typeface> sTypefaceCache = new LruCache<String, Typeface>(12);

    public TextViewAwesom(Context context) {

        super(context);

        init();

    }

    public TextViewAwesom(Context context, AttributeSet attrs) {

        super(context, attrs);

        init();

    }

    public void init() {

        Typeface typeface = sTypefaceCache.get(NAME);

        if (typeface == null) {

            typeface = Typeface.createFromAsset(getContext().getAssets(), "fontawesom.ttf");

            sTypefaceCache.put(NAME, typeface);

        }

        setTypeface(typeface);

    }

}

now you change xml file code see below code..

<LinearLayout

    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=".MainActivity">

    <com.samset.blog.TextViewAwesome

android:id="@+id/text1"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_arrow_down"

        android:layout_weight="1" />

    <com.samset.blog.TextViewAwesome

android:id="@+id/text2"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_bank"

        android:layout_weight="1" />

    <com.samset.blog.TextViewAwesome

android:id="@+id/text3"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:gravity="center"

android:text="@string/fa_birthday_cake"

        android:layout_weight="1" />

</LinearLayout>







now no need to extra code in mainactivity.java file  




If you want to full source code sample so go to this link

https://github.com/search?utf8=%E2%9C%93&q=FontAwesomSample

If this helps you then feel free to like and follow me on github.

Thank you.