一:RecyclerView控件
二:LayoutManager
方法的具体属性,将鼠标放在该方法上,按ctrl+alt+B,进入到该方法进行查看
三:数据适配器
备注:三和四图片来源于[来自这里]
四:运行效果
五:流程与思路
六:创建recycler_item布局(item布局代码)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_marginTop="5dp"
android:layout_marginLeft="10dp"
android:id="@+id/iv"
android:layout_width="120dp"
android:layout_height="90dp"
android:src="@drawable/siberiankusky" />
<RelativeLayout
android:layout_marginTop="5dp"
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:textSize="20sp"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:textColor="#000"
android:textStyle="bold"
android:id="@+id/name"
android:text="哈士奇"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_marginTop="5dp"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:textColor="#000"
android:textSize="15sp"
android:ellipsize="end"
android:maxLines="2"
android:id="@+id/introduce"
android:layout_below="@id/name"
android:text="西伯利亚雪橇犬,常见别名哈士奇,昵称为二哈。"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</LinearLayout>
效果:
七:主界面布局代码
<?xml version="1.0" encoding="utf-8"?>
<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=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recylerView_1"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
效果:
八:后端代码
package cn.cg.recyclerview;
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.GridLayoutManager;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import androidx.recyclerview.widget.StaggeredGridLayoutManager;
public class MainActivity extends AppCompatActivity {
private RecyclerView mRecyclerView;
private HomeAdapter mAdapter;
//定义name数据
private String[] names = { "小猫", "哈士奇", "小黄鸭","小鹿","老虎"};
//定义图片数据,对应图片ID
private int[] icons= { R.drawable.cat,R.drawable.siberiankusky,
R.drawable.yellowduck,R.drawable.fawn, R.drawable.tiger, };
//定义简介
private String[] introduces = {
"猫,属于猫科动物,分家猫、野猫,是全世界家庭中较为广泛的宠物。",
"西伯利亚雪橇犬,常见别名哈士奇,昵称为二哈。",
"鸭的体型相对较小,颈短,一些属的嘴要大些。腿位于身体后方,因而步态蹒跚。",
"鹿科是哺乳纲偶蹄目下的一科动物。体型大小不等,为有角的反刍类。",
"虎,大型猫科动物;毛色浅黄或棕黄色,满有黑色横纹;头圆、耳短,耳背面黑色,中央有一白斑甚显著;四肢健壮有力;尾粗长,具黑色环纹,尾端黑色。"
};
@SuppressLint("WrongConstant")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//【1】获取RecyclerView 控件ID
mRecyclerView= findViewById(R.id.recylerView_1);
//【2】设置显示形式
//布局
mRecyclerView.setLayoutManager(new LinearLayoutManager(this));//竖值
//网格
// mRecyclerView.setLayoutManager(new GridLayoutManager(this,5));//网格
//瀑布流
//mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(5,LinearLayoutManager.HORIZONTAL));
//【3】创建数据适配器
mAdapter=new HomeAdapter();
//【4】设置RecyclerView 的数据适配器
mRecyclerView.setAdapter(mAdapter);
}
//【3.1】(自定义数据适配器)继承RecyclerView.Adapter类
class HomeAdapter extends RecyclerView.Adapter<HomeAdapter.MyViewHolder>{
//返回自定义MyViewHolder对象
@NonNull
@Override
public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
//创建视图,对应recycler_item类
View view= LayoutInflater.from(MainActivity.this).inflate(R.layout.recycler_item,parent,false);
//返回自定义MyViewHolder视图
MyViewHolder holder=new MyViewHolder(view);
return holder;
}
//给recycler_item布局上相应控价赋值
@Override
public void onBindViewHolder(@NonNull MyViewHolder holder, int position) {
holder.name.setText(names[position]);
holder.introduce.setText(introduces[position]);
holder.iv.setImageResource(icons[position]);
}
//获取总数
@Override
public int getItemCount() {
return names.length;
}
//【3.2】(自定义ViewHolder类)继承RecyclerView.ViewHolder类
class MyViewHolder extends RecyclerView.ViewHolder{
//对应recycler_item里的姓名
TextView name;
//对应recycler_item里的简介
TextView introduce;
//对应recycler_item里的图片
ImageView iv;
public MyViewHolder(View itemView){
super(itemView);
name=itemView.findViewById(R.id.name);
introduce=itemView.findViewById(R.id.introduce);
iv=itemView.findViewById(R.id.iv);
}
}
}
}
九:项目中使用的图片