“终于懂了“系列：Jetpack AAC完整解析（五）DataBinding 重新认知！

2 年前 · 来自专栏 Android开发技术进阶之路！

胡飞洋

Jetpack AAC 系列文章:
“终于懂了“系列：Jetpack AAC完整解析（一）Lifecycle 完全掌握！
“终于懂了“系列：Jetpack AAC完整解析（二）LiveData 完全掌握！
“终于懂了“系列：Jetpack AAC完整解析（三）ViewModel 完全掌握！
“终于懂了“系列：Jetpack AAC完整解析（四）MVVM 架构探索！
“终于懂了“系列：Jetpack AAC完整解析（五）DataBinding 架构完善！

欢迎关注我的 公众号 ，微信搜索 胡飞洋 ，文章更新可第一时间收到。

前面四篇介绍了Jetpack 架构组件中的基础组件以及它们的综合应用：Jetpack MVVM 架构模式，到这里已经基本满足标准化开发了。但 Jetpack 架构组件除了 Lifecycle、LivaData、ViewModel，还有:

WorkManager ，用于管理后台工作的任务，即使应用退出或重启时。
Paging ，分页库，按需加载部分数据。
Startup ，用于App启动速度优化的库，但只适用于库开发者，郭霖这篇有详细介绍。
DataStore ，用于替换SharedPreferences，目前还处于Alpha阶段。
DataBinding ，将布局中的界面组件直接绑定到数据源，提供双向绑定，及高级绑定适配能力。
ViewBinding ，用于替代findViewById，而DataBinding也包含ViewBinding的能力。
Room ，实现本地存储 数据库 管理，支持LiveData。

目前，就学习使用的必要性和库的功能性来说，WorkManager、Paging、Startup都是非必须的，DataStore还未正式发布，ViewBinding的能力也包含在DataBinding中。Room，实际功能和性能同GreenDAO类似，有个好处是支持LivaData，但已使用GreenDao的项目，也不必切换为Room了。

DataBinding是比较有争议的一个库，这也是本篇的重点，相信会带你 重新认识被误解的 DataBinding 。

一、重新认知 DataBinding

DataBinding的使用方法，参考 官方文档 就可以，介绍地很详细了，这里就不再搬运。（另外还找到一个慕课网的视频很不错： 入门篇 、 高级篇 ）

1.1 DataBinding 的本质

应该不少人和我以前一样，对 DataBinding 的认知就是 在xml中写逻辑 ：

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text='@{!isFemale? user.name + "：男士": user.name + "：女士"}'/>

看到 xml 中使用三元表达式来计算view需要的值，然后就认为：“ DataBinding 不好用！在xml中写表达式逻辑，出错了debug不了啊，逻辑写在xml里面的话 xml 就承担了 Presenter/ViewModel 的职责变得混乱了啊。”

如果是把逻辑写在xml中，确实如是：xml中是不能调试的、职责上确实是混乱了。

但，这就是 DataBinding 的本质了吗？

1.1.1 DataBinding 以前

在 DataBinding 出现以前，想要改变视图就要引用该视图：

        TextView textView = findViewById(R.id.sample_text);
        if (textView != null && viewModel != null) {
            textView.setText(viewModel.getUserName());

而要引用该视图就要先判空，textView 和 viewModel 都不能为空。textView为啥要判空呢？一种情况是 R.id.sample_text是定义在在其他页面中；一种情况是存在控件存在差异的横、竖两种布局，如横屏存在此 textView 控件，而竖屏没有，那么就需要对其做判空处理。

App内页面和控件数量繁多，一个控件可能会多处调用，这就会有出现空指针的可能，那如何完全避免呢？

1.1.2 数据绑定

DataBinding，含义是 数据绑定 ，即 布局中的控件 与 可观察的数据 进行绑定。

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.name}"/>

布局中这个TextView是实实在在存在的，就不需要判空了。而user是否为空 DataBinding也会自动处理：在表达式 @{user.name} 中，如果 user 为 Null，则为 user.name 分配默认值 null。

并且，当该 user.name 被 set 新值时，被绑定了该数据的控件即可获得通知和刷新。换言之，在使用 DataBinding 后，唯一的改变是， 你无需手动调用视图来 set 新状态，你只需 set 数据本身。

所以， DataBinding 并非是将 UI 逻辑搬到 XML 中写导致而难以调试，只负责绑定数据， UI 控件与其需要的终态数据进行绑定 。终态数据是指 UI 控件直接需要的数据（UI数据），string值、int值等，而不是一段逻辑（不然就叫 LogicBinding了，虽然DataBinding支持逻辑表达式）。

明确了 DataBinding 的 职责边界 后应该知道了：原本的逻辑代码该怎么写还是怎么写，只不过不再需要 textView.setText(user.name)，而是直接 user.setName()。

所以 DataBinding 的本质就是 终态数据与 UI控件的绑定 ，具有以下优势：

无需多处调用控件，原本调用的地方只需要set数据即可
1的延伸，无需手动判空
1的延伸，完全不用写模板代码 findViewById
并且，引入DataBinding后，原本的 UI 逻辑无需改动， 只需设置终态数据

上篇提到过 Jetpack MVVM 架构本质是 数据驱动 ，这就是说，控件的状态及数据是被分离到 ViewModel 中管理，并且 ViewModel 这一层只需负责状态数据本身的变化 ，至于该数据在布局中是被哪些视图绑定、有没有视图来绑定、以及怎么绑定，ViewModel 是不用关心的。

那控件是如何做到被通知且更新状态的呢？

DataBinding 是通过 观察者模式 来管理控件刷新状态。当状态数据变化时，只需手动地完成 setValue，这将通知 DataBinding 去刷新该数据绑定的控件。

而，文章开头提到的把逻辑放入xml中的写法，是不建议的。数据值应直接反映UI控件需要的结果，而不是作为逻辑条件放在 xml 中。所以， DataBinding 不负责 UI 逻辑 ，逻辑原本在哪里写，现在还是在哪里写，只不过， 原本调用控件实例去刷新状态的方式，现在改成了数据驱动 。这就是DataBinding 的核心目标。

1.2 例子 - 绑定列表数据

来举个例子进行说明：在页面中展示用户信息（User）列表，同时还有两个按钮用于添加、移除用户：

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
        <variable
            name="clickPresenter"
            type="com.hfy.demo01.module.jetpack.databinding.ListActivity.ClickPresenter" />
    </data>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context=".module.jetpack.databinding.ListActivity">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="添加user"
            android:onClick="@{clickPresenter::addUser}"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="移除user"
            android:onClick="@{clickPresenter::removeUser}"/>
        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/rv_user_list"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
    </LinearLayout>
</layout>

我们知道，RecyclerView的所展示的列表数据，是通过Adapter 对每一项数据分别进行设置的，也就是说User是绑定到 Item的xml中：

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">
        <variable
            name="user"
            type="com.hfy.demo01.module.jetpack.databinding.bean.User" />
    </data>
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="50dp">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.name}"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.level}"/>
    </LinearLayout>
</layout>

我们看下，在Activity中是如何处理的：

public class ListActivity extends AppCompatActivity {
    private ActivityListBinding mViewDataBinding;
    private static UserListAdapter mAdapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mViewDataBinding = DataBindingUtil.setContentView(this, R.layout.activity_list);
        mViewDataBinding.rvUserList.setLayoutManager(new LinearLayoutManager(this, RecyclerView.VERTICAL, false));
        mAdapter = new UserListAdapter();
        mAdapter.setNewInstance(getUserList());
        mViewDataBinding.rvUserList.setAdapter(mAdapter);
        mViewDataBinding.setClickPresenter(new ClickPresenter());
  //这里是假装 调用ViewModel能力 获取用户数据
    private List<User> getUserList() {
        List<User> list = new ArrayList<>();
        list.add(new User("小明","Lv1"));
        list.add(new User("小红","Lv2"));
        list.add(new User("小q","Lv3"));
        list.add(new User("小a","Lv4"));
        return list;
    //点击监听处理
    public class ClickPresenter {
        public void addUser(View view) {
            Toast.makeText(ListActivity.this, "addUser", Toast.LENGTH_SHORT).show();
            mAdapter.addData(new User("小z","Lv5"));
        public void removeUser(View view) {
            Toast.makeText(ListActivity.this, "removeUser", Toast.LENGTH_SHORT).show();
            mAdapter.remove(0);
    private static class UserListAdapter extends BaseQuickAdapter<User, UserItemViewHolder> {
        public UserListAdapter() {
            super(R.layout.item_user);
        @Override
        protected void convert(@NonNull UserItemViewHolder holder, User user) {
            // 精髓所在1，不需要去一个个setText等等
            holder.getItemUserBinding().setUser(user);
            holder.getItemUserBinding().executePendingBindings();
            //当获取的DataBinding不是具体类时，只是ViewDataBinding，那就要使用setVariable了
//            holder.getViewDataBinding().setVariable(BR.user, user);
//            holder.getViewDataBinding().executePendingBindings();
    private static class UserItemViewHolder extends BaseViewHolder {
        // 精髓所在2，只需要持有 binding即可，不用去findViewById
        private final ItemUserBinding binding;
//        private final ViewDataBinding binding2;
        public UserItemViewHolder(View view) {
            super(view);
            binding = DataBindingUtil.bind(view);
//            binding2 = DataBindingUtil.bind(view);
        public ItemUserBinding getItemUserBinding() {
            return binding;
//        public ViewDataBinding getViewDataBinding() {
//            return binding2;
//        }

RecyclerView的初始化、调用ViewModel对数据的获取，这些处理及逻辑和之前一毛一样，不同点在于 Item数据的展示：

在UserItemViewHolder中，不用去findViewById了，而是直接DataBindingUtil.bind(view)，ViewHolder只要Hold住 binding就可以了，之前是Hold住所有的view。
在UserListAdapter中，设置数据是，也只是使用 binding 去 setUser(user)即可。

二、自定义属性 - BindingAdapter

DataBinding 还有个强大功能：能为控件提供自定义属性的 BindingAdapter！

不懂？我们来看个例子。

        <ImageView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:imageUrl="@{user.avatar}"
            app:placeHolder="@{@drawable/dog}"/>

其中的 app:imageUrl 、app:placeHolder 分别与 user.avatar、@drawable/dog 绑定了。但我们知道ImageView本身是没有这两个属性的，并且我们也并不是继承 ImageView 的自定义View，那为啥可以这样使用呢？再来看：

    @BindingAdapter({"app:imageUrl", "app:placeHolder"})
    public static void loadImageFromUri(ImageView imageView, String imageUri, Drawable placeHolder){
        Glide.with(imageView.getContext())
                .load(imageUri)
                .placeholder(placeHolder)
                .into(imageView);

在随便某个类中添加 public static 方法（方法名随意），增加注解@BindingAdapter，并且注明对应的"app:imageUrl", "app:placeHolder"，然后方法参数是控件类型及这两个属性对应值。然后在方法中写逻辑即可，这里就是使用Glide加载用户头像，其中placeHolder是占位图。

这样就完成了图片的加载了！

使用确实相当简洁，相当于 直接自定义属性 。你可以自定义任何你想要的属性。

通常我们可以用 @BindingAdapter 方式，在模块内部来做一些公用逻辑。例如这个图片加载，@BindingAdapter注解的方法只要写一次，那么所有用到 ImageView 加载图片的地方 xml中都可以直接使用属性 app:imageUrl 、app:placeHolder 直接绑定数据。

三、结合 LiveData

DataBinding 还有个妙处在于： 可以结合 LiveData 使用 。

原本我们使用DataBinding，在xml中定义的variable数据，必须要继承BaseObservable 或者使用 ObservableField，还要添加注解 @Bindable、调用notifyPropertyChanged(BR.name)。这是为了 user.setName(name) 字段发生变化时通知对应绑定View 也进行刷新。

而我们上一篇中 MVVM 是使用 LiveData，实现数据驱动的，它包裹的 User 是没有继承BaseObservable的，要继承嘛？不用！

LiveData 的出现，就可以代替 ObservableField ，并且还自动具备生命周期管理。

不用侵入式的修改数据实体类了，直接使用LiveData，同样支持DataBinding的数据绑定！

DataBinding 结合 LiveData 使用步骤很简单：

要使用LiveData对象作为数据绑定来源，需要设置LifecycleOwner
xml中定义变量 ViewModel，并使用 ViewModel 中的 LiveData 绑定对应控件
binding设置变量ViewModel

//结合DataBinding使用的ViewModel
        //1. 要使用LiveData对象作为数据绑定来源，需要设置LifecycleOwner
        binding.setLifecycleOwner(this);
        ViewModelProvider viewModelProvider = new ViewModelProvider(this);
        mUserViewModel = viewModelProvider.get(UserViewModel.class);
        //3. 设置变量ViewModel
        binding.setVm(mUserViewModel);
        <!-- 2. 定义ViewModel 并绑定-->
 <variable
            name="vm"
            type="com.hfy.demo01.module.jetpack.databinding.UserViewModel" />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"