AndRoid--RecyclerView的使用

一: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);
            }
        }
    }
}

九:項目中使用的圖片