【安卓筆記】CardView+RecyclerView使用樣本

標籤：recyclerview   cardview   

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使用樣本