如何使用数据绑定将数据绑定到RecyclerView中的行？

Question

我想使用数据绑定在RecyclerView行中显示一些图像和文本。代码正在运行，没有任何错误，但数据未显示在RecyclerView中。

reward_item.xml

 <?xml version="1.0" encoding="utf-8"?>

    <layout 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">

        <data>
            <import type="android.view.View" />
            <variable
                name="recipes"
                type="com.prasona.android.indiancusine.Model.NameModel" />
        </data>

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

            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="5dp"
                app:cardUseCompatPadding="true">


                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">

                    <TextView
                        android:id="@+id/name_textView"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_centerVertical="true"
                        android:layout_marginLeft="10dp"
                        android:layout_toEndOf="@+id/recipeimageView"
                        android:layout_toRightOf="@+id/recipeimageView"
                        android:text="@{recipes.recipeName}"
                        android:textColor="@android:color/black"
                        android:textSize="18sp" />

                    <ImageView
                        android:id="@+id/recipeimageView"
                        android:layout_width="180dp"
                        android:layout_height="180dp"
                        android:layout_alignParentLeft="true"
                        android:layout_alignParentStart="true"
                        android:layout_alignParentTop="true"
                        app:srcCompat="@drawable/dinner"
                        app:imageUrl="@{image.imageUrl}"/>
                </RelativeLayout>
            </android.support.v7.widget.CardView>
        </LinearLayout>
    </layout>

这是我的适配器：

import android.databinding.BindingAdapter;
import android.databinding.DataBindingUtil;
import android.databinding.ViewDataBinding;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.ViewGroup;
import android.widget.ImageView;

import com.bumptech.glide.Glide;


import java.util.List;

/**
 * Created by admin on 14-12-2017.
 */

public class RewardAdapter extends RecyclerView.Adapter<RewardAdapter.ViewHolder> {
    private List<SampleModel> model;

    public RewardAdapter(List<SampleModel> model) {
        this.model = model;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        ViewDataBinding binding = DataBindingUtil.inflate(LayoutInflater.from(parent.getContext()),
                R.layout.rewarded_item, parent, false);

        return new ViewHolder(binding);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        ViewDataBinding viewDataBinding = holder.getViewDataBinding();

//        viewDataBinding.setVariable(BR.image,model.get(position));
        viewDataBinding.setVariable(BR.recipeName, model.get(position));
        viewDataBinding.setVariable(BR.imageUrl, model.get(position));
    }

    @Override
    public int getItemCount() {
        return (null != model ? model.size() : 0);
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        private ViewDataBinding viewBinding;

        public ViewHolder(ViewDataBinding binding) {
            super(binding.getRoot());

            viewBinding = binding;
            viewBinding.executePendingBindings();
        }

        public ViewDataBinding getViewDataBinding() {
            return viewBinding;
        }
    }


}

Answer 1

目前还不清楚你想要绑定什么。在您的代码中，您有SampleModel类，它似乎是您的行的模型，但在您的布局中，您已声明了Model.NameModel类型的变量配方。稍后在行布局中，您还使用ImageView的图像变量。

我将假设您的行模型是您在适配器中使用的SampleModel类，它包含文本（对于TextView）和表示该条目的图像URL的String。要进行绑定工作，您应该：

在代码中声明一个SampleModel变量并将其用于您的视图：

<data>
    <import type="android.view.View" />
    <variable
        name="recipes"
        type="the.package.of.the.class.SampleModel" />
</data>

将在布局中使用：

<TextView
    ...
    android:text="@{recipes.recipeName}"/>
<ImageView
    ...
    app:imageUrl="@{recipes.imageUrl}"/>

SampleModel类应该是一个扩展BaseObservable的类，并公开我们上面使用的两个字段：

class SampleModel extends BaseObservable {
    private String recipeName;
    private String imageUrl;

    @Bindable
    public String getRecipeName() {
         return recipeName;
    }

    @Bindable
    public String getImageUrl() {
         return imageUrl;
    }
}

需要更改适配器以使用完全绑定类：

@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    RewardItemBinding binding = DataBindingUtil.inflate(LayoutInflater.from(parent.getContext()),
            R.layout.rewarded_item, parent, false);
    // update the ViewHolder constructor to receive a RewardItemBinding parameter instead of the super class
    return new ViewHolder(binding);
}

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
    RewardItemBinding viewDataBinding = holder.getViewDataBinding();
    viewDataBinding.setRecipes(model.get(position));
}

这将从模型中设置两个视图的数据。问题在于ImageView没有我们在布局中使用的imageUrl属性的setter，绑定框架将不知道如何将数据绑定到视图。要处理此问题，您可以使用如下的BindingAdapter：

// declare this method in one of your classes(notice the static modifier)
@BindingAdapter("imageUrl")
public static void bindImage(ImageView imageView, String imageUrl) {
    // use Glide to setup the image
}