Android实战—RecycleView使用（二）

一、项目地址

  https://gitee.com/lonelyZhe/Android-wechat/tree/branch1

二、项目目标：

1. 能够使用RecycleView控件布局
2. 实现微信首页消息列表
   

三、项目结构

四、主要代码

1. Item.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"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/item"
    android:layout_width="match_parent"
    android:layout_height="68dp"
    android:background="@drawable/underline"
    android:orientation="horizontal">

    <!-- 头像 -->
    <ImageView
        android:id="@+id/headImg"
        android:layout_width="61dp"
        android:layout_height="52dp"
        android:layout_margin="8dp"

        />
    <!-- 用户名和消息的布局 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TextView
            android:id="@+id/textView10"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="6dp"
            android:layout_weight="1"
            android:gravity="left"
            android:text="TextView"
            android:textColor="#000000"
            android:textSize="20sp" />

        <TextView
            android:id="@+id/textView6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_marginBottom="5dp"
            android:text="TextView" />
    </LinearLayout>

</LinearLayout>

2. tab01.xml
   首页中加入RecyclerView控件

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

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

3. adapter.java
   最重要的一部分，绑定控件与数据

package com.lonelyzhe.wechat;

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

import java.util.List;

public class adapter extends RecyclerView.Adapter<adapter.myviewholder> {

    private  List<String> list;
    private  List<Integer> headList;
    private  List<String> message;
    private Context context;
    private View inflater;

    public adapter(Context context, List<String> list, List<Integer> headList, List<String> message) {
        this.list = list;
        this.context = context;
        this.headList = headList;
        this.message = message;
    }

    @Override
    public adapter.myviewholder onCreateViewHolder(ViewGroup viewGroup, int i) {
        //找到item行标
        inflater = LayoutInflater.from(context).inflate(R.layout.item, viewGroup, false);
        myviewholder myviewholder = new myviewholder(inflater);
        return myviewholder;
    }

    @Override
    public void onBindViewHolder(adapter.myviewholder myviewholder, int i) {
        //建立映射
        myviewholder.textView.setText(list.get(i));
        myviewholder.headImg.setImageResource(headList.get(i));
        myviewholder.msgViex.setText(message.get(i));
    }

    @Override
    public int getItemCount() {
        return list.size();
    }

    //绑定相应控件
    class myviewholder extends RecyclerView.ViewHolder{
        TextView textView;
        ImageView headImg;
        TextView msgViex;
        public myviewholder( View itemView) {
            super(itemView);
            textView = itemView.findViewById(R.id.textView10);
            headImg = itemView.findViewById(R.id.headImg);
            msgViex = itemView.findViewById(R.id.textView6);
        }
    }
}

4. WeiXingFragment.java
   在这里绑定数据

package com.lonelyzhe.wechat;


import android.content.Context;
import android.os.Bundle;
import android.app.Fragment;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import java.util.ArrayList;
import java.util.Comparator;
import java.util.List;
import java.util.Map;
import java.util.TreeMap;


/**
 * A simple {@link Fragment} subclass.
 */
public class WeixinFragment extends Fragment {

    private View view;
    //定义需要显示的值
    private RecyclerView recyclerView;
    private List<String> list;  //用户名
    private List<String> message;  //消息
    private List<Integer> headList;  //头像
    private Context context;
    private adapter adapter;


    public WeixinFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        view = inflater.inflate(R.layout.tab01, container, false);
        recyclerView = view.findViewById(R.id.recyclerview);
        return view;
    }

    @Override
    public void onActivityCreated( Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);

        context = (MainActivity)getActivity();

        initData();

        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(context);

        linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);

        adapter = new adapter(context,list,headList,message);

        recyclerView.setAdapter(adapter);
        recyclerView.setLayoutManager(linearLayoutManager);
    }

    void initData(){
        list = new ArrayList<>();
        headList = new ArrayList<>();
        message = new ArrayList<>();
        Map<Integer, String> map = new TreeMap<>(new Comparator<Integer>() {
            @Override
            public int compare(Integer o1, Integer o2) {
                return o1.compareTo(o2);
            }
        });
        Map<Integer, String> msgMap = new TreeMap<>(new Comparator<Integer>() {
            @Override
            public int compare(Integer o1, Integer o2) {
                return o1.compareTo(o2);
            }
        });

        // 初始化数据
        map.put(R.drawable.lonelyzhe, "lonely喆");
        msgMap.put(R.drawable.lonelyzhe, "RecyclerView真好用!");
        map.put(R.drawable.chuxin, "初心");
        msgMap.put(R.drawable.chuxin, "好想回学校呀");
        map.put(R.drawable.xing_kong, "星空");
        msgMap.put(R.drawable.xing_kong, "为啥有时候R找不到文件？");
        map.put(R.drawable.ohne, "Ohne");
        msgMap.put(R.drawable.ohne, "圆角怎么那么难设置呀！");
        map.put(R.drawable.dali, "大力");
        msgMap.put(R.drawable.dali, "在吗？");

        for (Integer key : map.keySet()){
            headList.add(key);
            list.add(map.get(key));
            message.add(msgMap.get(key));
        }

    }
}

五、遇到的问题及解决方案

1. 问题1：导入Recycler依赖包
   a. 默认情况下是没有导入RecycleView的依赖的，可以手动添加依赖

implementation 'com.android.support:recyclerview-v7:28.0.0'

  b. 也可以随便一个layout页面拉一个RecyclerView控件，会提示是否导入依赖包，点确定即可

  2. 问题2：给LinearLayout加下边框
   a.在drawable文件夹中创建文件underline.xml

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <!-- 连框颜色值 -->
    <item>
        <shape>
            <solid android:color="#dddddd" />
        </shape>
    </item>
    <!-- 主体背景颜色值 -->
    <item android:bottom="1dp"> <!--设置只有底部有边框-->
        <shape>
            <solid android:color="#ffffff" />
        </shape>
    </item>
</layer-list>

   a.在LinearLayout样式中引用

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/item"
    android:layout_width="match_parent"
    android:layout_height="64dp"
    android:background="@drawable/underline"
    android:orientation="vertical">

  3. 问题3：导入图片问题
   a. drawable文件夹中创建不了自己的文件夹，且资源文件的命名只能是小写字母加下划线