Bài 12. ViewBinding trong Android

Như vậy ở bài 11 các bạn đã biết cách dùng findViewById để truy suất tới các control trên giao diện, tuy nhiên nó làm mất khá nhiều thanh xuân của lập trình viên, phải lặp đi lặp lại thao tác findViewById. Đặc biệt nó cũng khó tiếp cận cho những lập trình viên nhảy từ .Net qua.

Android Studio trong các phiên bản mới gần đây đã hỗ trợ ViewBinding để giúp chúng ta dễ dàng truy suất tới các control trên giao diện.

Bây giờ các bạn tạo một dự án tên “HocViewBinding“, sau đó vào file build.gradle (module:HocViewBinding.app):

Ở trên các bạn thấy nhóm android{}, xuống dưới cùng (thực ra chỗ nào cũng được) trong nhóm android{} ngày đằng sau compileOptions{}, bổ sung thêm lệnh:

[code language=”java”]
buildFeatures{
viewBinding=true
}
[/code]

Nếu bạn dùng Android version cũ hơn Tui đang sử dụng thì thay lệnh trên bằng:

[code language=”java”]
viewBinding {
enabled = true
}
[/code]

chi tiết bao gồm cả android {}:

[code language=”java”]
android {
compileSdkVersion 29
buildToolsVersion "29.0.3"
defaultConfig {
applicationId "tranduythanh.com.hocviewbinding"
minSdkVersion 26
targetSdkVersion 29
versionCode 1
versionName "1.0"

testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile(‘proguard-android-optimize.txt’), ‘proguard-rules.pro’
}
}
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_7
targetCompatibility JavaVersion.VERSION_1_7
}
buildFeatures{
viewBinding=true
}
}
[/code]

Sau đó nhớ nhấn Sync Now:

Sau khi Sync Now thành công thì tất cả các Layout (layout xml) trong dự án Android Studio sẽ được phát sinh ra một lớp, tương với tên Layout XML + Binding

Ví dụ: Ta vào thư mục “layout“, trong thư mục này có “activity_main.xml” thì nó sẽ tự động phát sinh ra một lớp tên là “ActivityMainBinding“, tương tự như vậy nếu ta có 1 layout khác tên là “activity_login.xml” thì nó cũng sẽ tự phát sinh thêm một lớp tên là “ActivityLoginBinding“:

Từ lớp binding này ta có thể cấu hình để có thể truy suất trực tiếp vào control trên giao diện mà không cần thông qua hàm findViewById.

Android cũng hỗ trợ cho phép ta cấu hình từ chối binding cho các layout, ví dụ có một layout nào đó mà bạn không muốn dùng binding thì thêm thuộc tính sau cho nó:

[code language=”xml”]

<LinearLayout

tools:viewBindingIgnore="true" >

</LinearLayout>

[/code]

Bây giờ ta sẽ vào phần xử lý mã nguồn để khai báo các biến sử dụng ViewBinding:

Đây là màn hình coding gốc ban đầu của MainActivity:

[code language=”java”]
package tranduythanh.com.hocviewbinding;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
[/code]

Ta viết mã lệnh để truy suất trực tiếp các control trên giao diện thông qua binding:

[code language=”java”]
package tranduythanh.com.hocviewbinding;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

import tranduythanh.com.hocviewbinding.databinding.ActivityMainBinding;

public class MainActivity extends AppCompatActivity {
//khai báo biến binding có kiểu tương ứng với lớp được tạo ra từ layout của màn hình
ActivityMainBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//gọi hàm inflate
binding=ActivityMainBinding.inflate(getLayoutInflater());
//thay thế đối số truyền vào cho setContentView bằng binding.getRoot()
setContentView(binding.getRoot());
}
}
[/code]

Tới đây, để truy suất tới bất kỳ biến control nào trên giao diện ta sẽ thông qua đối tượng binding. Bất cứ khi nào ta kéo thả control/view vào giao diện, đặt id cho control/view thì chỉ cần lấy {binding}.{id của control}.

Ví dụ giờ ta chỉnh sửa layout ta kéo một Button và 1 TextView vào giao diện (activity_main.xml) như sau:

code XML:

[code language=”xml”]
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<Button
android:id="@+id/btnClickMe"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Click Me" />
<TextView
android:background="#FF0F1F"
android:id="@+id/txtMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
[/code]

Bạn thấy Button Tui đặt id là “btnClickMe“, TextView Tui đặt là “txtMessage“.

Bây giờ quay lại màn hình mã lệnh, thêm hàm addEvents() để xử lý như sau:

[code language=”java”]
package tranduythanh.com.hocviewbinding;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

import tranduythanh.com.hocviewbinding.databinding.ActivityMainBinding;

public class MainActivity extends AppCompatActivity {
//khai báo biến binding có kiểu tương ứng với lớp được tạo ra từ layout của màn hình
ActivityMainBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//gọi hàm inflate
binding=ActivityMainBinding.inflate(getLayoutInflater());
//thay thế đối số truyền vào cho setContentView bằng binding.getRoot()
setContentView(binding.getRoot());
addEvents();
}
private void addEvents() {

}
}
[/code]

bạn không tạo hàm addEvents() cũng được, ở đây Tui tạo ra để cho các bạn làm quen, sau này các Project ở các bài học tiếp theo sẽ làm giống vầy, lý do là khi ta làm Project sẽ có rất nhiều control trên giao diện cũng như nhiều xử lý khác, do đó tốt nhất ta nên tách hàm ra để dễ quản lý, và tìm lỗi.

trong hàm addEvents() này ta sẽ thử tiến hành dùng binding để truy suất tới các control như sau nhé:

[code language=”java”]
private void addEvents() {
//truy suất trực tiếp tới biến btnClickMe để gán sự kiện nhấn vào Button:
binding.btnClickMe.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//truy suất trực tiếp vào biến txtMessage để hiển thị chuỗi dữ liệu:
binding.txtMessage.setText("chào Thầy Trần Duy Thanh");
}
});
}
[/code]

Bạn thấy đấy, ở trên Tui không hề dùng findViewById nào cả, Tui dùng biến binding truy suất trực tiếp tới các biến control trên giao diện.

Chạy phần mềm lên ta có kết quả như bình thường:

Như vậy Tui đã hướng dẫn xong bài ViewBinding, tới đây bạn đã có được 2 kỹ thuật truy suất tới các biến control trên giao diện, bạn thích dùng kỹ thuật nào cũng được.

Coding bạn có thể tải ở đây:

https://drive.google.com/open?id=1o-ZDy0AQDG2_lr2bh8lbYOMa7q27sacZ

Các bài sau Tui sẽ trình bày về các control cơ bản như TextView, EditText, Button

Các bạn chú ý theo dõi nhé.

Chúc các bạn thành công.

2 thoughts on “Bài 12. ViewBinding trong Android”

Leave a Reply