Font Dalam XML

Android 8.0 (API level 26) memperkenalkan fitur baru, yaitu Font dalam XML, yang memungkinkan Anda menggunakan font sebagai resource. Anda dapat menambahkan file font dalam folder res/font/ untuk memaketkan font sebagai resource. Font tersebut akan disusun dalam file R Anda dan otomatis tersedia di Android Studio. Anda dapat mengakses resource font dengan bantuan jenis resource baru, yaitu font. Misalnya, untuk mengakses resource font, gunakan @font/myfont atau R.font.myfont.

Untuk menggunakan fitur Font dalam XML pada perangkat yang menjalankan Android 4.1 (API level 16) dan yang lebih tinggi, gunakan Support Library 26. Untuk informasi selengkapnya tentang menggunakan support library, lihat bagian Menggunakan support library.

Untuk menambahkan font sebagai resource, lakukan langkah-langkah berikut di Android Studio:

  1. Klik kanan folder res dan buka New > Android resource directory.

    Jendela New Resource Directory akan muncul.

  2. Dalam daftar Resource type, pilih font, lalu klik OK.

    Catatan: Nama direktori resource harus berupa font.

    Menambahkan direktori resource font

    Gambar 1. Menambahkan direktori resource font

  3. Tambahkan file font di folder font.

    Struktur folder di bawah ini menghasilkan R.font.dancing_script, R.font.lobster, dan R.font.typo_graphica.

    Menambahkan file font di direktori resource

    Gambar 2. Menambahkan file font di direktori resource

  4. Klik dua kali file font untuk melihat pratinjau font file di editor. Melihat pratinjau file font

    Gambar 3. Melihat pratinjau file font

Membuat jenis font

Jenis font adalah sekumpulan file font beserta detail gaya dan bobotnya. Di Android, Anda dapat membuat jenis font baru sebagai resource XML dan mengaksesnya sebagai satu unit, alih-alih mereferensikan setiap gaya dan bobot sebagai resource terpisah. Dengan melakukan hal ini, sistem dapat memilih font yang benar berdasarkan gaya teks yang ingin Anda gunakan.

Untuk membuat jenis font, lakukan langkah-langkah berikut di Android Studio:

  1. Klik kanan pada folder font dan buka New > Font resource file. Jendela New Resource File akan muncul.
  2. Masukkan nama file, lalu klik OK. XML resource font baru akan terbuka di editor.
  3. Sertakan setiap atribut font, gaya, dan bobot file di elemen <font>. XML berikut mengilustrasikan penambahan atribut terkait font dalam XML resource font: 
    <?xml version="1.0" encoding="utf-8"?>
<font-family xmlns:android="http://schemas.android.com/apk/res/android">
    <font
        android:fontStyle="normal"
        android:fontWeight="400"
        android:font="@font/lobster_regular" />
    <font
        android:fontStyle="italic"
        android:fontWeight="400"
        android:font="@font/lobster_italic" />
</font-family>

Menggunakan font dalam tata letak XML

Gunakan font Anda, baik file font tunggal atau font dari jenis font, dalam objek TextView atau dalam gaya. Untuk menambahkan font ke TextView atau dalam gaya, gunakan atribut fontFamily.

Catatan: Saat menggunakan jenis font, TextView beralih dengan sendirinya, sesuai kebutuhan, untuk menggunakan file font dari jenis tersebut.

Menambahkan font ke TextView

Untuk menetapkan font untuk TextView, lakukan salah satu hal berikut:

  • Dalam file XML tata letak, tetapkan atribut fontFamily ke file font yang ingin Anda akses. 
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fontFamily="@font/lobster"/>
  • Buka jendela Properties untuk menetapkan font bagi TextView.
    1. Pilih tampilan untuk membuka jendela Properties.

      Catatan: Jendela Properties hanya tersedia saat editor desain terbuka. Pilih tab Design di bagian bawah jendela.

    2. Perluas properti textAppearance, lalu pilih font dari daftar fontFamily.
    3. Memilih font dari Properti

      Gambar 4. Memilih font dari jendela Properties

Pratinjau tata letak Android Studio, ditunjukkan di panel paling kanan dari Gambar 5, memungkinkan Anda melihat pratinjau yang ditetapkan dalam TextView.

Melihat pratinjau font dalam pratinjau tata letak

Gambar 5. Melihat pratinjau font dalam pratinjau tata letak

Menambahkan font ke gaya

Buka styles.xml, dan tetapkan atribut fontFamily ke file font yang ingin Anda akses.

  • <style name="customfontstyle" parent="@android:style/TextAppearance.Small">
    <item name="android:fontFamily">@font/lobster</item>
</style>

    • Menggunakan font secara terprogram

    Untuk mengambil font secara terprogram, panggil metode getFont(int) dan sediakan ID resource dari font yang ingin Anda ambil. Metode ini menampilkan objek Typeface. Meskipun sistem memilih gaya terbaik untuk Anda dari informasi font, Anda dapat menggunakan metode setTypeface(android.graphics.Typeface, int) untuk menetapkan jenis font dengan gaya tertentu.

    Catatan: TextView sudah melakukan tindakan ini untuk Anda.

    Kotlin

    val typeface = resources.getFont(R.font.myfont)
textView.typeface = typeface

    Java

    Typeface typeface = getResources().getFont(R.font.myfont);
textView.setTypeface(typeface);

    Menggunakan support library

    Support Library 26.0 memberikan dukungan untuk fitur Font dalam XML pada perangkat yang menjalankan Android 4.1 (API level 16) dan yang lebih tinggi.

    Catatan: Saat Anda mendeklarasikan jenis font dalam tata letak XML melalui support library, gunakan namespace aplikasi untuk memastikan font Anda dimuat. 

    <?xml version="1.0" encoding="utf-8"?>
<font-family xmlns:app="http://schemas.android.com/apk/res-auto">
    <font app:fontStyle="normal" app:fontWeight="400" app:font="@font/myfont-Regular"/>
    <font app:fontStyle="italic" app:fontWeight="400" app:font="@font/myfont-Italic" />
</font-family>

    Untuk mengambil font secara terprogram, panggil metode ResourceCompat.getFont(Context, int) dan berikan instance Context dan ID resource.

    Kotlin

    val typeface = ResourcesCompat.getFont(context, R.font.myfont)

    Java

    Typeface typeface = ResourcesCompat.getFont(context, R.font.myfont);