Menggunakan View Binding di Aplikasi Android

View Binding adalah fitur yang dapat kita gunakan untuk memudahkan menulis kode yang berinteraksi dengan view. Biasanya View Binding digunakan untuk menggantikan findViewById. Saat kita mengaktifkan View Binding di aplikasi, maka Android Studio akan mengenerate binding class yang berisi referensi id dari view.

Kita akan mencoba membuat project sederhana dengan menggunakan View Binding. Buka Android Studio dan buat project baru → pilih Empty Activity dan masukkan konfigurasi seperti berikut :

• Name : LearnViewBinding
• Package Name : com.teknorial.learnviewbinding
• Language : Kotlin
• Minimum SDK : API 21: Android 5.0 (Lollipop)

Kemudian klik Finish.

Setelah project berhasil di-build. Kita perlu mengaktifkan View Binding ke dalam project terlebih dahulu. Buka build.gradle (Module: LearnViewBinding.app) dan tambahkan viewBinding ke dalam tag android.

viewBinding {
  enabled = true
}

Tekan tulisan Sync Now dan tunggu sampai proses build selesai.

Sekarang kita akan mengedit layout dari MainActivity dan mencoba berinteraksi dengan View Binding. Buka layout activity_main.xml dan modifikasi seperti kode berikut.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/tvNumber"
        style="@style/TextAppearance.AppCompat.Display1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />


    <Button
        android:id="@+id/btnPlusOne"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="+1"
        app:layout_constraintEnd_toEndOf="@+id/tvNumber"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintStart_toStartOf="@+id/tvNumber"
        app:layout_constraintTop_toBottomOf="@+id/tvNumber" />

</androidx.constraintlayout.widget.ConstraintLayout>

Sekarang kita mencoba mengunakan View Binding untuk berinteraksi dengan View yang telah kita buat. Buka MainActivity dan modifikasi seperti kode di bawah.

package com.teknorial.learnviewbinding

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.teknorial.learnviewbinding.databinding.ActivityMainBinding

//deklarasi variable binding
private lateinit var binding: ActivityMainBinding

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        //inisialisasi binding
        binding = ActivityMainBinding.inflate(layoutInflater)

        //memanggil layout dengan menggunakan binding.root
        setContentView(binding.root)

    }
}

Pada kode diatas, kita telah mendeklarasikan variabel binding dengan class yang otomatis di-generated yaitu ActivityMainBinding.  Penamaan class binding mengikuti nama layout dan diakhiri dengan Binding seperti activity_main.xml menjadi ActivityMainBinding dan jika layout fragment maka fragment_list.xml menjadi FragmentListBinding. Pada setContentView kita dapat langsung menggunakan binding.root tanpa perlu memasukkan alamat layout seperti R.layout.activity_main.

Sekarang kita akan membuat click listener dengan menggunakan View Binding. Modifikasi kode MainActivity seperti pada kode di bawah.

package com.teknorial.learnviewbinding

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.teknorial.learnviewbinding.databinding.ActivityMainBinding

//deklarasi variable binding
private lateinit var binding: ActivityMainBinding

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        //inisialisasi binding
        binding = ActivityMainBinding.inflate(layoutInflater)

        //memanggil layout dengan menggunakan binding.root
        setContentView(binding.root)

        var number = 0
        //membuat click listener pada button
        binding.btnPlusOne.setOnClickListener {
            number += 1
            //mengubah value textView
            binding.tvNumber.text = number.toString()
        }

    }
}

Pada kode di atas dapat kita lihat bahwa dengan menggunakan View Binding, kita dapat langsung berinteraksi dengan View seperti Button dan TextView dengan menggunakan id mereka. Jadi tanpa menggunakan View Binding kita perlu terlebih dahulu menginisialisasi View dengan findViewById.

Jalankan Aplikasi (Shift + F10). Pada aplikasi coba tekan Button +1 dan nilai dari TextView akan berubah sesuai jumlah klik dari Button tersebut. Jika tidak error, aplikasi kamu akan seperti pada screenshot di bawah.

Jika kamu penasaran apa sebenarnya yang terjadi dibelakang dari binding class yaitu ActivityMainBinding. Untuk melihat yang di-generated kita perlu mengubah Android menjadi Project pada bagian struktur folder seperti nomor satu pada gambar di bawah. Buka file pada direktori app/build/generated/data_binding_base_class_source_out/debug/out/com/teknorial/learnviewbinding/databinding/ActivityMainBinding.java.

Kita dapat melihat isi dari ActivityMainBinding terdapat variabel yang otomatis di-generated sesuai dengan activity_main.xml  dari class ConstraintLayout, Button, dan TextView.

Demikian tutorial Menggunakan View Binding di Aplikasi Android. Kita telah berhasil menggunakan View Binding dan melakukan interaksi View dengan mudah tanpa perlu melakukan inisialisasi menggunakan findViewById(). Semoga tutorial ini bermanfaat, jika ada pertanyaan mengenai postingan ini, dapat tanyakan di kotak komentar. Terimakasih

Source Code : https://github.com/rflash95/LearnViewBinding

Tag

• Android