【安卓笔记】CardView+RecyclerView使用示例

CardView+RecycleView可以非常方便的实现一个卡片式列表布局，之前编写卡片式布局非常麻烦(地址： http://blog.csdn.net/chdjj/article/details/41546477)，还得编写各种资源文件。

另外，单独使用RecyclerView我们还得关注ItemDecoration，但是使用CardView就不必管了，因为CardView本身就可以设置阴影。

下面是一个简单示例。

截图:

有点难看？自己调一下就ok啦。。这里只是一个示例。

步骤：

1.添加依赖：

 compile 'com.android.support:cardview-v7:21.0.0'
    compile 'com.android.support:recyclerview-v7:21.0.0'

2.页面布局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context=".MainActivity">
        <android.support.v7.widget.RecyclerView
            android:id="@+id/main_recyclerview"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scrollbars="vertical"
            ></android.support.v7.widget.RecyclerView>
</RelativeLayout>

3.item布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:orientation="vertical"
              android:background="#ff3cffdd"
              xmlns:tools="http://schemas.android.com/tools"
              xmlns:card_view="http://schemas.android.com/apk/res-auto"
              android:layout_height="match_parent">
    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="130dp"
        card_view:cardCornerRadius="4dp"
        card_view:cardBackgroundColor="#fff"
        card_view:cardElevation="2dp"
        android:layout_marginTop="2dp"
        android:layout_marginLeft="3dp"
        android:layout_marginRight="3dp"
        >
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@mipmap/ic_launcher"
                android:layout_gravity="center"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>
            <TextView
                android:id="@+id/info_text"
                android:gravity="center"
                android:textColor="#000"
                android:textSize="19sp"
                android:layout_gravity="center"
                tools:text="@string/hello_world"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>
        </LinearLayout>
    </android.support.v7.widget.CardView>
</LinearLayout>

这里如果你想加CardView的自定义属性，必须添加其命名空间：

xmlns:card_view="http://schemas.android.com/apk/res-auto"

4.适配器：

package com.taobao.recyclerviewwithcardview.ui.adapter;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import com.taobao.recyclerviewwithcardview.R;
import java.util.List;
/**
 * Created by Rowandjj on 2015/3/25.
 */
public class MainAdapter extends RecyclerView.Adapter<MainAdapter.ViewHolder>
{
    private List<String> mDataSet = null;
    private OnItemClickListener mListener;
    public MainAdapter(List<String> dataSet)
    {
        this.mDataSet = dataSet;
    }
    @Override
    public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i)
    {
        final View itemView = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.item_main,viewGroup,false);
        itemView.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                if(mListener != null)
                    mListener.onItemClick(v, (String) itemView.getTag());
            }
        });
        return new ViewHolder(itemView);
    }
    @Override
    public void onBindViewHolder(ViewHolder viewHolder, int i)
    {
        String data = mDataSet.get(i);
        viewHolder.bindData(data);
        viewHolder.itemView.setTag(data);
    }
    @Override
    public int getItemCount()
    {
        return mDataSet.size();
    }
    public static class ViewHolder extends RecyclerView.ViewHolder
    {
        private TextView tv;
        public ViewHolder(View itemView)
        {
            super(itemView);
            tv = (TextView) itemView.findViewById(R.id.info_text);
        }
        public void bindData(String s)
        {
            if(s != null)
                tv.setText(s);
        }
    }
    public interface OnItemClickListener
    {
        public void onItemClick(View view,String data);
    }
    public void setOnItemClickListener(OnItemClickListener listener)
    {
        this.mListener = listener;
    }
}

5.数据源:

package com.taobao.recyclerviewwithcardview.data;
import java.util.ArrayList;
import java.util.List;
/**
 * Created by Rowandjj on 2015/3/24.
 */
public class DataSource
{
    public static final List<String> generateData(int size)
    {
        if (size <= 0)
            return null;
        List<String> datas = new ArrayList<>();
        for (int i = 0; i < size; i++)
        {
            datas.add("这是列表数据"+i);
        }
        return datas;
    }
}

6.主页面代码：

package com.taobao.recyclerviewwithcardview.ui.activity;
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.Toast;
import com.taobao.recyclerviewwithcardview.R;
import com.taobao.recyclerviewwithcardview.data.DataSource;
import com.taobao.recyclerviewwithcardview.ui.adapter.MainAdapter;
public class MainActivity extends ActionBarActivity
{
    private RecyclerView mRecyclerView;
    private MainAdapter mAdapter;
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mRecyclerView = (RecyclerView) findViewById(R.id.main_recyclerview);
        mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
        mAdapter = new MainAdapter(DataSource.generateData(20));
        mRecyclerView.setHasFixedSize(true);
        mRecyclerView.setAdapter(mAdapter);
        mAdapter.setOnItemClickListener(new MainAdapter.OnItemClickListener()
        {
            @Override
            public void onItemClick(View view, String data)
            {
                Toast.makeText(MainActivity.this,"data:"+data,Toast.LENGTH_SHORT).show();
            }
        });
    }
}

代码地址： https://github.com/Rowandjj/RecyclerViewWithCardView

【安卓笔记】CardView+RecyclerView使用示例

猜你喜欢