View binding Bagian dari Android Jetpack.

View binding adalah fitur yang memudahkan penulisan kode yang berinteraksi dengan tampilan. Setelah diaktifkan dalam modul, view binding akan menghasilkan class binding untuk setiap file tata letak XML yang ada dalam modul tersebut. Instance class binding berisi referensi langsung ke semua tampilan yang memiliki ID dalam tata letak yang sesuai.

Pada umumnya, view binding menggantikan findViewById.

Penyiapan

View binding diaktifkan per modul. Untuk mengaktifkan view binding dalam modul, tetapkan opsi build viewBinding ke true dalam file build.gradle level modul, seperti ditunjukkan dalam contoh berikut:

Groovy

android {
    ...
    buildFeatures {
        viewBinding true
    }
}

Kotlin

android {
    ...
    buildFeatures {
        viewBinding = true
    }
}

Jika Anda ingin mengabaikan file tata letak saat membuat class binding, tambahkan atribut tools:viewBindingIgnore="true" ke tampilan root file tata letak tersebut:

<LinearLayout
        ...
        tools:viewBindingIgnore="true" >
    ...
</LinearLayout>

Penggunaan

Jika view binding diaktifkan untuk sebuah modul, sebuah class binding akan dihasilkan untuk setiap file tata letak XML yang ada dalam modul. Setiap class binding berisi referensi ke tampilan root dan semua tampilan yang memiliki ID. Nama class binding dibuat dengan mengonversi nama file XML menjadi Pascal case dan menambahkan kata "Binding" ke bagian akhirnya.

Misalnya, pertimbangkan file tata letak bernama result_profile.xml yang berisi hal berikut:

<LinearLayout ... >
    <TextView android:id="@+id/name" />
    <ImageView android:cropToPadding="true" />
    <Button android:id="@+id/button"
        android:background="@drawable/rounded_button" />
</LinearLayout>

Class binding yang dihasilkan disebut ResultProfileBinding. Class ini memiliki dua kolom: TextView yang disebut name dan Button yang disebut button. ImageView di tata letak tidak memiliki ID, sehingga tidak ada referensi ke tata letak tersebut dalam class binding.

Setiap class binding juga mencakup metode getRoot(), yang menyediakan referensi langsung untuk tampilan root file tata letak yang terkait. Dalam contoh ini, metode getRoot() di class ResultProfileBinding menampilkan tampilan root LinearLayout.

Bagian berikut menunjukkan penggunaan class binding yang dihasilkan dalam aktivitas dan fragmen.

Menggunakan view binding dalam aktivitas

Untuk menyiapkan instance class binding agar dapat digunakan dengan aktivitas, lakukan langkah-langkah berikut dalam metode onCreate() aktivitas:

  1. Panggil metode inflate() statis yang disertakan dalam class binding yang dihasilkan. Tindakan ini membuat instance dari class binding yang akan digunakan aktivitas.
  2. Dapatkan referensi ke tampilan root dengan memanggil metode getRoot() atau menggunakan sintaksis properti Kotlin.
  3. Teruskan tampilan root ke setContentView() untuk menjadikannya tampilan aktif di layar.

Langkah-langkah ini ditampilkan dalam contoh berikut.

Kotlin

private lateinit var binding: ResultProfileBinding

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    binding = ResultProfileBinding.inflate(layoutInflater)
    val view = binding.root
    setContentView(view)
}

Java

private ResultProfileBinding binding;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    binding = ResultProfileBinding.inflate(getLayoutInflater());
    View view = binding.getRoot();
    setContentView(view);
}

Sekarang, Anda dapat menggunakan instance class binding untuk merujuk ke tampilan mana pun:

Kotlin

binding.name.text = viewModel.name
binding.button.setOnClickListener { viewModel.userClicked() }

Java

binding.name.setText(viewModel.getName());
binding.button.setOnClickListener(new View.OnClickListener() {
    viewModel.userClicked()
});

Menggunakan view binding di fragmen

Untuk menyiapkan instance class binding agar dapat digunakan dengan fragmen, lakukan langkah-langkah berikut dalam metode onCreateView() fragmen:

  1. Panggil metode inflate() statis yang disertakan dalam class binding yang dihasilkan. Tindakan ini membuat instance class binding yang akan digunakan fragmen.
  2. Dapatkan referensi ke tampilan root dengan memanggil metode getRoot() atau menggunakan sintaksis properti Kotlin.
  3. Tampilkan tampilan root dari metode onCreateView() untuk menjadikannya tampilan aktif di layar.

Kotlin

private var _binding: ResultProfileBinding? = null
// This property is only valid between onCreateView and
// onDestroyView.
private val binding get() = _binding!!

override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?
): View? {
    _binding = ResultProfileBinding.inflate(inflater, container, false)
    val view = binding.root
    return view
}

override fun onDestroyView() {
    super.onDestroyView()
    _binding = null
}

Java

private ResultProfileBinding binding;

@Override
public View onCreateView (LayoutInflater inflater,
                          ViewGroup container,
                          Bundle savedInstanceState) {
    binding = ResultProfileBinding.inflate(inflater, container, false);
    View view = binding.getRoot();
    return view;
}

@Override
public void onDestroyView() {
    super.onDestroyView();
    binding = null;
}

Sekarang, Anda dapat menggunakan instance class binding untuk merujuk ke tampilan mana pun:

Kotlin

binding.name.text = viewModel.name
binding.button.setOnClickListener { viewModel.userClicked() }

Java

binding.name.setText(viewModel.getName());
binding.button.setOnClickListener(new View.OnClickListener() {
    viewModel.userClicked()
});

Memberikan petunjuk untuk konfigurasi yang berbeda

Saat mendeklarasikan tampilan di beberapa konfigurasi, terkadang sebaiknya menggunakan jenis tampilan yang berbeda, bergantung pada tata letak tertentu. Cuplikan kode berikut menunjukkan contohnya:

# in res/layout/example.xml

<TextView android:id="@+id/user_bio" />

# in res/layout-land/example.xml

<EditText android:id="@+id/user_bio" />

Dalam hal ini, Anda mungkin mengharapkan class yang dihasilkan akan menampilkan kolom userBio dengan jenis TextView, karena TextView adalah class dasar yang umum. Karena batasan teknis, generator kode view binding tidak dapat menentukannya dan menghasilkan kolom View sebagai gantinya. Tindakan ini memerlukan transmisi kolom nanti dengan binding.userBio as TextView.

Untuk mengatasi batasan ini, view binding mendukung atribut tools:viewBindingType, sehingga Anda dapat memberi tahu compiler jenis yang akan digunakan dalam kode yang dihasilkan. Pada contoh sebelumnya, Anda dapat menggunakan atribut ini untuk membuat compiler menghasilkan kolom sebagai TextView:

# in res/layout/example.xml (unchanged)

<TextView android:id="@+id/user_bio" />

# in res/layout-land/example.xml

<EditText android:id="@+id/user_bio" tools:viewBindingType="TextView" />

Dalam contoh lain, misalkan Anda memiliki dua tata letak, satu berisi BottomNavigationView dan satu lagi berisi NavigationRailView. Kedua class memperluas NavigationBarView, yang berisi sebagian besar detail implementasi. Jika kode tidak perlu mengetahui secara persis subclass mana yang ada di tata letak saat ini, Anda dapat menggunakan tools:viewBindingType untuk menyetel jenis yang dihasilkan ke NavigationBarView di kedua tata letak:

# in res/layout/navigation_example.xml

<BottomNavigationView android:id="@+id/navigation" tools:viewBindingType="NavigationBarView" />

# in res/layout-w720/navigation_example.xml

<NavigationRailView android:id="@+id/navigation" tools:viewBindingType="NavigationBarView" />

View binding tidak dapat memvalidasi nilai atribut ini saat membuat kode. Untuk menghindari error waktu kompilasi dan runtime, nilai harus memenuhi kondisi berikut:

  • Nilai harus berupa class yang diwarisi dari android.view.View.
  • Nilai harus berupa superclass tag tempat nilai tersebut ditempatkan. Misalnya, nilai berikut tidak berfungsi:

      <TextView tools:viewBindingType="ImageView" /> <!-- ImageView is not related to TextView. -->
      <TextView tools:viewBindingType="Button" /> <!-- Button is not a superclass of TextView. -->
    
  • Jenis final harus di-resolve secara konsisten di semua konfigurasi.

Perbedaannya dengan findViewById

View binding memiliki keunggulan penting dibandingkan findViewById:

  • Keamanan null: karena view binding membuat referensi langsung ke tampilan, tidak ada risiko pengecualian pointer null karena ID tampilan tidak valid. Selain itu, jika tampilan hanya ada dalam beberapa konfigurasi tata letak, kolom yang berisi referensinya di class binding akan ditandai dengan @Nullable.
  • Keamanan jenis: kolom di setiap class binding memiliki jenis yang cocok dengan tampilan yang direferensikan dalam file XML. Artinya, tidak ada risiko pengecualian cast class.

Perbedaan ini berarti inkompatibilitas antara tata letak dan kode akan menyebabkan build gagal pada waktu kompilasi, bukan pada runtime.

Perbandingannya dengan data binding

Baik view binding maupun data binding menghasilkan class binding yang dapat Anda gunakan untuk mereferensikan tampilan secara langsung. Namun, view binding dimaksudkan untuk menangani kasus penggunaan yang lebih sederhana dan memberikan manfaat berikut dibandingkan data binding:

  • Kompilasi yang lebih cepat: view binding tidak memerlukan pemrosesan anotasi, sehingga waktu kompilasi lebih cepat.
  • Kemudahan penggunaan: view binding tidak memerlukan file tata letak XML yang diberi tag khusus, sehingga lebih cepat untuk diadopsi di aplikasi Anda. Setelah Anda mengaktifkan view binding dalam modul, view binding akan diterapkan ke semua tata letak modul tersebut secara otomatis.

Di sisi lain, view binding memiliki batasan berikut dibandingkan dengan data binding:

Karena pertimbangan ini, dalam beberapa kasus, sebaiknya gunakan view binding dan data binding dalam sebuah project. Anda dapat menggunakan data binding dalam tata letak yang memerlukan fitur lanjutan dan menggunakan view binding dalam tata letak yang tidak memerlukan fitur lanjutan.

Referensi lainnya

Untuk mempelajari view binding lebih lanjut, lihat referensi tambahan berikut:

Contoh

Blog

Video