1. 程式人生 > >最強大的滾動控制元件————RecyclerView

最強大的滾動控制元件————RecyclerView

首先先接受另外一個相似的滾動控制元件的ListView ----

的的ListView控制元件的侷限性:

需要使用一些技巧來提升它的執行效率,否則效能會非常差;

 的ListView的控制元件中的只能實現縱向滾動,不能實現橫向滾動,以及網格和瀑布流佈局;

 

實現一個簡單的商鋪的外賣演示:

1.RecyclerView定義在支援庫中,首先需要在專案的的的的的build.gradle中新增依賴庫(方法之一):

依賴{    

實現fileTree(包括:['* .jar'],dir:'libs')    

實現 'com.android.support:appcompat-v7:27.1.1'    

實現 'com.android.support:recyclerview-v7:27.1.1'

}

 

2.首先理清設計的思路:

(1)編寫RV所在活動的佈局檔案

(2)編寫條目(專案)佈局檔案

(3)編寫條目所用資料的實體類

(4)定義介面卡(介面卡)類

(5)編寫RV所在活動


3.程式碼展示(核心部分)

(1)編寫RV所在活動的佈局文

    <android.support.v7.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/rv">
    </android.support.v7.widget.RecyclerView>

效果如圖:

 

(2)編寫條目(專案)佈局檔案

(按需設計佈局檔案)效果如下:

 

(3)編寫條目所用資料的實體類

這裡存放的是需要顯示的基礎資料

public class Msg {
    private int img_photo;//圖片
    private String distance;//距離
    private String dishName;//菜名
    private String monthlSale;//月售數量
    private String price;//價格
    
    //建構函式
    public Msg(int img_photo, String distance, String dishName, String monthlSale, String price) {
        this.img_photo = img_photo;
        this.distance = distance;
        this.dishName = dishName;
        this.monthlSale = monthlSale;
        this.price = price;
    }

    //setter 和 getter
    public int getImg_photo() {
        return img_photo;
    }

    public void setImg_photo(int img_photo) {
        this.img_photo = img_photo;
    }

    public String getDistance() {
        return distance;
    }

    public void setDistance(String distance) {
        this.distance = distance;
    }

    public String getDishName() {
        return dishName;
    }

    public void setDishName(String dishName) {
        this.dishName = dishName;
    }

    public String getMonthlSale() {
        return monthlSale;
    }

    public void setMonthlSale(String monthlSale) {
        this.monthlSale = monthlSale;
    }

    public String getPrice() {
        return price;
    }

    public void setPrice(String price) {
        this.price = price;
    }

}

 

(4)定義介面卡(介面卡)類

提示:設定物件,公共類MsgListAdaper擴充套件RecyclerView.Adapter <MsgListAdaper.ViewHolder>

package com.example.uirecycleview;

import android.support.annotation.NonNull;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import java.util.List;

public class MsgListAdaper extends RecyclerView.Adapter<MsgListAdaper.ViewHolder> {

    List<Msg> msgList;

    //介面卡建構函式
    //建構函式集合是集合msgList,它是RecyclerView資料的直接來源
    public MsgListAdaper (List<Msg> msgList){
        this.msgList =msgList;
    }

    //新建的內部類ViewHolder,檢視容器類,裝載的就是條目的控制元件
    class ViewHolder extends RecyclerView.ViewHolder{
        ImageView iv_photo;
        TextView tv_distance;
        TextView tv_dishName;
        TextView tv_monthlSale;
        TextView  tv_price;
        View itemview;//實現控制元件監聽

    //ViewHolder的建構函式,新建ViewHolder物件時必須對其內部控制元件賦值(控制元件繫結)
        public ViewHolder(View itemView){
            super(itemView);

        //條目中的id必須不為空,否則會崩潰(與佈局檔案匹配)
            this.itemview = itemview;  //itemview是本類物件
            iv_photo =itemView.findViewById(R.id.iv_photo);
            tv_distance = itemView.findViewById(R.id.tv_distance);
            tv_dishName = itemView.findViewById(R.id.tv_dishName);
            tv_price = itemView.findViewById(R.id.tv_price);
            tv_monthlSale = itemView.findViewById(R.id.tv_monthlSale);

        }
    }
    @NonNull
    @Override
       /*建立ViewHolder物件
        需要得到條目對應的View的物件*/
    public MsgListAdaper.ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
        //將佈局檔案完成View 填充
        View view = View.inflate(viewGroup.getContext(),R.layout.item_msglist,null);
        ViewHolder holder = new ViewHolder(view);
        return holder;
    }

    /*給ViewHolder中的控制元件設定資料(適配渲染資料到View中)
        資料獲取的方式是通過List下標->get方法*/
    @Override
    public void onBindViewHolder(@NonNull MsgListAdaper.ViewHolder viewHolder, int i) {

        Msg msg =msgList.get(i);
        viewHolder.iv_photo.setImageResource(msg.getImg_photo());
        viewHolder.tv_distance.setText(msg.getDistance());
        viewHolder.tv_dishName.setText(msg.getDishName());
        viewHolder.tv_price.setText(msg.getPrice());
        viewHolder.tv_monthlSale.setText(msg.getMonthlSale());

            viewHolder.itemview.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(v.getContext(), "你想點 "+msg.getDishName()+ " 外賣", Toast.LENGTH_SHORT).show();
            }
        });
    }

    /*獲取條目總數=集合元素個數*/
    @Override
    public int getItemCount() {
        return msgList.size();
    }
}

 

(5)編寫RV所在活動

package com.example.uirecycleview;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;

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

public class TOFMsgListActivity extends AppCompatActivity {

    RecyclerView rv;
    List<Msg> msgList =new ArrayList<>();//新建List用於資料儲存
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_tofmsg_list);

        RecyclerView rv = findViewById(R.id.rv);
        rv.setLayoutManager(new LinearLayoutManager(this));//這裡預設是垂直佈局

        initData();//初始化集合資料

        MsgListAdaper adaper = new MsgListAdaper(msgList); //將資料通過介面卡處理
        rv.setAdapter(adaper);
    }


    //進行資料測試
    private void initData() {
        for (int i =0;i<5;i++) {
            Msg msg = new Msg(R.drawable.crayfish, "123m", "麻辣小龍蝦", "月售:1000", "¥25");
            msgList.add(msg);

            msg = new Msg(R.drawable.duck, "100m", "北京燒鴨", "月售:1012", "¥50");
            msgList.add(msg);

            msg = new Msg(R.drawable.fish, "300m", "皖魚片", "月售:1150", "¥68");
            msgList.add(msg);

            msg = new Msg(R.drawable.pig, "154m", "紅燒豬耳", "月售:2100", "¥65");
            msgList.add(msg);

            msg = new Msg(R.drawable.pigfoot, "200m", "紅燒豬蹄", "月售:560", "¥45");
            msgList.add(msg);
        }
    }
}

 

4.效果顯示(未實現控制元件監聽)

 

吐司顯示(實現控制元件監聽)