RecyclerView与CardView的基础使用
2017-07-11 本文已影响50人
Scorpio_青牙
本文主要介绍RecyclerView和CardView的基础使用，首先说下RecyclerView实现ListView、GridView和瀑布流的功能，其次谈下RecyclerView与CardView的结合使用。
在build.gradle中添加依赖
compile 'com.android.support:recyclerview-v7:25.0.1'
compile 'com.android.support:cardview-v7:25.0.1'
基本使用方法
RecyclerView的xml布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary">
<android.support.v7.widget.RecyclerView
android:id="@+id/swipe_target"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/C_E2E4E4"
android:scrollbars="none"/>
</RelativeLayout>
1.作为ListView使用
//数据源
lists = new ArrayList<String>();
mRecyclerView = (RecyclerView)findViewById(R.id.swipe_target);
//创建默认的线性LayoutManager
mLayoutManager = new LinearLayoutManager(this);
mRecyclerView.setLayoutManager(mLayoutManager);
//如果可以确定每个item的高度是固定的，设置这个选项可以提高性能
mRecyclerView.setHasFixedSize(true);
//创建并设置Adapter
mAdapter = new ItemAdapter(this, lists);
mRecyclerView.setAdapter(mAdapter);
2.作为GridView使用
//数据源
lists = new ArrayList<String>();
mRecyclerView = (RecyclerView)findViewById(R.id.swipe_target);
//创建默认的GridLayoutManager
mLayoutManager = new GridLayoutManager(this, 2);
mRecyclerView.setLayoutManager(mLayoutManager);
//如果可以确定每个item的高度是固定的，设置这个选项可以提高性能
mRecyclerView.setHasFixedSize(true);
//创建并设置Adapter
mAdapter = new ItemAdapter(this, lists);
mRecyclerView.setAdapter(mAdapter);
RecyclerView作为Listview、GridView使用的Adapter
public class ItemAdapter extends RecyclerView.Adapter<ItemAdapter.ItemViewHolder> implements View.OnClickListener, View.OnLongClickListener {
private Context mContext;
private List<String> datas = null;
public ItemAdapter(Context context, List<String> lists){
mContext = context;
this.datas = lists;
}
//创建新View，被LayoutManager所调用
@Override
public ItemViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(mContext).inflate(R.layout.linearlayout_item, parent, false);
ItemViewHolder holder = new ItemViewHolder(view);
//view注册事件
view.setOnClickListener(this);
// view.setOnLongClickListener(this);
return holder;
}
//将数据与界面进行绑定的操作
@Override
public void onBindViewHolder(ItemViewHolder holder, int position) {
//将数据保存在itemView的Tag中，以便点击时进行获取
holder.itemView.setTag(datas.get(position));
//控制绑定数据
holder.text.setText(datas.get(position));
}
//获取数据的数量
@Override
public int getItemCount() {
return datas.size();
}
//自定义的ViewHolder, 持有每个Item的的所有界面元素
static class ItemViewHolder extends RecyclerView.ViewHolder{
private TextView text;
public ItemViewHolder(View view){
super(view);
text = (TextView)view.findViewById(R.id.item_tv);
}
}
//定义Item点击事件
public interface OnRecyclerViewItemClickListener{
//点击事件
void onItemClick(View view, String str);
//长按事件
void onItemLongClick(View view, String str);
}
private OnRecyclerViewItemClickListener mOnItemClickListener;
public void setOnItemClickListener(OnRecyclerViewItemClickListener listener) {
mOnItemClickListener = listener;
}
//点击事件
@Override
public void onClick(View v) {
if(mOnItemClickListener != null){
mOnItemClickListener.onItemClick(v, (String)v.getTag());
}
}
//长按事件
@Override
public boolean onLongClick(View v) {
if(mOnItemClickListener != null){
mOnItemClickListener.onItemLongClick(v, (String)v.getTag());
}
return false;
}
}
3.作为瀑布流样式使用
//数据源
lists = new ArrayList<String>();
mRecyclerView = (RecyclerView)findViewById(R.id.swipe_target);
//创建默认的StaggeredGridLayoutManager
mLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);
mRecyclerView.setLayoutManager(mLayoutManager);
//如果可以确定每个item的高度是固定的，设置这个选项可以提高性能
mRecyclerView.setHasFixedSize(true);
//创建并设置Adapter
mAdapter = new StaggeredAdapter(this, lists);
mRecyclerView.setAdapter(mAdapter);
RecyclerView作为瀑布流使用的Adapter
public class StaggeredAdapter extends RecyclerView.Adapter<StaggeredAdapter.StaggeredViewHolder> implements View.OnClickListener, View.OnLongClickListener {
private Context mContext;
private List<String> datas = null;
public StaggeredAdapter(Context context, List<String> lists){
mContext = context;
this.datas = lists;
}
//创建新View，被LayoutManager所调用
@Override
public StaggeredViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(mContext).inflate(R.layout.linearlayout_item, parent, false);
StaggeredViewHolder holder = new StaggeredViewHolder(view);
//view注册事件
view.setOnClickListener(this);
// view.setOnLongClickListener(this);
return holder;
}
//将数据与界面进行绑定的操作
@Override
public void onBindViewHolder(StaggeredViewHolder holder, int position) {
//将数据保存在itemView的Tag中，以便点击时进行获取
holder.itemView.setTag(datas.get(position));
//控制绑定数据
holder.text.setText(datas.get(position));
//更改高度，不同位置高度不同
holder.text.setHeight(200 + (position % 2) * 60);
}
//获取数据的数量
@Override
public int getItemCount() {
return datas.size();
}
//自定义的ViewHolder, 持有每个Item的的所有界面元素
static class StaggeredViewHolder extends RecyclerView.ViewHolder{
private TextView text;
public StaggeredViewHolder(View view){
super(view);
text = (TextView)view.findViewById(R.id.item_tv);
}
}
//定义Item点击事件
public interface OnRecyclerViewItemClickListener{
//点击事件
void onItemClick(View view, String str);
//长按事件
void onItemLongClick(View view, String str);
}
private OnRecyclerViewItemClickListener mOnItemClickListener;
public void setOnItemClickListener(OnRecyclerViewItemClickListener listener) {
mOnItemClickListener = listener;
}
//点击事件
@Override
public void onClick(View v) {
if(mOnItemClickListener != null){
mOnItemClickListener.onItemClick(v, (String)v.getTag());
}
}
//长按事件
@Override
public boolean onLongClick(View v) {
if(mOnItemClickListener != null){
mOnItemClickListener.onItemLongClick(v, (String)v.getTag());
}
return false;
}
}
CardView的特点就是可以设置圆角、阴影，而以前我们需要自己定义shape文件来实现，下面我们看下CradView新增的属性：
- CardView_cardBackgroundColor 设置背景色
- CardView_cardCornerRadius 设置圆角大小
- CardView_cardElevation 设置z轴阴影
- CardView_cardMaxElevation 设置z轴最大高度值
- CardView_cardUseCompatPadding 是否使用CompadPadding
- CardView_cardPreventCornerOverlap 是否使用PreventCornerOverlap
- CardView_contentPadding 内容的padding
- CardView_contentPaddingLeft 内容的左padding
- CardView_contentPaddingTop 内容的上padding
- CardView_contentPaddingRight 内容的右padding
- CardView_contentPaddingBottom 内容的底padding
CardView在RecyclerView的item布局的使用xml如下
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
app:cardCornerRadius="8dp"
app:cardBackgroundColor="@color/white">
<TextView
android:id="@+id/item_tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="20dp"
android:gravity="center"
android:text="item数据0"
android:textSize="24sp"/>
</android.support.v7.widget.CardView>
效果图
ZJ8OFAD3@@[B@3309]WYJ%1.png
希望能给您带去帮助、感谢您的阅读。
