Jetpeck DataBinding实践——轻松上手DataBinding

时间:2022-10-19 11:16:32

Jetpeck DataBinding实践——轻松上手DataBinding

一、问题背景

jetpeck+kotlin持续学习中,现在来学习一下databinding,简单来说,DataBinding是Google提供给我们的数据绑定的支持库,实现在页面组件中直接绑定应用程序的数据源,来看看使用这个有何益处。

二、实现方案(基于kotlin语言)

话不多说,直接上代码 1)项目中引入dataBinding

// 在build.gradle文件添加
android{
   ...
   dataBinding{
      enabled true
   }
   ...
}

2)新建activity和对应的layout布局文件,布局文件内容如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".activity.ViewBindingActivity">
    <TextView
        android:id="@+id/txt1"
        android:gravity="center_horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
    <Button
        android:id="@+id/btn1"
        android:text="btn1"
        android:textAllCaps="false"
        android:layout_gravity="center_horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</LinearLayout>

3)布局文件格式转换(普通layout——》databing对应的layout) 光标在布局文件的根布局-->点击Alt + Enter()-->点击 “Convert to data binding layout” Jetpeck DataBinding实践——轻松上手DataBinding 得到转换后的layout布局文件,内容如下:

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <data>

    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context=".activity.ViewBindingActivity">

        <TextView
            android:id="@+id/txt1"
            android:gravity="center_horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

        <Button
            android:id="@+id/btn1"
            android:text="btn1"
            android:textAllCaps="false"
            android:layout_gravity="center_horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </LinearLayout>
</layout>

4)创建数据类

class Data {
    var txt = "txt1"
    var btnTxt = "btn"
    var number : Int = 1
}

5)在layout的data部分声明变量及类全名

    <data>
        <variable
            name="data"
            type="com.baorant.test2.model.Data" />
    </data>

6)通过@{data.aa}使用变量;通过@{data.aa,default=12345}设置默认值(默认值无需加引号,且只在预览视图显示),layout文件最终内容如下:

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <data>
        <variable
            name="data"
            type="com.baorant.test2.model.Data" />
    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context=".activity.ViewBindingActivity">

        <TextView
            android:id="@+id/txt1"
            android:gravity="center_horizontal"
            android:text="@{data.txt}"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

        <Button
            android:id="@+id/btn1"
            android:text="@{data.btnTxt}"
            android:textAllCaps="false"
            android:layout_gravity="center_horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </LinearLayout>
</layout>

7)activity中设置data数据,并且可以直接拿到layout中组件进行操作,避免使用findViewById的方式重复和麻烦,代码如下:

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.databinding.DataBindingUtil

class DataBindingActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
//        setContentView(R.layout.activity_data_binding2)

        val dataBinding = DataBindingUtil.setContentView<ActivityDataBinding2Binding>(this, R.layout.activity_data_binding2)
        var data = Data()
        data.txt = "new txt"
        data.btnTxt = "new btn txt"
        // 1、通过dataBinding中的data对象设置数据
        dataBinding.data = data

        // 2、通过dataBinding直接拿到layout中的组件
        dataBinding.btn1.setOnClickListener {
            dataBinding.txt1.setText("new txt 2")
        }
    }
}