RecycleView + CardView 控件简析

今天使用了V7包加入的RecycleView 和 CardView，写篇简析。

先上效果图：

原理图：

这是RecycleView的工作原理：

1.LayoutManager用来处理RecycleView的“列表”样式，Support包默认包含了：LinearLayoutManager  横向或纵向的滚动列表、

GridLayoutManager  网格列表、StaggeredGridLayoutManager  交错的网格列表。

2.Adapter负责处理RecycleView的数据和样式

3.在传统的ListView中有一种常见的写法是使用ViewHolder来缓存数据集，在新版的RecycleView内置了ViewHolder这一模块，所以在Adapter内部新建内部类ViewHolder。

4.RecycleView 和listView的一个区别就是本身不处理点击事件，点击事件应该绑在ViewHolder里面，可以直接写也可以通过接口绑在Adapter里面来实现。

 

 首先添加数据集：

 1 package com.lfk.drawapictiure.Info;
 2 
 3 /**
 4  * Created by liufengkai on 15/9/13.
 5  */
 6 public class MenuInfo {
 7     private String paint_name;
 8     private String paint_time;
 9     private String paint_root;
10     private String paint_img_root;
11 
12     public MenuInfo(String paint_name, String paint_time,
13                     String paint_root, String paint_img_root) {
14         this.paint_name = paint_name;
15         this.paint_time = paint_time;
16         this.paint_root = paint_root;
17         this.paint_img_root = paint_img_root;
18     }
19 
20     public String getPaint_name() {
21         return paint_name;
22     }
23 
24     public String getPaint_time() {
25         return paint_time;
26     }
27 
28     public String getPaint_root() {
29         return paint_root;
30     }
31 
32     public String getPaint_img_root() {
33         return paint_img_root;
34     }
35 }

 

实现继承自RecycleView的Adapter中间要包裹自己实现的ViewHolder，onCreateviewHolder函数和onBindViewHolder实现了ListView里面getView的工作，分别为找到控件和控件赋值，

实现点击的接口，设置接口并且绑在ViewHolder的itemView里面即根视图中。

 1 public class MainLayoutAdapter extends RecyclerView.Adapter<MainLayoutAdapter.MainViewHolder> {
 2     private LayoutInflater inflater;
 3     private ArrayList<MenuInfo> userList;
 4     private Context context;
 5     private MainItemClickListener itemClickListener;
 6 
 7     public MainLayoutAdapter(ArrayList<MenuInfo> userList, Context context) {
 8         this.userList = userList;
 9         this.context = context;
10         this.inflater = LayoutInflater.from(context);
11     }
12 
13     public void setItemClickListener(MainItemClickListener itemClickListener) {
14         this.itemClickListener = itemClickListener;
15     }
16 　　//onCreateviewHolder函数和onBindViewHolder实现了ListView里面getView的工作，分别为找到控件和控件赋值
17     @Override
18     public MainLayoutAdapter.MainViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
19         View wrapper = inflater.inflate(R.layout.draw_item, parent, false);
20         return new MainViewHolder(
21                 wrapper,
22                 (TextView)wrapper.findViewById(R.id.paint_name),
23                 (TextView)wrapper.findViewById(R.id.paint_time),
24                 (TextView)wrapper.findViewById(R.id.paint_root),
25                 (ImageView)wrapper.findViewById(R.id.paint_img));
26     }
27 
28     @Override
29     public void onBindViewHolder(MainViewHolder holder, int position) {
30         MenuInfo menuInfo = userList.get(position);
31         holder.paint_img.setImageURI(Uri.parse(menuInfo.getPaint_img_root()));
32         holder.paint_name.setText(menuInfo.getPaint_name());
33         holder.paint_time.setText(menuInfo.getPaint_time());
34         holder.paint_root.setText(menuInfo.getPaint_root());
35     }
36 
37 
38     @Override
39     public int getItemCount() {
40         return userList.size();
41     }
42 
43     public class MainViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener,View.OnLongClickListener{
44         private TextView paint_name;
45         private TextView paint_time;
46         private TextView paint_root;
47         private ImageView paint_img;
48         public MainViewHolder(View itemView, TextView paint_name,
49                           TextView paint_time, TextView paint_root,
50                           ImageView paint_img) {
51             super(itemView);
52             itemView.setOnClickListener(this);
53             this.paint_name = paint_name;
54             this.paint_time = paint_time;
55             this.paint_root = paint_root;
56             this.paint_img = paint_img;
57         }
58 
59         @Override
60         public void onClick(View view) {
61             MenuInfo menuInfo = userList.get(getAdapterPosition());
62             itemClickListener.onItemClick(view,menuInfo.getPaint_name(),menuInfo.getPaint_root());
63         }
64 
65         @Override
66         public boolean onLongClick(View view) {
67             return false;
68         }
69     }
70 }

 

Activity中的使用：

 1 package com.lfk.drawapictiure.Fragment;
 2 
 3 import android.content.Intent;
 4 import android.net.Uri;
 5 import android.os.Bundle;
 6 import android.os.Environment;
 7 import android.support.v7.widget.LinearLayoutManager;
 8 import android.support.v7.widget.RecyclerView;
 9 import android.view.LayoutInflater;
10 import android.view.View;
11 import android.view.ViewGroup;
12 
13 import com.lfk.drawapictiure.Adapter.MainLayoutAdapter;
14 import com.lfk.drawapictiure.Info.MenuInfo;
15 import com.lfk.drawapictiure.InterFace.MainItemClickListener;
16 import com.lfk.drawapictiure.MainActivity;
17 import com.lfk.drawapictiure.R;
18 
19 import java.util.ArrayList;
20 
21 
22 public class PaintFragment extends android.support.v4.app.Fragment {
23     private RecyclerView mRecyclerView;
24     private MainLayoutAdapter mAdapter;
25     private RecyclerView.LayoutManager mLayoutManager;
26     private String path = Environment.getExternalStorageDirectory().getPath() + "/DrawAPicture";
27 
28     public static PaintFragment newInstance() {
29         return new PaintFragment();
30     }
31 
32     public PaintFragment() {
33         // Required empty public constructor
34     }
35 
36     @Override
37     public void onCreate(Bundle savedInstanceState) {
38         super.onCreate(savedInstanceState);
39 
40     }
41 
42     @Override
43     public View onCreateView(LayoutInflater inflater, ViewGroup container,
44                              Bundle savedInstanceState) {
45         View wrapper = inflater.inflate(R.layout.fragment_paint, container, false);
46         mRecyclerView = (RecyclerView)wrapper.findViewById(R.id.paint_recycle_view);
47         mLayoutManager = new LinearLayoutManager(getActivity());
48         mRecyclerView.setLayoutManager(mLayoutManager); //绑上列表管理器
49         ArrayList<MenuInfo> arrayList = new ArrayList<>();
50         arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
51         arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
52         arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
53         arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
54         mAdapter = new MainLayoutAdapter(arrayList, getActivity());
　　　　　　// 设置点击事件
55         mAdapter.setItemClickListener(new MainItemClickListener() {
56             @Override
57             public void onItemClick(View view, String name, String path) {
58                 Intent intent = new Intent(getActivity(), MainActivity.class);
59                 intent.setData(Uri.parse(path));
60                 startActivity(intent);
61             }
62         });
　　　　　　//绑定数据集
63         mRecyclerView.setAdapter(mAdapter);
64 
65         return wrapper;
66     }
67 
68 
69 }

 

其中的子布局使用了CardView:

我设置的东西只有： 

card_view:cardCornerRadius="4dp"  //设定圆角半径

card_view:cardElevation="8dp"//设定阴影

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <android.support.v7.widget.CardView
 3     xmlns:android="http://schemas.android.com/apk/res/android"
 4     xmlns:card_view="http://schemas.android.com/apk/res-auto"
 5     android:background="@drawable/list_item_selector"
 6     android:layout_width="match_parent"
 7     android:layout_height="wrap_content"
 8     card_view:cardCornerRadius="4dp"
　　　　card_view:
 9     android:layout_margin="@dimen/card_margin">
10     <RelativeLayout
11         android:layout_marginTop="16dp"
12         android:layout_marginLeft="16dp"
13         android:layout_marginRight="16dp"
14         android:layout_marginBottom="16dp"
15         android:layout_width="match_parent"
16         android:layout_height="wrap_content">
17         <ImageView
18             android:maxHeight="100dp"
19             android:layout_marginTop="8dp"
20             android:layout_below="@+id/line_view"
21             android:layout_width="match_parent"
22             android:layout_height="wrap_content"
23             android:id="@+id/paint_img"
24             android:src="@mipmap/ic_launcher" />
25         <TextView
26             android:id="@+id/paint_name"
27             android:textColor="#000"
28             android:textSize="18sp"
29             android:text="项目名"
30             android:layout_alignParentRight="true"
31             android:singleLine="true"
32             android:layout_width="wrap_content"
33             android:layout_height="wrap_content" />
34         <TextView
35             android:id="@+id/paint_time"
36             android:text="项目时间"
37             android:textColor="@color/black"
38             android:textSize="18sp"
39             android:singleLine="true"
40             android:layout_width="wrap_content"
41             android:layout_height="wrap_content" />
42         <View
43             android:id="@+id/line_view"
44             android:background="@color/gray"
45             android:layout_below="@+id/paint_time"
46             android:layout_width="match_parent"
47             android:layout_height="1dp"/>
48         <TextView
49             android:id="@+id/paint_root"
50             android:visibility="invisible"
51             android:layout_width="wrap_content"
52             android:layout_height="wrap_content" />
53     </RelativeLayout>
54 
55 </android.support.v7.widget.CardView>

 

  这只是第一篇继续使用过程中发现新特性还会更新！