RecyclerView完善類微信開發主界面

前言

接上一篇blog
上一次完成了程序的頁面的基本佈局以及頁面之間的切換，這一篇blog將利用RecyclerView完成其中一個tab界面的簡單佈局🎉

附上gitee上的項目鏈接🎈

• 鏈接: Gitee上發佈的項目

背景介紹

1. 開發工具 ：Android Studio；
2. tab佈局使用技術 ：RecyclerView；
3. tab佈局 ：頂部懸浮（吸頂）

開發參考

1. Android開發官方文檔 ：
   鏈接: RecyclerView官方文檔介紹.
2. RecyclerView 使用方法總結 ：
   鏈接: RecyclerView 使用方法總結.

RecyclerView中的內容

我選擇頂部懸浮的佈局按照年份將張藝興LAY的年度發展總結進行展示

項目運行效果截圖

我Gitee上的項目🎈

鏈接: Gitee上發佈的項目

項目核心代碼🔑

1. Adapter部分代碼：

	public void onBindViewHolder(@NonNull StickyViewHolder holder, int position) {
        StickyData stickyData = mList.get(position);

        holder.tvTeam.setText(stickyData.getTeam());

        if (position == 0) {
            holder.tvArea.setVisibility(View.VISIBLE);
            holder.tvArea.setText(stickyData.area);
            holder.itemView.setTag(FIRST_STICKY_VIEW);
        } else {
            if (!TextUtils.equals(stickyData.area, mList.get(position - 1).area)) {
                holder.tvArea.setVisibility(View.VISIBLE);
                holder.tvArea.setText(stickyData.area);
                holder.itemView.setTag(HAS_STICKY_VIEW);
            } else {
                holder.tvArea.setVisibility(View.GONE);
                holder.itemView.setTag(NONE_STICKY_VIEW);
            }
        }
        holder.itemView.setContentDescription(stickyData.area);
    }

    @Override
    public int getItemCount() {
        return mList == null ? 0 : mList.size();
    }

    public class StickyViewHolder extends RecyclerView.ViewHolder {

        TextView tvArea, tvTeam;

        public StickyViewHolder(View itemView) {
            super(itemView);
            tvArea = itemView.findViewById(R.id.tv_sticky_header_view);
            tvTeam = itemView.findViewById(R.id.tv_team);
        }
    }

2. 獲取數據函數：

public class StickyData {

    public String year;

    public String trend;

    public String getYear() {
        return year;
    }

    public void setYear(String year) {
        this.year = year;
    }

    public String getTrend() {
        return trend;
    }

    public void setTeam(String trend) {
        this.trend = trend;
    }
}

3. 按鈕點擊事件：

public void onClick(View v){//點擊響應
        resetimg();
        switch (v.getId()){
            case R.id.id_tab_weixin:
                selectfragment(0);
                break;
            case R.id.id_tab_friend:
                selectfragment(1);
                break;
            case R.id.id_tab_contact:
                selectfragment(2);
                break;
            case R.id.id_tab_settings:
                selectfragment(3);
                break;
            default:
                break;
        }
}

4. 屏幕滾動監聽函數：

rcvSticky.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                super.onScrolled(recyclerView, dx, dy);
                View stickyInfoView = recyclerView.findChildViewUnder(
                        tvArea.getMeasuredWidth() / 2, 5);
                if (stickyInfoView != null && stickyInfoView.getContentDescription() != null) {
                    tvArea.setText(String.valueOf(stickyInfoView.getContentDescription()));
                }
                View transInfoView = recyclerView.findChildViewUnder(
                        tvArea.getMeasuredWidth() / 2, tvArea.getMeasuredHeight() + 1);
                if (transInfoView != null && transInfoView.getTag() != null) {
                    int transViewStatus = (int) transInfoView.getTag();
                    int dealtY = transInfoView.getTop() - tvArea.getMeasuredHeight();
                    if (transViewStatus == StickyAdapter.HAS_STICKY_VIEW) {
                        if (transInfoView.getTop() > 0) {
                            tvArea.setTranslationY(dealtY);
                        } else {
                            tvArea.setTranslationY(0);
                        }
                    } else if (transViewStatus == StickyAdapter.NONE_STICKY_VIEW) {
                        tvArea.setTranslationY(0);
                    }
                }
            }
        });

遇到的問題及解決方法❗

1. Xml佈局文件：android studio在XML預覽中出現Rendering Problems問題
   解決方法：
   ①在styles.xml裏的

<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">

原來是沒有Base的，加上那個問題就沒了；
②佈局文件預覽那裏的API調到21以下。

2. 關於RecyclerView的位置：起初我一直將RecyclerView放在tab01中，可是在預覽時界面一直加載不出來，後來我將RecyclerView放在activity_main.xml中就可以正常顯示。

項目總結✔

第一次接觸RecyclerView，寫的時候還不是很熟練，但是adapter中的函數邏輯還比較簡單，大致是onBindViewHolder、getItemCount兩個函數，在本次項目中，我只是寫了靜態數據，沒有采取從網址獲取數據，只是實現了簡單的佈局，而且最後的效果好像還不夠理想，下面的button不見了😒…還有待完善。