android RecyClerView与dataBinding显示文字和图片列表

一直向钱

已于 2022-06-09 17:35:10 修改

阅读量1.2k

点赞数

分类专栏： android开发文章标签： android android studio tv

于 2022-06-09 17:26:36 首次发布

本文链接：https://blog.csdn.net/u013519290/article/details/125207290

版权

android开发专栏收录该内容

95 篇文章 4 订阅

订阅专栏

使用dataBinding实现RecyClerView加载列表显示数据，列表包含有文字和图片

activity代码如下

package com.nyw.databindingrecyclerviewdemo;

import androidx.appcompat.app.AppCompatActivity;
import androidx.databinding.DataBindingUtil;
import androidx.recyclerview.widget.LinearLayoutManager;

import android.os.Bundle;

import com.nyw.databindingrecyclerviewdemo.databinding.ActivityMainBinding;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    private List<Idol> idolList=new ArrayList<>();
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
//        setContentView(R.layout.activity_main);
      ActivityMainBinding activityMainBinding= DataBindingUtil.setContentView(this,R.layout.activity_main);
      for (int i=0;i<20;i++) {
          Idol idol = new Idol();
          idol.setTitle("这是哪里的校花");
          idol.setMsg("好漂亮的校花");
          idol.setImage("https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fedpic_source%2F94%2Fb6%2F89%2F94b68906e381a3d64736dda6e8fb6cd8.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1657357684&t=d89392a5e854c7ee546d2a13ee3f74b0");
          idol.setLocalImage("");
          idolList.add(idol);
      }
//        idolList= IdolUtils.get(this);
        RecyClerViewAdapter recyClerViewAdapter=new RecyClerViewAdapter(idolList);
        activityMainBinding.rcvData.setLayoutManager(new LinearLayoutManager(this));
        activityMainBinding.rcvData.setAdapter(recyClerViewAdapter);
    }
}

页面代码如下

<?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>
        <variable
            name="idol"
            type="com.nyw.databindingrecyclerviewdemo.Idol" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/rcv_data"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            tools:ignore="MissingConstraints" />

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

item页面代码如下

<?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>
        <variable
            name="idol"
            type="com.nyw.databindingrecyclerviewdemo.Idol" />
    </data>
    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            tools:ignore="MissingConstraints">


        <ImageView
            app:image="@{idol.image}"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:visibility="visible"
            android:scaleType="fitXY"
            app:layout_constraintTop_toTopOf="@+id/textView"/>


            <TextView
                android:id="@+id/textView"
                android:text="@{idol.title}"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                tools:ignore="MissingConstraints" />

        </LinearLayout>

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

Idol类如下

activity代码里使用idolList= IdolUtils.get(this);获取数据就使用有参数构造方法，set和get就不需要。如果使用上面activity里写的代码，可以删除有参构造方法，使用set和get方法。

这里注意的是声明变量参数的时候，参数名要一致。比如说下面的图片数据显示的，在item页面app:image="@{idol.image}" 赋值的时候，app:image中的image与Idol类中的声明变量一致，并且在ImageViewBindingAdapter类中注解名一致才正常使用，否则报错。比如在ImageViewBindingAdapter中方法使用了注解 @BindingAdapter("image") ，image就是名称，这3个地方一致才能使用。

package com.nyw.databindingrecyclerviewdemo;

public class Idol {
    public String title;
    public String msg;
    public String image;
    public String localImage;

    public Idol(String title, String msg, String image, String localImage) {
        this.title = title;
        this.msg = msg;
        this.image = image;
        this.localImage = localImage;
    }

    public Idol() {
    }

    public String getTitle() {
        return title;
    }

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

    public String getMsg() {
        return msg;
    }

    public void setMsg(String msg) {
        this.msg = msg;
    }

    public String getImage() {
        return image;
    }

    public void setImage(String image) {
        this.image = image;
    }

    public String getLocalImage() {
        return localImage;
    }

    public void setLocalImage(String localImage) {
        this.localImage = localImage;
    }
}

ImageViewBindingAdapter类代码

package com.nyw.databindingrecyclerviewdemo;

import android.text.TextUtils;
import android.widget.ImageView;

import androidx.databinding.BindingAdapter;

import com.bumptech.glide.Glide;

public class ImageViewBindingAdapter {

//    @BindingAdapter(value = {"localImage","image"},requireAll = false)
//    public static void setImage(ImageView imageView,String url,int resId){
//        if (!TextUtils.isEmpty(url)){
//            //加载网络图片
//            Glide.with(imageView.getContext()).load(url).error(R.mipmap.ic_launcher).placeholder(R.mipmap.ic_launcher).into(imageView);
//        }else {
//            //加载默认本地图片
//            imageView.setImageResource(resId);
//        }
//    }

    @BindingAdapter("image")
    public static void setImage(ImageView imageView,String url){
        if (!TextUtils.isEmpty(url)){
            //加载网络图片
            Glide.with(imageView.getContext()).load(url).error(R.mipmap.ic_launcher).placeholder(R.mipmap.ic_launcher).into(imageView);
        }
    }

}

RecyClerViewAdapter代码如下

package com.nyw.databindingrecyclerviewdemo;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;
import androidx.databinding.DataBindingUtil;
import androidx.databinding.ViewDataBinding;
import androidx.recyclerview.widget.RecyclerView;

import com.nyw.databindingrecyclerviewdemo.databinding.LayoutDataItemBinding;


import java.util.ArrayList;
import java.util.List;

/**
 * RecyClerViewAdapter
 */
public class RecyClerViewAdapter extends RecyclerView.Adapter<RecyClerViewAdapter.MyViewHolder> {
    private List<Idol> idolList;

    public RecyClerViewAdapter(List<Idol> idolList) {
        this.idolList = idolList;
    }

    @NonNull
    @Override
    public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        //这里使用LayoutDataItemBinding,这是由代码Build生成的，一般输入ItemBinding会有提示
        LayoutDataItemBinding viewDataBinding= DataBindingUtil.inflate(LayoutInflater.from(parent.getContext()),R.layout.layout_data_item,parent,false);
        return new MyViewHolder(viewDataBinding);
    }

    @Override
    public void onBindViewHolder(@NonNull MyViewHolder holder, int position) {
        Idol idol=idolList.get(position);
        holder.layoutDataItemBinding.setIdol(idol);

    }

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

    static class MyViewHolder extends RecyclerView.ViewHolder{
        private LayoutDataItemBinding layoutDataItemBinding;
        public MyViewHolder(@NonNull View itemView) {
            super(itemView);
        }

        public MyViewHolder(@NonNull LayoutDataItemBinding layoutDataItemBinding) {
            super(layoutDataItemBinding.getRoot());
            this.layoutDataItemBinding=layoutDataItemBinding;
        }

    }


}

IdolUtils类代码如下，可选

package com.nyw.databindingrecyclerviewdemo;

import android.app.Activity;

import java.util.ArrayList;
import java.util.List;

public class IdolUtils {
    public static List<Idol> get(Activity activity){
        List<Idol> idolList=new ArrayList<>();


        Idol idol1=new Idol("这是哪里的校花","好漂亮的校花"
                ,"https://tse3-mm.cn.bing.net/th/id/OIP-C.XSWZSktJjBqkLh15rWayJwHaNK?pid=ImgDet&rs=1","");

        Idol idol2=new Idol("这是哪里的校花","好漂亮的校花"
                ,"https://tse3-mm.cn.bing.net/th/id/OIP-C.XSWZSktJjBqkLh15rWayJwHaNK?pid=ImgDet&rs=1","");

        Idol idol3=new Idol("这是哪里的校花","好漂亮的校花"
                ,"https://tse3-mm.cn.bing.net/th/id/OIP-C.XSWZSktJjBqkLh15rWayJwHaNK?pid=ImgDet&rs=1","");

        Idol idol4=new Idol("这是哪里的校花","好漂亮的校花"
                ,"https://tse3-mm.cn.bing.net/th/id/OIP-C.XSWZSktJjBqkLh15rWayJwHaNK?pid=ImgDet&rs=1",activity.getResources().getResourceName(R.mipmap.ic_launcher));

        Idol idol5=new Idol("这是哪里的校花","好漂亮的校花"
                ,"https://tse3-mm.cn.bing.net/th/id/OIP-C.XSWZSktJjBqkLh15rWayJwHaNK?pid=ImgDet&rs=1","");


        idolList.add(idol1);
        idolList.add(idol2);
        idolList.add(idol3);
        idolList.add(idol4);
        idolList.add(idol5);
        return  idolList;
    }

}

代码下载

androidRecyClerViewdataBinding-Android文档类资源-CSDN下载