Apa itu Android View Binding dan bagaimana cara menyederhanakan delegasinya?

View Binding adalah bagian dari Android Jetpack. View Binding dikenalkan saat Android Talk di Google IO/19. Ayo kita pelajari lebih dalam.

Apa itu View Binding?

Jika dilihat dari halaman dokumentasi android, View Binding adalah:

View binding is a feature that allows you to more easily write code that interacts with views. Once view binding is enabled in a module, it generates a binding class for each XML layout file present in that module. An instance of a binding class contains direct references to all views that have an ID in the corresponding layout.

Dengan kata lain, View Binding menggantikan peran findViewById.

Kenapa Kita Butuh View Binding?

Saat memakai findViewById, kita harus mendeklarasikan variable view sebanyak kita membutuhkannya. Hal itu menjadikan kodingan yang boilerplate di dalam Activity/Fragment. Itulah kenapa View Binding hadir dengan memudahkan para developer untuk mengakses view dengan cara yang lebih bagus. Kita lihat perbandingannya:

Jika kita menggunakan findViewById :

class MainActivity: AppCompatActivity() {

  val logoutButton = findViewById<Button>(R.id.btn_logout)
  val overview = findViewById<TextView>(R.id.overview)

  overview?.text = userProfile?.overview
  logoutButton?.setOnClickListener {
      toast("Logout Clicked")
  }
}

Dan, ini kodingan jika kita menggunakan View Binding:

class MainActivity: AppCompatActivity() {

  val binding = ActivityMainBinding.inflate(layoutInflater)

  binding.overview.text = userProfile?.overview
  binding.btnLogout.setOnClickListener {
      toast("Logout Clicked")
  }
}

Ketemu perbedaannya?

Jadi kita cukup mendeklarasikan variable binding dari generated view binding (dalam contoh: ActivityMainBinding) class. Dan setelah itu, kalian bisa mengakses seluruh id view yang ada didalam View Binding tersebut.

Keuntungan lain jika kita menggunakan View Binding adalah:

Type Safety: View Binding men-generate method yang sama persis tipenya dengan apa yang telah kita buat didalam XML Layout. Sehingga, tidak perlu lagi typecasting.

Null Safety: findViewById sebenarnya tidak null-safety. Jika kalian menggunakan Kotlin, akan lebih mudah karena tidak perlu memperhatikan nullable variable karena sudah di provide oleh null-safety nya Kotlin. Akan tetapi, untuk developer android yang menggunakan Java, hal ini bisa membuat mereka menghantamkan keyboard mereka ke monitornya :D

Bagaimana cara menggunakan View Binding?

  1. Langkah pertama, aktifkan fitur view binding pada app/build.gradle kalian:
   android {
      ....
      buildFeatures {
         viewBinding true
      }
   }
  1. Setelah itu, kalian tinggal buat layout XML-nya. Sebagai contoh, kita buat layout XML baru dengan nama activity_sample.xml .
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center">

    <TextView
        android:id="@+id/tvTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name"
        android:layout_marginBottom="16dp"/>

    <Button
        android:id="@+id/btnSample"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name"
        android:textStyle="bold"/>

        ....
</LinearLayout>
  1. Selanjutnya, system akan men-generate secara otomatis layout XML tersebut berupa binding class dan kita bisa mengakses langsung binding class tersebut menggunakan ActivitySampleBinding. Jadi, semua generated binding class akan ditambahkan nama Binding dibelakangnya. Sebagai catatan, jika kalian tidak ingin layout XML nya di auto generate sebagai binding class, kalian bisa mengecualikannya menggunakan tools:viewBindingIgnore="true" pada root layout XML anda. Sebagai contoh:
   <LinearLayout
   ...
   tools:viewBindingIgnore="true" >
   ...
   </LinearLayout>
  1. Kemudian, implement generated layout XML ActivitySampleBinding kita kedalam Activity menggunakan layout inflater.
class MainActivity: AppCompatActivity() {

  private lateinit var binding: ActivitySampleBinding

  override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      binding = ActivitySampleBinding.inflate(LayoutInflater.from(this))
      setContentView(binding.root)
  }

}
  1. Jika menggunakan Fragment, kalian pasang binding inflater didalan method onCreateView kemudian kembalikan nilai dari binding.root-nya. Lihat implementasi lengkapnya disini.
  2. Untuk mengakses view, kita cukup melakukan hal ini:
   binding.tvTitle.text = getString(R.string.sample_title)
   binding.btnSample.setOnClickListener {
   showMessage("Sample Button Clicked")
   }

NB: Jika kalian membuat nama view id nya menggunakan underscore, otomatis akan di generate menjadi variable camelCase.

  1. Yep, kalian sudah selesai men-setting view kalian menggunakan View Binding.

Sekarang, pertanyaan selanjutnya. Bagaimana kita membuat binding delegation kita menjadi satu baris kodingan saja?

Kotlin adalah bahasa pemrograman yang sangat luar biasa, untuk membuat binding delegation kita menjadi satu baris kodingan, kita bisa menggunakan Kotlin Property Delegates. Lihat penjelasan lengkapnya disini.

Saya telah membuat sebuah library yang bisa memudahkan kalian untuk mendelegasikan View Binding hanya dengan satu baris kodingan saja. Library ini dibangun menggunakan Kotlin Property Delegates dan dikombinasikan dengan Kotlin Extension Functions. Sehingga, tidak perlu lagi inflate method untuk View Binding kalian. Kalian bisa lihat library-nya disini:

yogacp/android-viewbinding

Bagaimana cara penggunaan library-nya?

Menambahkan dependencies:

  1. Tambahkan kodingan ini didalam build.gradle kalian.
   allprojects {
      repositories {
         ...
         maven { url 'https://jitpack.io' }
      }
   }
  1. Aktifkan fitur View Binding didalam app/build.gradle kalian.
   android {
      ....
      buildFeatures {
         viewBinding true
      }
   }
  1. Selanjutnya, tambahkan dependensi library didalam app/build.gradle kalian.
   dependencies {
      ....
      implementation 'com.github.yogacp:android-viewbinding:x.x.x'
   }

Cara menggunakan library:

  1. Kita masih menggunakan contoh layout XML diatas, yaitu activity_sample.xml .
  2. Didalam MainActivity, kalian cukup gunakan by viewBinding() diakhir variable generated Binding Class. Seperti dibawah ini:
class MainActivity : AppCompatActivity() {

    private val binding: ActivitySampleBinding by viewBinding()

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

        binding.tvTitle.text = getString(R.string.sample_title)

        binding.btnSample.setOnClickListener {
            showMessage("Sample Button Clicked")
        }
        ....
    }
}
  1. Jika menggunakan Fragment, sebagai contoh, kalian membuat layout XML dengan nama fragment_sample.xml. Begini cara penggunaan library-nya:
class MainFragment : Fragment(R.layout.fragment_sample) {

    private val binding: FragmentSampleBinding by viewBinding()

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        binding.tvFragmentTitle.text = getString(R.string.sample_fragment_title)

        binding.btnFragmentSample.setOnClickListener {
            showMessage("Sample Fragment Button Clicked")
        }

        ....
    }
}
  1. Yep, kalian sudah selesai setting View Binding yang di delegasikan hanya menggunakan satu baris kode saja.

Kesimpulan

View Binding memberikan kalian keuntungan null-safety dan type-safety saat menggunakan view. Sehingga kita tidak perlu lagi typecasting kapanpun kita membutuhkan view tersebut didalam Activity/Fragment kita.

Library Android ViewBinding ini memberikan kalian behavior yang sama persis dengan yang ada di dokumentasi View Binding Android. Tetapi dengan pen-delegasian yang lebih mudah. Oh ya, library ini juga masih dalam tahap pengembangan. Masih banyak Todo list yang belum diselesaikan dan juga masih ada beberapa issue yang telah dibuat. Versi saat ini adalah 1.0.2, saya akan selesaikan beberapa fitur lain kedepannya. Doakan saja :)

Baca juga jurnal teknologi lain dari kami di medium eFishery atau di eFishery Engineering Blog

Stay Healthy and Happy Coding Everyone :)

Referensi:

View Binding | Android Developers android/architecture-components-samples New In Android: ViewBindings. The Difference From DataBinding Library. Simple one-liner ViewBinding in Fragments and Activities with Kotlin