Android DataBinding learning (I): basic application

I Introduction to DataBinding

DataBinding is a technology officially launched by google to reduce the coupling between UI and business code. The good use of DataBinding can effectively reduce the bloated Activity and save a lot of code use of findViewById.

II Basic application

1.gradle configuration

The configuration of gradle is not complicated. You only need to turn on the support for DataBinding.
Add the following code support in android {}.

	// Used to determine whether the DataBinding function is enabled
    buildFeatures{
        dataBinding = true
    }

Description on the official website of google about the latest version of DataBinding and enabling DataBinding support by gradle:
Google official Databinding

2. Simple use

For DataBinding, there are mainly two aspects of coding. Activity, xml and data Model. Let's first look at the xml coding.

0x00. DataBinding in XML uses

When building the databinding layout in XML, you can use the Android studio shortcut key combination "alt+enter" and select "Convert to data binding layout" to quickly generate the databinding layout. The code is as follows:

<?xml version="1.0" encoding="utf-8"?>
<layout 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">

    <data>

    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <TextView
            android:id="@+id/user_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="user_name"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
        
        <TextView
            android:id="@+id/user_age"
            app:layout_constraintTop_toBottomOf="@id/user_name"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            android:layout_marginTop="10dp"
            android:text="user_age"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

Notice that the of the xml root code is replaced by < layout > < / layout > and there is more < data > < / Data >.

0x01. Data class

data class User(var age: Int, var name: String)

kotlin's Data Class is directly used here, which is similar to the Java Bean Class. Of course, you can also directly create a regular Class.

0x02. Declare the full names of variables and classes in data

There are two ways to declare variables in data:

(1) Use variable directly

	<data>
        <variable
            name="user"
            type="com.work.binding.practice.data.User" />
    </data>

Variable means "variable". As the name suggests, the data class you need to bind is written in it. Name is similar to the variable name of Java, and type is similar to the class name of Java. However, it should be noted that the full path must be given here. The "variable" can be resolved to the data class.

(2) Using import

	<data>
        <import type="com.work.binding.practice.data.User"/>
        <variable
            name="user"
            type="User" />
    </data>

Import is used here, which is similar to Java import and introduces the package name. Name is changed to the class name of the data class.

0x03. Bind variable to UI interface

By @{} binding to the UI interface, the code is as follows:

<?xml version="1.0" encoding="utf-8"?>
<layout 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">

    <data>
        <import type="com.work.binding.practice.data.User"/>
        <variable
            name="user"
            type="User" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".activity.MainActivity">

        <TextView
            android:id="@+id/user_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.name}"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
	<!--Pay attention to the use here String.valueOf take int Turn into String，Otherwise, an error will be reported-->
        <TextView
            android:id="@+id/user_age"
            app:layout_constraintTop_toBottomOf="@id/user_name"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            android:layout_marginTop="10dp"
            android:text="@{String.valueOf(user.age)}"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

include

<!--activity_main.xml-->

<?xml version="1.0" encoding="utf-8"?>
<layout 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">

    <data>
        <import type="com.work.binding.practice.data.User"/>
        <variable
            name="user"
            type="User" />
    </data>
    <!--use include add android:layout_width and android:layout_height，avoid include The code cannot be displayed-->
   	<!--app:user="@{user}"Need and variable of name equally-->
	<include
		android:layout_width="match_parent"
    	android:layout_height="wrap_content"
    	layout="@layout/layout_title"
    	app:user="@{user}"/>
    	......Omit code......
</layout>

<!--activity_sub.xml-->
<layout 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">
    
    <data>
        <import type="com.work.binding.practice.data.User"/>
        <variable
            name="user"
            type="User" />
    </data>
    ......Omit code......

DataBinding does not support merge.

0x04.Activity code

Because DataBinding is used, you can use DataBindingUtil instead of using the traditional setContentView(R.layout.activity_main). The code is as follows:

class MainActivity : AppCompatActivity() {

	// Use empty security operator '?'
    private var activityMainBinding:ActivityMainBinding? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        activityMainBinding = DataBindingUtil.setContentView(this, R.layout.activity_main)
        // Set data class to ActivityMainBinding
        activityMainBinding?.user = User(21, "Jack")
    }
}

Because we use Kotlin, the above code can be simplified

class MainActivity : AppCompatActivity() {

    private val activityMainBinding:ActivityMainBinding by lazy {
        DataBindingUtil.setContentView(this, R.layout.activity_main)
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // Set the data class to ActivityMainBinding. There is no need to use an empty security modifier here
        activityMainBinding.user = User(21, "Jack")
    }
}

Using the by lazy technique simplifies it. The disadvantage is that the variable must be the val attribute.
Through the above coding, we can successfully display the User's data on the UI

III summary

From the above coding, we can see that using DataBinding technology can greatly reduce the code of Activity and reduce the bloated Activity. See here, you may be thinking about how to update the data on the UI interface? In the next article, we will solve this problem!