Jetpack mvvm 三部曲(三) DataBinding

• 国庆节假期过完了今天正常上班感觉假期啥都没玩到

  
  
  

  离下一次假期要到明年去了= =今年感觉啥都没整好

• 吐槽完了 继续本系列的第三篇DataBinding

第一篇ViewModel

第二篇LiveData

终章 MVVM

先放下本jetpak系列在学习过程中写的demo jetpackDemo

• 老规矩贴下官网DataBinding概览

• 先说下DataBinding的作用是帮助我们少写了view的赋值、改变状态的代码，将数据直接绑定到xml实现自动赋值。

• 下面就直接开整

  
  

• 使用在app目录中build.gradle文件android段落中插入

android {
        ...
        dataBinding {
            enabled = true
        }
    }

• 新建了一个activity_main.xml布局以后在外层包裹一层<layout>布局 ，然后插入data就行了

<layout>
    <data>
        <variable
            name="mode"
            type="包名.类名" />
    </data>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".dataBinding.DataBindActivity">
   <TextView
        android:id="@+id/text"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_width="wrap_content"
        android:layout_marginTop="10dp"
        android:textSize="18sp"
        android:text='@{mode.xxxx}'
        android:textColor="@android:color/holo_red_dark"
        android:layout_height="wrap_content"/>

</androidx.constraintlayout.widget.ConstraintLayout>

</layout>

• 当然绑定数据不能少variable标签，name属性就是一个名称可以随意，type这个是绑定被绑定的全路径类，要注意的是这个类要大写开头不然会报couldn't make a guess for com.xxx.xxx的错误导致无法编译通过
• 赋值使用@{mode.xxxx}就行了，@{}这个可以支持三目运算符、String、StringBuffer、Integer等操作感兴趣的可以看下官方的表达式语言
• 做完xml的工作剩下的就是在代码中使用了

//在activity这里不需要再去写setContentView(R.layout.xxx)了
//因为DataBindingUtil.setContentView已经帮我们完成了setContentView(R.layout.xxx);这步骤
ActivityMainBinding  binding = DataBindingUtil.setContentView(this,R.layout.activity_main);
binding.setViewModel(mainViewModel);

setContentView

• ActivityMainBinding这个是DataBinding给我们自动生成的，有点要注意的是<data class="ADataBinding"> 如果xml中在data标签那写了class名称，那么默认生成的xxxxxBinding类名将变成classs填写的名称了，默认情况下xml生成的Binding类是xml的名称，如上述的activity_main生成的则是ActivityMainBinding。
• setViewModel放入xml<variable>标签中制定的type类就行了，setViewModel这个方法是根据<variable>定义的name来的，如果你定义的name是user那么对应的赋值方法就是setUser了，捎带提一句<data>标签是支持很多个<variable>标签的，所以可以绑定很多个数据源。
• 除了上述的数据绑定操作，我们还可以用利用DataBinding的控件id绑定对控件进行操作，这样就省了findViewById的代码了

binding.text.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                
            }
        });

• 最后我们在onDestroy方法对DataBinding进行解绑操作

@Override
    protected void onDestroy() {
        super.onDestroy();
        if(binding!=null){
            binding.unbind();
        }
    }

• 上述整个只不过是DataBinding最简单最入门的使用下面开始骚起来

第一幕DataBinding绑定xml以及绑定数据 不同场景使用

在fragment使用

 public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        //二选一
        FragmentDataBindingBinding dataBindFragment = DataBindingUtil.inflate(inflater, R.layout.fragment_data_binding, container, false);
        FragmentDataBindingBinding dataBindFragment = FragmentDataBindingBinding.inflate(inflater, container, false);
        return dataBindFragment.getRoot();
    }

在自定义组合控件以及RecycleView使用，实例化DataBinding其实和fragment没啥区别不过要注意的是executePendingBindings方法

//二选一
  ViewDataBindingBinding    viewDataBinding = DataBindingUtil.inflate(LayoutInflater.from(context),R.layout.view_data_binding,this,true);
  ViewDataBindingBinding    viewDataBinding = ViewDataBindingBinding.inflate(LayoutInflater.from(context),this,true);

• RecycleView的适配器以及listview、gridview等适配器的用法其实也和这差不多

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
    private List<User> users;
    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        //二选一
        ItemAdapterBinding itemAdapterBinding = DataBindingUtil.inflate(LayoutInflater.from(parent.getContext()), R.layout.item_adapter,parent,false);
        ItemAdapterBining itemAdapterBinding = ItemAdapterBinding.inflate(LayoutInflater.from(parent.getContext()),parent,false);

        return new ViewHolder(itemAdapterBinding);
    }

    public MyAdapter(List<User> users) {
        this.users = users;
    }

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
        holder.itemAdapterBinding.setUser(users.get(position));
       //当可变或可观察对象发生更改时，绑定会按照计划在下一帧之前发生更改。但有时必须立即执行绑定。要强制执行
      //请使用executePendingBindings() 方法。        
      //这句话很关键 不加数据很可能错乱 
        holder.itemAdapterBinding.executePendingBindings();
    }

    @Override
    public int getItemCount() {
        return users.size();
    }

    class ViewHolder extends RecyclerView.ViewHolder{
        private  ItemAdapterBinding itemAdapterBinding;

        public ViewHolder(@NonNull ItemAdapterBinding itemAdapterBinding) {
            super(itemAdapterBinding.getRoot());
            this.itemAdapterBinding = itemAdapterBinding;
        }
    }
}

• item_adapter.xml

<?xml version="1.0" encoding="utf-8"?>
<layout>
    <data >
        <variable name="user" type="com.sanyue.jetpakcdemonew.bean.User"/>
    </data>

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <TextView
        android:id="@+id/tv_name"
        android:layout_width="match_parent"
        android:gravity='center'
        android:hint='@{@string/app_name + "是偶数"}'
        android:background="@{user.age%2==0 ? @android:color/holo_blue_light:@android:color/holo_orange_dark }"
        android:text='@{user.age%2==0 ?user.age+ "是偶数" : Integer.toString(user.age)}'
        app:layout_constraintTop_toTopOf="parent"
        android:textColor='@{user.age%2==0 ? @android:color/holo_red_dark:@color/colorAccent }'
        android:layout_height="30dp"/>


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

• 上面就讲述了下实例化的两种方法，DataBindingUtil和xml生成的Binding类。

第二幕 双向数据绑定 这环节讲下项目实战是怎么用DataBinding

• 在上述的例子中都是被动去改变ui只有在setxxx之后UI才会改变，如果想要ui即使跟随数据改变那么就要用到ViewModel和LiveData了

• 分别定义一个数据类 、一个ViewModel类

public class User {
    private String name;
    private int age;

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

    public User() {
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    @Override
    public String toString() {
        return "User{" +
                "name='" + name + '\'' +
                ", age=" + age +
                '}';
    }
    public String getUser(){
        return name==null&&age==0?"毛都没有哦":name+"今年"+age;
    }
}

public class DemoViewModel extends ViewModel {
    public ObservableParcelable<Ab> ab= new ObservableParcelable<>();
    public ObservableBoolean flag= new ObservableBoolean(false);
    public ObservableArrayList<String> list= new ObservableArrayList();
    public ObservableInt count =new ObservableInt(0);
    private MediatorLiveData<User> userMediatorLiveData = new MediatorLiveData<>();
    public LiveData<User> userLiveData = userMediatorLiveData;
    public MediatorLiveData<String> stringMediatorLiveData =new MediatorLiveData<>();
    public ObservableField<User> userObservableField = new ObservableField<>();


    public void addUser(User user){
        userMediatorLiveData.setValue(user);
        stringMediatorLiveData.setValue(user+"你好");
        addList(stringMediatorLiveData.getValue());
        userObservableField.set(user);
    }
    public String getUser(){
        return userMediatorLiveData.getValue()==null?"毛都没有哦":userMediatorLiveData.getValue().getName()+"今年"+userMediatorLiveData.getValue().getAge();
    }

    public void add(){
        count.set(count.get()+1);
    }
    public void addList(String str){
        list.add(str);
    }

    public DemoViewModel() {
        ab.set(new Ab("学生"));
        stringMediatorLiveData.setValue("1234");
    }



    public static class Ab  implements Parcelable {
        public String name;

        public Ab(String name) {
            this.name = name;
        }

        protected Ab(Parcel in) {
            name = in.readString();
        }

        public static final Creator<Ab> CREATOR = new Creator<Ab>() {
            @Override
            public Ab createFromParcel(Parcel in) {
                return new Ab(in);
            }

            @Override
            public Ab[] newArray(int size) {
                return new Ab[size];
            }
        };

        public String getName() {
            return name;
        }

        public void setName(String name) {
            this.name = name;
        }

        @Override
        public int describeContents() {
            return 0;
        }

        @Override
        public void writeToParcel(Parcel parcel, int i) {
            parcel.writeString(name);
        }
    }
}

• 先说下可观察字段在之前文章观察字段一直用的LiveData ，用observe方法对字段进行观察，而Observable系列则是addXXXXXXChangedCallback方法进行监听

• ObservableBoolean

• ObservableByte

• ObservableChar

• ObservableShort

• ObservableInt

• ObservableLong

• ObservableFloat

• ObservableDouble

• ObservableParcelable

• 这几个Observable的类用法都是一样的都是set方法赋值get方法取值，就ObservableParcelable赋值的范型需要实现Parcelable接口

• 接着看xml和activity页面

<?xml version="1.0" encoding="utf-8"?>
<layout>
    <data>
        <variable
            name="mode"
            type="com.sanyue.jetpakcdemonew.liveDataBinding.two.DemoViewModel" />
        <variable
            name="onclick"
            type="android.view.View.OnClickListener" />
        <variable
            name="adapter"
            type="com.sanyue.jetpakcdemonew.liveDataBinding.ListAdapter" />
    </data>
<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:orientation="vertical"
    android:layout_height="match_parent"
    tools:context=".liveDataBinding.two.DemoActivity">
    <Button
        android:id="@+id/addUser"
        android:layout_width="wrap_content"
        android:onClick="@{onclick}"
        android:text='@{"添加个"+mode.ab.name}'
        android:layout_height="wrap_content"/>
    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:text='@{mode.userLiveData.user}'
        android:layout_height="50dp"/>
    <Button
        android:id="@+id/countAdd"
        android:layout_width="wrap_content"
        android:onClick="@{onclick}"
        android:text='@{mode.count+"+1"}'
        android:layout_height="wrap_content"/>
    <CheckBox
        android:id="@+id/checkbox"
        android:layout_width="wrap_content"
        android:button="@drawable/check"
        android:checked="@={mode.flag}"
        android:text="@{String.valueOf(mode.flag)}"
        android:paddingLeft="10dp"
        android:layout_height="50dp"/>
    <TextView
        android:layout_width="wrap_content"
        android:text="@{mode.stringMediatorLiveData}"
        android:layout_height="wrap_content"/>
    <TextView
        android:layout_width="wrap_content"
        android:text="@{mode.userObservableField.user}"
        android:layout_height="wrap_content"/>

    <TextView
        android:layout_width="wrap_content"
        android:text='@{String.format("添加了%d个学生",mode.list.size())}'
        android:layout_height="wrap_content"/>
    <ListView
        android:id="@+id/listView"
        android:adapter="@{adapter}"
        android:layout_width="match_parent"
        android:selectedItemPosition="@{mode.list.size()-1}"
        app:layout_constraintTop_toBottomOf="@+id/checkbox"
        android:layout_height="match_parent"/>
</LinearLayout>
</layout>

• 简单的封装了个BaseActivity

public abstract class BaseActivity extends AppCompatActivity {
    private ViewDataBinding dataBinding;
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //这里是activity中使用 dataBinding 我这里就是简单的写了个抽象类节省下事情
        dataBinding = DataBindingUtil.setContentView(this,getLayout());
        init();
    }
    public abstract void init();
    public abstract int getLayout();
    protected  <T extends ViewDataBinding>  T getViewDataBinding() {
        return (T) dataBinding;
    }
    @Override
    protected void onDestroy() {
        super.onDestroy();
        if(dataBinding!=null){
            dataBinding.unbind();
        }
    }
}

public class DemoActivity extends BaseActivity implements View.OnClickListener {
    private DemoViewModel viewModel;
    private ActivityDemoBinding demoBinding;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        viewModel = new ViewModelProvider(this).get(DemoViewModel.class);
        demoBinding = getViewDataBinding();
        demoBinding.setMode(viewModel);
        demoBinding.setOnclick(this);
        demoBinding.setLifecycleOwner(this);
        ListAdapter adapter = new ListAdapter(viewModel.list);
        demoBinding.setAdapter(adapter);
    }

    @Override
    public void init() {

    }

    @Override
    public int getLayout() {
        return R.layout.activity_demo;
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()){
          case   R.id.addUser:
              viewModel.addUser(new User("张三",18));
            break;
            case R.id.countAdd:
                viewModel.add();
                break;
        }
    }
}

• ListView适配器和item.xml

public class ListAdapter extends BaseAdapter {
    private ObservableArrayList<String> list;

    public ListAdapter(ObservableArrayList<String> list) {
        this.list = list;
    }

    @Override
    public int getCount() {
        return list.size();
    }

    @Override
    public Object getItem(int i) {
        return list.get(i);
    }

    @Override
    public long getItemId(int i) {
        return i;
    }

    @Override
    public View getView(int i, View view, ViewGroup viewGroup) {
        ItemListViewBinding binding = null;
        if(binding==null){
            binding = DataBindingUtil.inflate(LayoutInflater.from(viewGroup.getContext()),R.layout.item_list_view,viewGroup,false);
        }
        binding.setStr(list.get(i));
        binding.executePendingBindings();
        return binding.getRoot();
    }
}

<?xml version="1.0" encoding="utf-8"?>
<layout>
    <data>
        <variable
            name="str"
            type="String" />
    </data>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:gravity="center"
    android:text='@{str}'
    android:textColor="#ffffff"
    android:background="@drawable/b1"
    android:layout_height="30dp">
</TextView>
</layout>

• 这里要强调的是.setLifecycleOwner(this)方法，如果不绑定生命周期那么DataBinding无法感知LiveData的变化，这样会导致ui无法跟着数据一同改变。
• 这种能在xml和数据进行绑定的称之为双向特性

• 目前支持双向特性的控件如下

  
  
  效果图

第三幕绑定适配器

• 先看下谷歌提供的TextViewBindingAdapter的代码

  
  TextViewBindingAdapter
• 从源码可以看到是定义了一个注解根据android:text这个关键字段对TextView进行setText操作，既然如此我们完全可以照葫芦画瓢弄一个自己的适配器
• 下面用RecycleView的方式去实现上面ListView的效果
• 定义一个适配器类 BindingAdapters

public class BindingAdapters {
    /**
     * @BindingAdapter的关键就是绑定一个liveData的数据进行关联当数据进行了改变那么会再次调用该方法
     *
     * @param view
     * @param position 这个是最关键的 绑定这个的值必须得是liveData类型可以观察的
     *    如果是普通的listView 那么这个方法在数据进行改变的时候就不会在执行了
     * @param adapter
     */
    @BindingAdapter({"android:scrollToPosition", "android:adapter"})
    public static void setRecycleViewAdapter(RecyclerView view,int position,RecyclerView.Adapter adapter){
        if (view.getAdapter() == null) {
            view.setAdapter(adapter);
        }else {
            view.getAdapter().notifyDataSetChanged();
        }
        view.scrollToPosition(position);
    }
    @BindingAdapter("android:layoutManager")
    public static void setLayoutManager(RecyclerView recyclerView,RecyclerView.LayoutManager LayoutManager){
      recyclerView.setLayoutManager(LayoutManager);
    }
}

public class DemoRecycleAdapter extends RecyclerView.Adapter<DemoRecycleAdapter.ViewHolder> {
    private List<String> users;
    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        return new ViewHolder(ItemDemoRecyViewBinding.inflate(LayoutInflater.from(parent.getContext()),parent,false));
    }

    public DemoRecycleAdapter(ObservableArrayList<String> users) {
        this.users = users;
    }

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
        holder.itemAdapterBinding.setUser(users.get(position));
        //这句话很关键 不加数据会错乱 https://developer.android.google.cn/topic/libraries/data-binding/generated-binding
        holder.itemAdapterBinding.executePendingBindings();
    }

    @Override
    public int getItemCount() {
        return users.size();
    }

    class ViewHolder extends RecyclerView.ViewHolder{
        private ItemDemoRecyViewBinding itemAdapterBinding;
        public ViewHolder(@NonNull ItemDemoRecyViewBinding itemAdapterBinding) {
            super(itemAdapterBinding.getRoot());
            this.itemAdapterBinding = itemAdapterBinding;
        }
    }
}

<androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycleView"
        app:layout_constraintTop_toBottomOf="@+id/scoreText"
        android:layout_width="match_parent"
        android:adapter="@{recycleAdapter}"
        android:layoutManager="@{layout}"
        android:scrollToPosition="@{mode.list.size()-1}"
        android:layout_height="90dp"/>

demoBinding.setLayout(new LinearLayoutManager(this));
DemoRecycleAdapter recycleAdapter = new DemoRecycleAdapter(viewModel.list);
demoBinding.setRecycleAdapter(recycleAdapter);

• 这里主要讲解下position这个想要是实时去刷新adapter，绑定一个可观察对象是关键，adapter不是可观察得对象只有list(ObservableArrayList)是可观察对象 ，如果没有去绑定一个可观察对象那么自定义适配器方法setRecycleViewAdapter只会执行一次，感兴趣的小伙伴可以自己试一试。

第四幕继承BaseObservable自己实现一个可观察对象

• 贴下官方的链接使用可观察的数据对象
  

public class Book extends BaseObservable {
    private String name;
    private int pages;

    public Book() {
    }

    public Book(String name, int pages) {
        this.name = name;
        this.pages = pages;
    }

    @Bindable
    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
        notifyPropertyChanged(BR.name);
        notifyPropertyChanged(BR.score);
    }
    @Bindable
    public int getPages() {
        return pages;
    }
    public void setPages(int pages) {
        this.pages = pages;
        notifyPropertyChanged(BR.pages);
    }
    @Bindable
    public String getScore(){
        if(name==null){
            return "";
        }
        return name.startsWith("Android")?name+"强烈推荐":name+"这破书没啥好看的";
    }
}

• 自己实现BaseObservable关键2个代码是@Bindable和notifyPropertyChanged 这俩玩意

 <TextView
        android:layout_width="wrap_content"
        android:text="@{mode.book.score}"
        android:layout_height="wrap_content"/>

   public Book book= new Book();
    public void addBooK(String name,int page){
        book.setName(name);
        book.setPages(page);
    }

终幕

Jetpack 三部曲就到此结束了
DataBinding这个源码对比ViewModel和LiveData来讲更多更为复杂应用到了注解反射以及APT技术，通过注解反射的方式生成辅助类ActivityMainBindingImpl感兴趣的小伙伴可以去研究下。

image.png

写的不对不好的地方请大家指点

image