AndroidでViewBindingを実装する方法

ViewBinding

ViewBindingとは：

• Androidでプロジェクトを作成する際、xmlファイルとkotlin/Javaファイルのソースが別々なため、kotlinファイル内でxmlファイル内の要素を指定したい場合、findViewById()を使っています。しかし、プロジェクトが大きくなったり、要素が増えるといちいちfindViewById()と記載するのは面倒です。

  → そこでViewBindingです！

  ViewBindingを実装するとfindViewById()を記載することなくxmlファイル内の要素を指定できます。

ViewBindingと似たDataBindingとは何か？

• ViewBindingの上位互換。ただし、エネルギー消費的にViewBindingで済む箇所はできる限りViewBindingを使用していきましょう。

ViewBindingの実装

build.gradle(Module:app)内の記述

• build.gradle(Module:app)を開き、android{}配下に以下の記入しましょう。

  buildFeatures {
      viewBinding = true
  }
  

  • 記載をしたらSyncする必要があります。

• Syncを終えたら、Build＞Rebuild ProjectよりGradleを再度ビルドしましょう。

  • findViewById()を記載する代わりにBindingオブジェクトを使います。Rebuild Projectすることにより、ViewBindingがそれぞれのレイアウトに対し、Bindingオブジェクトを作成します。
    • 例：activity_main.xmlはBindingオブジェクトとしてActivityMainBindingを作成します。

  Bindingオブジェクトを作成しないxmlファイルがある場合

  • Bindingオブジェクトを作成しないxmlファイルがある場合はxmlファイルの最上要素のConstraintLayout等に以下を追加します。

    tools:viewBindingIgnore="true"
    

MainActivity.kt内にBindingクラスをインポート

• もともとの記載のsetContentView(R.layout.activity_main)を消し、bindingオブジェクトを使用する記述を追加します。

  class MainActivity : AppCompatActivity() {
  	private lateinit var binding: ActivityMainBinding
      override fun onCreate(savedInstanceState: Bundle?) {
          super.onCreate(savedInstanceState)
          //setContentView(R.layout.activity_main)
          
          binding = ActivityMainBinding.inflate(layoutInflater)
          val view = binding.root
          setContentView(view)
      }
  }
  

  ソースコードの説明

  • 元の記述であるsetContentView(R.layout.activity_main)の一文をコメントアウト。

    binding = ActivityMainBinding.inflate(layoutInflater)
    val view = binding.root
    setContentView(view)
    

    • これによりBindingオブジェクトを使ってxmlファイルとkotlinファイルを繋ぎます。これでViewBindingの実装ができました。

繋いだ後のViewBindingの使用方法

• binding.〇〇のように記載します。〇〇にはxmlファイルの要素idが入ります。

  binding.btnSubmit.setOnClickListener {
      val name = binding.etName.text.toString()
      binding.tvMessage.text = "Hello $name"
      binding.etName.setText("")
  }
  

  • また、bindingを多く使用する場合はbinding.apply{}スコープで囲うとbinding以降の記述のみにすることができる。

    binding.apply{
        btnSubmit.setOnClickListener {
            val name = etName.text.toString()
            tvMessage.text = "Hello $name"
            etName.setText("")
        }
    }
    

まとめ

• 以前まではXMLに記載した要素はfindViewById()から一つずつ取得していたものが、ViewBindingを使用することによってfindViewById()の使用回数と、変数の作成、宣言数を減らすことができます！

  ViewBindingを実装することでソースコードが見やすくなりますし、すっきりします。
  ぜひ活用してみてください。