0
0
Font Awesome 6 icon ini biasanya didapatkan dari Font Awesome itu yang dimana font tersebut akan berubah menjadi ikon dengan sesuai kode ikon sendiri. Misalkan, untuk membuat ikon pencarian, maka perlu ketikkan “search” di kolom teks pada komponen UI yang hanya berlaku untuk Label saja. Di dalam App Inventor 2 ini tidak menyediakan typeface font yang dikhususkan untuk ikon yang dimana bisa dijadikan lebih menarik untuk tampilan UI aplikasi yang terutama bagian Label Android sendiri.
Cara Mendapatkan Font Awesome
Untuk mendapatkan file Font Awesome yang biasanya sering ditemukan di situs Fint Awesome 6, maka kamu bisa mengunduh file tersebut dengan klik link yang tertera di bawah ini…
File TTF dari Font Awesome 6 ini ada 2 versi yakni Free dan Pro. Nah, untuk link yang diatas merupakan kumpulan file TTF tersebut yang versi free sehingga bisa dipakai oleh siapapun tetapi jumlah font icon itu lebih sedikit daripada Pro.
Setelah kamu mendapatkan file font tersebut, kamu bisa menambahkan file tersebut ke dalam Media Assets pada App Inventor 2 itu sendiri dalam mempercantik tampilan aplikasi Android buatan kamu.
Penulis memberikan tutorial untuk menggunakan Font Awesome sebagai ikon ke salah satu komponen UI yaitu Label pada App Inventor 2. Akan tetapi menggunakan kode khusus yang akan dimasukkan ke dalam kolom teks pada komponen UI yang diinginkan dengan mengaktifkan HTMLFormat di bagian Label tersebut.
1. CARA MENDAPATKAN UNICODE DARI FONT AWESOME 6
Poin ini memberikan tutorial dalam mendapatkan atau menggunakan kode unik dari Font Awesome yang akan digunakan sebagai ikon untuk komponen UI.
1. Kunjungi situs ikon dari Font Awesome dengan klik link disini.
2. Carilah nama ikon dalam bahasa inggris untuk mendapatkan gambar ikon dengan sesuai keinginan.
3. Klik gambar ikon yang telah kamu didapatkan.
4. Klik kode unik yang ditunjuk tanda panah merah yang tertera.
5. Kamu bisa memasukkan kode unik yang diatas ke dalam kode yang telah dibuatkan di bawah ini.
Gantikan kode unik untuk ikon dari Font Awesome yang bertulisan warna merah dengan kode unik gambar ikon dengan sesuai kebutuhan.
2. MEMBUAT PROJECT APLIKASI
Poin ini memberikan tutorial untuk membuat project aplikasi sederhana untuk memberikan gambar ikon yang bersumber dari Font Awesome kepada beberapa komponen UI dengan sesuai kebutuhan.
1. Kunjungi situs MIT App Inventor.
2. Klik Create App.
3. Lakukan login seperti biasanya dengan Google.
3. Buatlah project aplikasi baru dengan klik New Project.
4. Masukkan nama project aplikasi tanpa spasi yaitu “font_awesome_icon” beserta Aturlah tampilan UI aplikasinya, klik OK.
5. Aturlah tampilan tata letak menjadi rata tengah (center) semua.
6. Klik Upload File.
7. Klik Browse untuk memasukkan file font tadi.
8. Setelah dipilih file font Awesome tadi, maka bisa klik OK / Open.
9. Klik OK.
10. Tambahkan 1 komponen yakni Label ke dalam Screen aplikasi.
11. Aturlah ukuran teks pada Label di dalam kolom FontSize menjadi ukuran 50 pt.
12. Ubahlah Typeface Font untuk Label menjadi nama file font Awesome yang berakhiran .ttf dan centangkan fitur HTMLFormat langsung.
13. Masukkan kode unik yang telah kamu pilih tadi ke dalam kolom teks pada komponen Label, tekan Enter.
14. Berikut hasilnya.
Selesai.
CATATAN
Ada beberapa kode simbol untuk ikon yang diambil dari kata kunci itu tidak muncul sama sekali alias karena file font Awesome 6 yang ada tutorial ini yang disebabkan tidak menggunakan file Font Awesome 6 yang versi Pro. Sedangkan, font icon ini semakin banyak saja yang dimana bisa dipakai dengan integrasikan ke HTML secara online yang biasanya bisa menggunakan Web View dalam App Inventor 2.
PENUTUP
Kini, kamu bisa menambahkan ikon untuk khusus Label dengan mengaktifkan fitur HTMLFormat ke dalam aplikasi Android buatan kamu dengan sesuai kebutuhan dan fungsi dari aplikasi di dalam App Inventor 2. Meskipun, ada beberapa font icon yang tidak tersedia di beberapa icon terbaru yang bisa dilihat dari Font Awesome tadi. Setidaknya, kamu bisa menambahkan ikon untuk mempercantik tampilan UI aplikasi Android yang terutama Label dari kamu buat aplikasi Android menggunakan App Inventor 2.
