Android 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里面来实现。

首先添加数据集:

package com.lfk.drawapictiure.Info;

/**
 * Created by liufengkai on 15/9/13.
 */
public class MenuInfo {
    private String paint_name;
    private String paint_time;
    private String paint_root;
    private String paint_img_root;

    public MenuInfo(String paint_name, String paint_time,
                    String paint_root, String paint_img_root) {
        this.paint_name = paint_name;
        this.paint_time = paint_time;
        this.paint_root = paint_root;
        this.paint_img_root = paint_img_root;
    }

    public String getPaint_name() {
        return paint_name;
    }

    public String getPaint_time() {
        return paint_time;
    }

    public String getPaint_root() {
        return paint_root;
    }

    public String getPaint_img_root() {
        return paint_img_root;
    }
}

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

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

public class MainLayoutAdapter extends RecyclerView.Adapter<MainLayoutAdapter.MainViewHolder> {
    private LayoutInflater inflater;
    private ArrayList<MenuInfo> userList;
    private Context context;
    private MainItemClickListener itemClickListener;

    public MainLayoutAdapter(ArrayList<MenuInfo> userList, Context context) {
        this.userList = userList;
        this.context = context;
        this.inflater = LayoutInflater.from(context);
    }

    public void setItemClickListener(MainItemClickListener itemClickListener) {
        this.itemClickListener = itemClickListener;
    }
  //onCreateviewHolder函数和onBindViewHolder实现了ListView里面getView的工作,分别为找到控件和控件赋值
    @Override
    public MainLayoutAdapter.MainViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View wrapper = inflater.inflate(R.layout.draw_item, parent, false);
        return new MainViewHolder(
                wrapper,
                (TextView)wrapper.findViewById(R.id.paint_name),
                (TextView)wrapper.findViewById(R.id.paint_time),
                (TextView)wrapper.findViewById(R.id.paint_root),
                (ImageView)wrapper.findViewById(R.id.paint_img));
    }

    @Override
    public void onBindViewHolder(MainViewHolder holder, int position) {
        MenuInfo menuInfo = userList.get(position);
        holder.paint_img.setImageURI(Uri.parse(menuInfo.getPaint_img_root()));
        holder.paint_name.setText(menuInfo.getPaint_name());
        holder.paint_time.setText(menuInfo.getPaint_time());
        holder.paint_root.setText(menuInfo.getPaint_root());
    }

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

    public class MainViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener,View.OnLongClickListener{
        private TextView paint_name;
        private TextView paint_time;
        private TextView paint_root;
        private ImageView paint_img;
        public MainViewHolder(View itemView, TextView paint_name,
                          TextView paint_time, TextView paint_root,
                          ImageView paint_img) {
            super(itemView);
            itemView.setOnClickListener(this);
            this.paint_name = paint_name;
            this.paint_time = paint_time;
            this.paint_root = paint_root;
            this.paint_img = paint_img;
        }

        @Override
        public void onClick(View view) {
            MenuInfo menuInfo = userList.get(getAdapterPosition());
            itemClickListener.onItemClick(view,menuInfo.getPaint_name(),menuInfo.getPaint_root());
        }

        @Override
        public boolean onLongClick(View view) {
            return false;
        }
    }
}

Activity中的使用:

package com.lfk.drawapictiure.Fragment;

import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.os.Environment;
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 com.lfk.drawapictiure.Adapter.MainLayoutAdapter;
import com.lfk.drawapictiure.Info.MenuInfo;
import com.lfk.drawapictiure.InterFace.MainItemClickListener;
import com.lfk.drawapictiure.MainActivity;
import com.lfk.drawapictiure.R;

import java.util.ArrayList;

public class PaintFragment extends android.support.v4.app.Fragment {
    private RecyclerView mRecyclerView;
    private MainLayoutAdapter mAdapter;
    private RecyclerView.LayoutManager mLayoutManager;
    private String path = Environment.getExternalStorageDirectory().getPath() + "/DrawAPicture";

    public static PaintFragment newInstance() {
        return new PaintFragment();
    }

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

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

    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View wrapper = inflater.inflate(R.layout.fragment_paint, container, false);
        mRecyclerView = (RecyclerView)wrapper.findViewById(R.id.paint_recycle_view);
        mLayoutManager = new LinearLayoutManager(getActivity());
        mRecyclerView.setLayoutManager(mLayoutManager); //绑上列表管理器
        ArrayList<MenuInfo> arrayList = new ArrayList<>();
        arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
        arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
        arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
        arrayList.add(new MenuInfo("刘丰恺","09-13 05:28",path+"/"+"12138.lfk",path+"/"+"6826.jpg"));
        mAdapter = new MainLayoutAdapter(arrayList, getActivity());
      // 设置点击事件
        mAdapter.setItemClickListener(new MainItemClickListener() {
            @Override
            public void onItemClick(View view, String name, String path) {
                Intent intent = new Intent(getActivity(), MainActivity.class);
                intent.setData(Uri.parse(path));
                startActivity(intent);
            }
        });
      //绑定数据集
        mRecyclerView.setAdapter(mAdapter);

        return wrapper;
    }

}

其中的子布局使用了CardView:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:background="@drawable/list_item_selector"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardCornerRadius="4dp"
    card_view:
    android:layout_margin="@dimen/card_margin">
    <RelativeLayout
        android:layout_marginTop="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginBottom="16dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <ImageView
            android:maxHeight="100dp"
            android:layout_marginTop="8dp"
            android:layout_below="@+id/line_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/paint_img"
            android:src="@mipmap/ic_launcher" />
        <TextView
            android:id="@+id/paint_name"
            android:textColor="#000"
            android:textSize="18sp"
            android:text="项目名"
            android:layout_alignParentRight="true"
            android:singleLine="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/paint_time"
            android:text="项目时间"
            android:textColor="@color/black"
            android:textSize="18sp"
            android:singleLine="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <View
            android:id="@+id/line_view"
            android:background="@color/gray"
            android:layout_below="@+id/paint_time"
            android:layout_width="match_parent"
            android:layout_height="1dp"/>
        <TextView
            android:id="@+id/paint_root"
            android:visibility="invisible"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </RelativeLayout>

</android.support.v7.widget.CardView>

我设置的东西只有:

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

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

时间: 2024-10-25 09:43:09

Android RecycleView + CardView 控件简析的相关文章

RecycleView + CardView 控件简析

今天使用了V7包加入的RecycleView 和 CardView,写篇简析. 先上效果图: 原理图: 这是RecycleView的工作原理: 1.LayoutManager用来处理RecycleView的“列表”样式,Support包默认包含了:LinearLayoutManager  横向或纵向的滚动列表. GridLayoutManager  网格列表.StaggeredGridLayoutManager  交错的网格列表. 2.Adapter负责处理RecycleView的数据和样式 3

Flutter样式和布局控件简析(二)

开始 继续接着分析Flutter相关的样式和布局控件,但是这次内容难度感觉比较高,怕有分析不到位的地方,所以这次仅仅当做一个参考,大家最好可以自己阅读一下代码,应该会有更深的体会. Sliver布局 Flutter存在着两大布局体系(就目前分析),一个是Box布局,还有另外一个就是Sliver布局:但是Sliver布局明显比Box会更加复杂,这真是一个坎,那么为啥说Sliver更加复杂尼,请看一下对比:首先是Box布局,主要看输入的BoxConstraints(约束)和输出Size(尺寸) cl

【转】Android M新控件之FloatingActionButton,TextInputLayout,Snackbar,TabLayout的使用

Android M新控件之FloatingActionButton,TextInputLayout,Snackbar,TabLayout的使用 分类: Android UI2015-06-15 16:44 1145人阅读 评论(5) 收藏 举报 MaterialDesingsupportlibrary 目录(?)[-] 前提 FloatingActionButton TextInputLayout Snackbar的使用 TabLayout [转载请注明出处:http://blog.csdn.n

Android中用seekbar控件控制歌曲的进度

本人菜鸟一枚,在编写android中用seekbar控件控制歌曲的进度和seekbar随着歌曲的播放自动运动的程序有一些自己的见解,希望各位大牛们多多指点······ 废话先不多说了,先贴一张程序的图吧: 界面不怎么好看,没经过美化,大家将就这看一下吧. 主要思路是运用线程每隔一秒显示一下seekbar控件所在的位置,(这个是使进度条随着歌曲的进度而不断的变化,如果大家想使进度条增加的更连续,可以改变程序循环运行的时间,使其更快) 我只把关于seekbar的程度拿出来了: private int

android学习五(android中基本控件的使用)

前面已经学了activity的一些使用,那么下面我们进行android中基本的控件的学习和使用. 1.android中的TextView控件 新建一个项目,项目名为UITest,才有默认的设置,修改布局文件的内容,如下: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" a

【ANDROID 初学】控件--IMAGEVIEW的使用方法

Start Android 1.图片视图(ImageView)的基本概念 2.<InameView/>与ImageView 3.神奇的ScaleType属性 当图片大小与ImageView大小不匹配的时候,可以通过该属性来调整图片与ImageView控件的位置关系. android:scaleType:  android:scaleType是控制图片如何resized/moved来匹对ImageView的size. ImageView.ScaleType / android:scaleType

Android 遍历界面控件

//遍历界面上的控件 fubin.pan LinearLayout sLinerLayout = (LinearLayout)findViewById(R.id.layout_scr); for (int i = 0; i < sLinerLayout.getChildCount(); i++) { View v=sLinerLayout.getChildAt(i); if ( v instanceof RadioGroup){ RadioGroup mRadioGroup = (RadioGr

Android 中常见控件的介绍和使用

1 TextView文本框 1.1 TextView类的结构 TextView 是用于显示字符串的组件,对于用户来说就是屏幕中一块用于显示文本的区域.TextView类的层次关系如下: java.lang.Object   ? android.view.View   ? android.widget.TextView 直接子类: Button, CheckedTextView, Chronometer, DigitalClock, EditText 间接子类: AutoCompleteTextV

Android两个控件叠在一起,如何让被挡住的控件显示出来

Android两个控件叠在一起,如何让被挡住的控件显示出来 问题 : 两个控件叠在一起,如何让被挡住的控件显示出来? 比如A,B两个控件,A被B挡住,目前A要显示出来,B不能被隐藏,A的高度只有那么一点,显示出来的时候,B不能隐藏. 其实很简单 A.bringToFront即可.