Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Binding data with the layout

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 121
    Comment on it

    Typically, to bind data with the layout i.e with the UI fields we access the view elements in the activity using findViewById() method and then set the values to the views.
    This sometimes becomes quite cumbersome when there are large no. of views which we want to access.

    To remove this extra code and to make the activity and Layout more cohesive, we can use Data Binding in Android.

     

    In Data Binding,
    1. we have to specify Model Class which we will use to set the values inside the layout xml file.
    2. We specify Model class' Instance variables which we want to set to each of the view inside the layout xml file.
    3. We just have to pass the Object of the Model class whcih contain the data using Data Binding methods.

     

    This helps in removing those extra findViewById() calls and the setText(), setSrc() (and other) method calls.

     

    Follow the below steps to add data binding in your app:

     

    Add the below line of code in your build.gradle file (app level) to enable data binding:

    android {
    
        dataBinding {
            enabled = true
        }
    
    }
    
    


    Create a Model Class; suppose you want to show student details create the following class:

    public class Student {
    
        public String firstName;
        public String lastName;
        public String id;
        public String mClass;
        public double percentage;
    
        public Student(String firstName, String lastName, String id, String mClass, double percentage) {
            this.firstName = firstName;
            this.lastName = lastName;
            this.id = id;
            this.mClass = mClass;
            this.percentage = percentage;
        }
    
    
    }
    


    Now to bind this model class with the layout,  create a layout activity_main.xml like this:

    <?xml version="1.0" encoding="utf-8"?>
    <layout xmlns:android="http://schemas.android.com/apk/res/android">
    
        <data>
    
            <variable
                name="student"
                type="com.android.databindingapp.Student" />
        </data>
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
    
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@{student.firstName}" />
    
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@{student.lastName}" />
    
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@{student.id}" />
    
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@{student.mClass}" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@{String.valueOf(student.percentage)}" />
        </LinearLayout>
    </layout>

     

    To bind data in a layout, you've to add layout elemt as a root which is followed by data tag in which you'll specify the model class and a variable name.
    data tag is then followed by view root element which would have been a root you've not binded the data in a layout.

     

    Now you can set the values in the UI elements by using variable specified in data element.
    For ex. to @{student.firstName} will return value stored in firstname variable.

     

    In the last TextView element I've used @{String.valueOf(student.percentage)} to set the value as percentage variable is of type double and I'll have to first convert it into string to set it into TextView.

     

    We have now bind the model class  with the layout. To add values inside this layout, use the following code inside your activity:

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //setContentView(R.layout.activity_main);
    
        ActivityMainBinding binding = DataBindingUtil.setContentView(this, R.layout.activity_main);
        Student student = new Student("Aneesh", "Garg","ID001","Intermediate",79.9);
        binding.setStudent(student);
    
    }

     

    As the layout's name is activity_main.xml, so the setContentView will return object of class ActivityMainBinding.
    Now to set values in the layout pass the object in setStudent() method.
    setStudent() name is derived from the variable name we specified in the name attribute inside variable tag i.e  name="student".


    Hope it helps! :)

     

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: