美文网首页
RecyclerView绑定【最火开源框架MVVMHabit简单

RecyclerView绑定【最火开源框架MVVMHabit简单

作者: 大白520 | 来源:发表于2020-04-14 23:56 被阅读0次

最火开源框架MVVMhabit
一. 准备工作
二. 快速上手

三. 数据绑定

  1. TextView绑定
  2. onClick绑定
  3. ImageView绑定
  4. ListView绑定
  5. RecyclerView绑定

四. 其他

  1. toolbar头部标题
  2. 底部tabBar第三方按钮

所有文件

RecyclerActivity.java
layout_recycler_view.xml 布局
RecyclerViewModel.java 数据

item_recycler.xml.java 布局
RecyclerItemViewModel.java 数据

RecyclerItemBean.java //基本bean

1、开始创建recyclerView页面

创建activity RecyclerActivity.java

public class RecyclerActivity extends BaseActivity<LayoutRecyclerViewBinding, RecyclerViewModel> {
    @Override
    public int initContentView(Bundle savedInstanceState) {
        return R.layout.layout_recycler_view;
    }

    @Override
    public int initVariableId() {
        return BR.viewModel;
    }
}

注意:LayoutRecyclerViewBinding创建layout_recycler_view后框架自动生成
在 RecyclerActivity 中所有设置过id的标签都可以通过 binding.{id} 来获取进行操作,例如:binding.recyclerView

创建 layout_recycler_view.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:binding="http://schemas.android.com/apk/res-auto">
    <data>
        
    </data>

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

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </LinearLayout>
</layout>

创建viewModel RecyclerViewModel.java

public class RecyclerViewModel extends BaseViewModel {
    public RecyclerViewModel(@NonNull Application application) {
        super(application);
    }
}

RecyclerViewModel.java中绑定list,绑定item的布局item_recycler.xml

    //给RecyclerView添加ObservableList
    public ObservableList<RecyclerItemViewModel> observableList = new ObservableArrayList<>();

    //给RecyclerView添加ItemBinding
    public ItemBinding<RecyclerItemViewModel> itemBinding = ItemBinding.of(BR.viewModel, R.layout.item_recycler);

layout_recycler_view.xml 关联 list 和 item

<variable name="viewModel" type="com.makuan.template.ui.recycler.RecyclerViewModel" />
<variable name="adapter" type="me.tatarka.bindingcollectionadapter2.BindingRecyclerViewAdapter" />

<RecyclerView>绑定数据

binding:adapter="@{adapter}" //adapter
binding:itemBinding="@{viewModel.itemBinding}" //绑定item布局
binding:items="@{viewModel.observableList}"  //绑定list

还需要绑定布局管理器,否则控件显示空白
需要先引用

<import type="me.tatarka.bindingcollectionadapter2.LayoutManagers" />

绑定布局管理器

binding:layoutManager="@{LayoutManagers.linear()}"

其他布局管理器
//单列
LayoutManagers.linear() // 默认垂直
LayoutManagers.linear(0,false) //参数1:0水平 1垂直;参数2:true数据倒序,false数据顺序

//多列
LayoutManagers.grid(2) //两列瀑布流
LayoutManagers.grid(2,0,true) //参数1:列数;参数2:0水平 1垂直;参数3:true数据倒序,false数据顺序

//交错式瀑布流
LayoutManagers.staggeredGrid(2,1) //参数1:列数;参数2:0水平 1垂直;

创建bean,set get方法和构造函数

public class RecyclerItemBean {
    public String title;
    public String value;

    public RecyclerItemBean(String title, String value) {
        this.title = title;
        this.value = value;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getValue() {
        return value;
    }

    public void setValue(String value) {
        this.value = value;
    }
}

2、开始创建子item页面

创建item布局 item_recycler.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <data>

    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        android:orientation="horizontal">

        <TextView
            android:padding="5dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            tools:text="title" />

        <TextView
            android:padding="5dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

</layout>

创建子 viewModel RecyclerItemViewModel.java

public class RecyclerItemViewModel extends ItemViewModel<RecyclerViewModel> {
    public ObservableField<RecyclerItemBean> itemData = new ObservableField<>();
    public RecyclerItemViewModel(@NonNull RecyclerViewModel viewModel, RecyclerItemBean data) {
        super(viewModel);
    }
}
绑定 item_recycler.xml 和 RecyclerItemViewModel.java

item_recycler.xml data标签中关联ViewModel

<variable
            name="viewModel"
            type="com.makuan.template.ui.recycler.RecyclerItemViewModel" />

RecyclerItemViewModel.java 数据绑定

public ObservableField<RecyclerItemBean> itemData = new ObservableField<>();

绑定后,还需要在public RecyclerItemViewModel 中把数据 set 给绑定的 itemData,

//写在super(viewModel);下面
this.itemData.set(data);

这样我们就可以在item_recycler.xml布局中肆无忌惮的把itemData的数据绑定给TextView标签了

android:text="@={viewModel.itemData.title}"
android:text="@={viewModel.itemData.value}"

以上已经创建并绑定完成,下面来测试代码吧,在RecyclerViewModel中测试代码

public class RecyclerViewModel extends BaseViewModel {

    //给RecyclerView添加ObservableList
    public ObservableList<RecyclerItemViewModel> observableList = new ObservableArrayList<>();

    //给RecyclerView添加ItemBinding
    public ItemBinding<RecyclerItemViewModel> itemBinding = ItemBinding.of(BR.viewModel, R.layout.item_recycler);

    public RecyclerViewModel(@NonNull Application application) {
        super(application);

        //创建数组数据
        List<RecyclerItemBean> itemBeans = new ArrayList<>();
        itemBeans.add(new RecyclerItemBean("你好","1"));
        itemBeans.add(new RecyclerItemBean("再见","2"));
        itemBeans.add(new RecyclerItemBean("成功","3"));

        //循环给list添加item数据
        for(RecyclerItemBean item : itemBeans){
            RecyclerItemViewModel itemViewModel = new RecyclerItemViewModel(this, item);
            //双向绑定动态添加Item
            observableList.add(itemViewModel);
        }

    }
}

相关文章

网友评论

      本文标题:RecyclerView绑定【最火开源框架MVVMHabit简单

      本文链接:https://www.haomeiwen.com/subject/ongajctx.html