搞定RecyclerView适配器+Glide图片调用实现新闻简单列表

总体思路：总布局设计好，recyclerview数据用适配器填充，适配器的数据即多个子布局（由图片和文字组成）组成的一个列表，后台实现需要用相应的带有图片和文字属性的类进行数据传输

按顺序看该文档

1.总布局activity_main.xml设置顶层导航栏，设置recyclerView（用适配器填充内容）

<?xml version="1.0" encoding="utf-8"?>
<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:layout_height="wrap_content"
    android:orientation="vertical"
    tools:context=".MainActivity">


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

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

            <TextView
            android:id="@+id/textView11"
            android:layout_marginRight="20px"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="TextView" />

            <TextView
                android:id="@+id/textView9"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

            <TextView
                android:id="@+id/textView10"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

            <TextView
                android:id="@+id/textView8"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

            <TextView
                android:id="@+id/textView2"
                android:layout_marginRight="20px"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

            <TextView
                android:id="@+id/textView3"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

            <TextView
                android:id="@+id/textView4"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

            <TextView
                android:id="@+id/textView5"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

            <TextView
                android:id="@+id/textView6"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />
            <TextView
                android:id="@+id/textView7"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />
            <TextView
                android:id="@+id/textView12"
                android:layout_marginRight="20px"

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />

        </LinearLayout>
    </HorizontalScrollView>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</LinearLayout>

2.编写新闻子布局：layout.xml:添加图片和文本

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/imageView"
        android:layout_marginLeft="5px"
        android:layout_marginRight="5px"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:scaleType="centerCrop"
        app:srcCompat="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/textView"
        android:layout_marginLeft="5px"
        android:layout_marginRight="5px"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="2"
        android:text="TextView" />

</LinearLayout>

3.添加新闻类News.java用于传子布局的图片和文本

package com.example.news;

public class News {
    private String name;
    private int imageId;//两个成员变量

    public News(String name, int imageId) {//构造方法，用以赋值
        this.name = name;
        this.imageId = imageId;//赋予变量值
    }

    public String getName() {//获得Name的值
        return name;
    }

    public int getImageId() {//用以获得图片ID的值
        return imageId;
    }
}

4.难点：为News.java编写适配器

该适配器继承recyclerview的适配器，泛型为ViewHolder，理解为一个子布局类型的列表就好
1要做ViewHolder内部类（在其中构造函数Viewholder获取图片，文本id）；2做适配器的构造函数即传入一个新闻类的列表
为适配器重写加载，传输（即渲染recycler中的每个子布局）
- 加载：传入layout样式，返回ViewHoldler子布局
- 传输：新闻类的列表传入，添加子布局（自动添加无需循环）
- 最后给一个列表长度

package com.example.news;

import android.text.Layout;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;

import com.bumptech.glide.Glide;

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

public class News_Adapter extends RecyclerView.Adapter<News_Adapter.ViewHolder> {
    private List<News> mnewsList;
    View view;
//    ArrayList<String>url=new ArrayList<>();
//    //导入Url
//    public static String[] Images = {
//            "http://i.imgur.com/rFLNqWI.jpg",
//            "http://i.imgur.com/C9pBVt7.jpg",
//            "http://i.imgur.com/rT5vXE1.jpg",
//            "http://i.imgur.com/aIy5R2k.jpg",
//            "http://i.imgur.com/MoJs9pT.jpg",
//            "http://i.imgur.com/S963yEM.jpg",
//            "http://i.imgur.com/rLR2cyc.jpg",
//            "http://i.imgur.com/SEPdUIx.jpg",
//            "http://i.imgur.com/aC9OjaM.jpg",
//            "http://i.imgur.com/76Jfv9b.jpg",
//            "http://i.imgur.com/fUX7EIB.jpg",
//            "http://i.imgur.com/syELajx.jpg",
//            "http://i.imgur.com/COzBnru.jpg",
//            "http://i.imgur.com/Z3QjilA.jpg",
//    };
//    private ArrayList<String> getData()
//    {
//        for (String next : Images) {
//            url.add(next);
//        }
//        return url;
//    }
    //内部类ViewHolder
    public class ViewHolder extends RecyclerView.ViewHolder {
        ImageView newsImage;
        TextView newsText;
        //ViewHolder构造函数
        public ViewHolder(View itemView) {
            super(itemView);
            newsImage= itemView.findViewById(R.id.imageView);
            newsText=itemView.findViewById(R.id.textView);
        }
    }
    //适配器构造函数
    public  News_Adapter (List<News>newsList)
    {
        mnewsList=newsList;
    }

    @Override
    //只是加载子布局
    public News_Adapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        //初始url
//        getData();
        //加载子布局
        view = LayoutInflater.from(parent.getContext()).inflate(R.layout.layout,parent,false);
        //返回ViewHolder实例
        ViewHolder holder=new ViewHolder(view);
        return holder;
    }

    @Override
    //子项赋值，加载全局：通过数组的使用一项项添加组成全局
    public void onBindViewHolder(News_Adapter.ViewHolder holder, int position) {
        News news=mnewsList.get(position);
//        holder.newsImage.setImageResource(news.getImageId());
//        在主函数使用自己添加的图片则用该项，使用网络图片用Glide（这样News类里面的image没有使用）
//        Glide.with(view).load(url.get(position)).into(holder.newsImage);
        Glide.with(view).load(R.drawable.default_launch_image).override(350,280).into(holder.newsImage);
        holder.newsText.setText(news.getName());
    }
    @Override
    public int getItemCount() {
        return mnewsList.size();
    }

}

5.编写主活动，按照总体思路进行；

package com.example.news;

import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import androidx.recyclerview.widget.DividerItemDecoration;

import android.os.Bundle;
import android.widget.LinearLayout;

import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
    private List<News>newsList=new ArrayList<>();
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //添加新闻数据，返回newList
        initNews();
        RecyclerView recyclerView =findViewById(R.id.recycler_view);
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(layoutManager);
        //可设置横向
        // layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
        //添加分割线
        recyclerView.addItemDecoration(new DividerItemDecoration(this,DividerItemDecoration.VERTICAL));
        //导入适配器
        News_Adapter adapter=new News_Adapter(newsList);
        recyclerView.setAdapter(adapter);
    }
    private void initNews()
    {
        for(int i=0;i<2;i++)
        {
            News t1 = new News("NewsTitle",R.drawable.ic_launcher_background);
            newsList.add(t1);
            News t2 = new News("NewsTitle",R.drawable.ic_launcher_background);
            newsList.add(t2);
            News t3 = new News("NewsTitle",R.drawable.ic_launcher_background);
            newsList.add(t3);
            News t4 = new News("NewsTitle",R.drawable.ic_launcher_background);
            newsList.add(t4);
            News t5 = new News("NewsTitle",R.drawable.ic_launcher_background);
            newsList.add(t5);
        }
    }
}

6.其中使用了顶层的横向滑动栏很简单不讲，又使用了Glide是用来给布局添加网络图片的，glide的使用想来想去还是放在了适配器中，在传输数据的时候使用其传图片给子布局，而不使用原来的调用类中的图片，需要就用，不需要就注释

7.解决依赖包

其他同理，百分百解决依赖包问题

来源：CSDN

作者：浪子SJ

链接：https://blog.csdn.net/qq_37887114/article/details/103875117

标签

recyclerview

glide