View Binding — Event Handling

Suraj Vishwakarma
3 min readOct 15, 2019

--

This section will describe how to handle event in view binding in case you have miss the previous ViewBinding — Overview and ViewBinding — Layout and Binding Expression go through this.

Data binding allows you to write expression handling events that are dispatched from the views, There are two ways to handle the same Method references and Listener bindings

Method references

In this event are bound directly to methods same as androd:onClick Let us see the example how we can achieve it.

Let us create methods which we are going to bind with views.

public class WelcomActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

WelcomMessage welcomMessage =
new WelcomMessage("Name : Welcome to Data Binding", "Version :2.0.1");
ActivityWelcomBinding viewDataBinding = DataBindingUtil.setContentView(this, R.layout.activity_welcom);

}


public void OpenMainActivity(View view) {
Toast.makeText(this,"Main Activity",Toast.LENGTH_LONG).show();
}

public void openObserverBinding(View view) {
Toast.makeText(this,"Observer Activity",Toast.LENGTH_LONG).show();
}

public void openAdapterBinding(View view) {
Toast.makeText(this,"Adapter Activity",Toast.LENGTH_LONG).show();
}

}

As you can see we have three method OpenMainActivity, openObserverBinding and openAdapterBinding in WelcomActivity for which each method takes input as parameter view in to it. If you are familiar with android you will find this method are same as onClick method.

Now lets add data tag and onClick event in xml as shown below.

<layout xmlns:android="http://schemas.android.com/apk/res/android">

<data>
<variable
name="welcomActivityPresenter"
type="com.example.view_binding.WelcomActivity"
/>
</data>


<LinearLayout
android:layout_below="@+id/version"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content"
>

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"

android:onClick="@{welcomActivityPresenter::OpenMainActivity}"
android:text="Main Activity!"
></Button>

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/version"
android:onClick="@{welcomActivityPresenter::openAdapterBinding}"
android:text="Adapter Binding!"
></Button>

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/version"
android:onClick="@{welcomActivityPresenter::openObserverBinding}"
android:text="Observer Activity!"
></Button>
</LinearLayout>

</layout>

After we declare the variable tag our setWelcomActivityPresenter() will automatically get avaliable in WelcomeActivity object as shown below.

viewDataBinding.setWelcomActivityPresenter(WelcomActivity.this);

NOTE: Until an unless you won’t add the above value you wont be able to see toast after dispatching the event on button click

Listener bindings

Listener bindings are binding expressions that run when an event happens. They are similar to method references, but they let you run arbitrary data binding expressions.

When a callback is used in an expression, data binding automatically creates the necessary listener and registers it for the event. When the view fires the event, data binding evaluates the given expression.

Let us first create Presenter class for Listener Binding as shown below.

public class AddUserPresenter {
private OnUserAddListner onUserAddListner;
private List<UserDetails> userDetails = new ArrayList<>();

public AddUserPresenter(OnUserAddListner onUserAddListner) {
this.onUserAddListner = (OnUserAddListner) onUserAddListner;
}

public void addUserToList(String name, String age) {
onUserAddListner.updateListView(new UserDetails(name, age));
}
}

As you can see the above constructor takes OnUserAddListner as a parameter which is nothing but an interface class. Let us create a OnUserAddListner interface with one method in it to updateListView.

public interface OnUserAddListner {
void updateListView(UserDetails userDetails);
}

Let us create UserDetails POJO class.

public class UserDetails {
private String name;
private String age;

public UserDetails(String name, String age) {
this.name = name;
this.age = age;
}

public String getName() {
return name;
}

public String getAge() {
return age;
}

@NonNull
@Override
public String toString() {
return "Name :" + name + "and Age :" + age;
}
}

Now we have successfully create the above class and interface, Let us add data and view with two EditText one for name and one for age with Button in it.

<layout xmlns:android="http://schemas.android.com/apk/res/android">

<data>
<variable
name="addUser"
type="com.example.view_binding.presenter.AddUserPresenter"
/>
</data>


<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>

<EditText
android:id="@+id/edtName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter Name"
/>

<EditText
android:id="@+id/edtAge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter Age"
/>

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="@{()->addUser.addUserToList(edtName.getText().toString(),edtAge.getText().toString())}"
android:text="ADD User"
/>
</LinearLayout>

</layout>

As you can see android:onClick is a lambda expression which takes two input parameter both are string.

android:onClick="@{
()-> addUser.addUserToList(
edtName.getText().toString(),
edtAge.getText().toString()
)
}"

Finally let us bind our MainActivity with Presenter such that whenever user click on button a toast displayed on screen.

public class MainActivity extends AppCompatActivity implements OnUserAddListner {


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
AddUserPresenter addUserPresenter = new AddUserPresenter(this);

ActivityMainBinding viewDataBinding = DataBindingUtil.setContentView(this, R.layout.activity_main);


viewDataBinding.setAddUser(addUserPresenter);

}


@Override
public void updateListView(UserDetails userDetails) {
Toast.makeText(this,"Value Recived",Toast.LENGTH_LONG).show();
}
}

Now you have successfully completed Event Handling using view binding

--

--

Suraj Vishwakarma

Mobile Application Developer | Flutter Developer | Project Manager | Team Leader | Scrum Certified | PMI APC Appeard | Writing (starting soon)