Cara Menggunakan Fontawesome di Aplikasi Android

Icon merupakan simbol yang digunakan untuk merepresentasikan sesuatu. Di dalam aplikasi android, icon sangat berguna untuk mempermudah navigasi user dan juga mempercantik tampilan. Salah satu toolkit / library icon yang terkenal yaitu Fontawesome. Pada tutorial kali ini kita akan membahas bagaimana cara menggunakan fontawesome di aplikasi android.

Fontawesome merupakan sebuah toolkit icon yang banyak digunakan di berbagai website. Fontawesome icon merupakan toolkit icon terlengkap dan terupdate. Sampai saat artikel ini dibuat, versi fontawesome sudah sampai versi 5.

Setiap icon dari fontawesome akan direpresentasikan melalui sebuah unicode (cth :  ) . Untuk cara menggunakan fontawesome di aplikasi android kita akan memanfaatkan unicod e ini.

Untuk list unicode / Unicode cheatsheet bisa kalian lihat disini ya : https://fontawesome.com/v4.7.0/cheatsheet/

Fontawesome di Aplikasi Android

Untuk menggunakan fontawesome di aplikasi android pertama kalian buka dulu ya android studio-nya.

Download TTF Fontawesome Icon

Setelah itu kalian bisa download fontawesome-webfont.ttf lewat sini https://fontawesome.com/v4.7.0/get-started/

Copy dan paste fontawesome-webfont.ttf ke dalam folder assets android studio kalian.

Kemudian rename menjadi fontawesome.ttf.

Membuat Class Fontawesome

Kemudian kita akan membuat sebuah class yang mengextend textview. Jadi kita akan menggunakan class ini sebagai pengganti textview. Sebagaimana Textview, kita bisa mengatur padding, margin dan lain-lain di class ini. Bedanya kita bisa menyelipkan unicode fontawesome icon yang akan dikonversi menjadi icon nantinya.

public class FontAwesome extends TextView {

public FontAwesome(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}

public FontAwesome(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}

public FontAwesome(Context context) {
super(context);
init();
}

private void init() {

//Font name should not contain "/".
Typeface tf = Typeface.createFromAsset(getContext().getAssets(),
"fontawesome.ttf");
setTypeface(tf);
}

}

Menampilkan Fontawesome Icon

Setelah kita membuat class di atas, kita bisa langsung menggunakannya untuk menampilkan fontawesome di aplikasi android kita.

Caranya sama saja saat kita ingin menggunakan textview.

<nama_package.Fontawesome
android:id="@+id/tv_hello"
android:text=" Hello World!"
android:clickable="true"
android:onClick="login"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

Sampai sini, kita sudah bisa menampilkan fontawesome icon di aplikasi android kita nih. Tapi masih ada cara yang lain lagi nih.

Cara 2 : Menggunakan FontManager

Selain cara di atas kita bisa menampilkan fontawesome menggunakan TypeFace. Caranya sama, pertama kita akan membuat sebuah helper class untuk menampilkan fontawesome di textview kita.

Buatlah Sebuah Folder Baru

Pertama, buatlah sebuah direktori / folder baru di assets, kemudian beri nama fonts.

Kemudian import fontawesome-webfont.ttf yang sudah kita download tadi ke dalam direktori fonts tersebut.

Buat Helper Class

Selanjutnya kita akan membuat sebuah helper class untuk kita gunakan sebagai ‘pembantu’ dalam menampilkan fontawesome.

Buat class baru berinama FontManager.

Isi Class tersebut dengan script berikut :

public class FontManager {
public static final String ROOT = "fonts/",
FONTAWESOME = ROOT + "fontawesome-webfont.ttf";
public static Typeface getTypeface(Context context, String font) {
return Typeface.createFromAsset(context.getAssets(), font);
}
}

Kemudian kita bisa menset typeface textview kita dengan class yang sudah kita buat tadi :

Typeface iconFont = FontManager.getTypeface(getApplicationContext(), FontManager.FONTAWESOME);
textview = (TextView) findViewById(R.id.textview);
textview.setTypeface(iconFont);

Setelah itu kita bisa menggunakan unicode fontawesome di dalam layout kita dengan cara yang sama seperti di atas :

<TextView
android:id="@+id/textview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text=" Lihat Arsip"
android:textSize="20sp" />

Bagaimana? apa kalian berhasil menggunakan fontawesome di aplikasi android kalian?

Kalau berhasil dishare ya, dan juga kalau ada yang salah di artikel ini tolong dikoreksi hehe.

Kalau kalian meras artikel ini bermanfaat, jangan lupa tinggalkan komentar ya 🙂

Sumber Air : https://stackoverflow.com/questions/37959751/how-to-use-font-awesome-icon-in-android-application

Terimakasih.

Cara Menggunakan Fontawesome di Aplikasi Android