はじめに
View Bindingのセットアップ方法と使い方を紹介します。
「View Binding」とは？
ビューを操作するコードをかんたんに記述できる機能です。
XMLレイアウトファイルごとにバインディングクラスが自動生成され、対象レイアウト内でIDを持つすべてのビューの参照を持ちます。
findViewByIdとの違い
View Bindingは findViewById の上位互換といえます。
Null安全
View Bindingはビューを参照するコードを自動生成するため、無効なビューIDを指定することによるNullPointerExceptionが発生しません。
型安全
バインディングクラス内のフィールドは、レイアウトファイルと同じ型を持つため、ClassCastExceptionが発生しません。
環境
- OS：macOS Big Sur 11.5.2
- Android Studio：Arctic Fox | 2020.3.1 Patch 1
- Kotlin：1.5.21
- Gradle：7.0.2
- Gradle plugin：7.0.1
セットアップ
View Bindingの有効化
appフォルダ配下の「build.gradle」でView Bindingを有効化します。
android {
+ viewBinding {
+ enabled true
+ }
}
これでView Bindingのセットアップは完了です。
使い方
フラグメントでView Bindingする
以下のレイアウトファイルのフラグメントがあるとします。
<?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"
android:orientation="vertical"
tools:context=".ui.monsterdetail.MonsterDetailFragment">
<ImageView
android:id="@+id/icon_imageview"
android:layout_width="240dp"
android:layout_height="240dp"
android:layout_marginTop="56dp"
android:contentDescription="@string/icon_description"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0"
app:layout_constraintVertical_chainStyle="packed"
tools:src="@tools:sample/avatars" />
</androidx.constraintlayout.widget.ConstraintLayout>
MonsterDetailFragmentBinding クラスが自動生成されるので、プロパティに追加します。
_binding はバインディングクラスの初期化と解放のみに使い、他では binding を使います。
class MonsterDetailFragment : Fragment() {
+ private var _binding: MonsterDetailFragmentBinding? = null
+ private val binding get() = _binding!!
}
バインディングクラスの初期化と解放を追加します。
class MonsterDetailFragment : Fragment() {
private var _binding: MonsterDetailFragmentBinding? = null
private val binding get() = _binding!!
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
- return inflater.inflate(R.layout.monster_detail_fragment, container, false)
+ _binding = MonsterDetailFragmentBinding.inflate(inflater, container, false)
+ return binding.root
}
}
override fun onDestroyView() {
super.onDestroyView()
+ _binding = null
}
}
これでビューがバインディングされました。
binding.{ビュー名} でアクセスできます。
class MonsterDetailFragment : Fragment() {
private var _binding: MonsterDetailFragmentBinding? = null
private val binding get() = _binding!!
private val monster: MonsterItem = ○○
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
- val iconImageView: ImageView = view.findViewById(R.id.icon_imageview)
- iconImageView.load(monster.iconUrlString)
+ binding.iconImageview.load(monster.iconUrlString)
}
}
Data Bindingとの違い
Data Bindingの詳細は以下の記事をご参照ください。
Data Bindingは便利ですが、View Bindingはよりシンプルであり、それによるメリットとデメリットがあります。
メリット
コンパイルが高速
View Bindingはアノテーションによるコードの自動生成を行わないため、コンパイルが速いです。
セットアップがかんたん
Data Bindingと異なり、XMLレイアウトファイルを編集せず、自動的に対象モジュールの全レイアウトに適用されます。
そのため、セットアップがかんたんです。
デメリット
レイアウトファイルでバインディングできない
Data Bindingはレイアウトファイルでバインディングできますが、View Bindingではできません。
双方向バインディングできない
Data Bindingと異なり、View Bindingでは双方向バインディングできません。
おわりに
これでNull安全かつ型安全にビューを操作できます！
できる限り findViewById を減らしていきましょう 
ちなみに本記事の内容は、すべてData Bindingでも実現できます。
Data Bindingでコンパイル時間が気になったことがなく、私はData Bindingのみ使っています。
View Bindingのみ使っている、もしくは併用している人がいたら理由をコメントなどで教えていただけると嬉しいです。