前言：

第一眼就爱上了Android的Material Design风格。以前倒对Android的界面风格不那么喜欢，扁平化的界面设计真是好看。

其实，这个嵌套操作在实现上并没有什么难点。可是，我还在Eclipse上没有试验成功。后来换到Android Studio上就OK了。以下是实现过程。

笔者开发环境：

系统：Windows 7 旗舰版

IDE：Android Studio v1.0

工具包：cardview-v7-21.0.0.aar

recyclerview-v7-21.0.0.aar

效果图展示：

Android Material Design之在RecyclerView中嵌套CardView实现_第1张图片

关键代码：

主界面展示的MainActivity：

public class MainActivity extends FragmentActivity {    private int getLayoutResID() {        return R.layout.activity_main;    }    private RecyclerView mRecyclerView = null;    private String[] dataset = null;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(getLayoutResID());        initEvent();    }    private void initEvent() {        initViews();        initData();        setViews();    }    private void initViews() {        mRecyclerView = (RecyclerView) findViewById(R.id.activity_main_recyclerView);    }    private void initData() {        // 创建数据集        dataset = new String[100];        for (int i = 0; i < dataset.length; i++) {            dataset[i] = "item " + (i + 1);        }    }    private void setViews() {        LinearLayoutManager layoutManager = new LinearLayoutManager(this);        layoutManager.setOrientation(LinearLayoutManager.VERTICAL);        mRecyclerView.setLayoutManager(layoutManager);        RecyclerViewAdapter adapter = new RecyclerViewAdapter(dataset);        mRecyclerView.setAdapter(adapter);    }}

List的配置器RecyclerViewAdapter：

public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder> {// 数据集private String[] mDataset;public RecyclerViewAdapter(String[] dataset) {super();mDataset = dataset;}@Overridepublic ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {View view = View.inflate(viewGroup.getContext(), R.layout.recyclerview_item, null);// 创建一个ViewHolderViewHolder holder = new ViewHolder(view);        holder.mTextView = (TextView) view.findViewById(R.id.activity_card_view_label_textview);return holder;}@Overridepublic void onBindViewHolder(ViewHolder viewHolder, int i) {// 绑定数据到ViewHolder上viewHolder.mTextView.setText(mDataset[i]);}@Overridepublic int getItemCount() {return mDataset.length;}public static class ViewHolder extends RecyclerView.ViewHolder {public TextView mTextView;public ViewHolder(View itemView) {super(itemView);// mTextView = (TextView) itemView;}}}

主界面布局文件activity_main.xml：

<?xml version="1.0" encoding="utf-8"?><LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent">    <android.support.v7.widget.RecyclerView        android:id="@+id/activity_main_recyclerView"        android:layout_width="match_parent"        android:layout_height="match_parent" /></LinearLayout>

RecyclerView的单元item布局recyclerview_item.xml：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    xmlns:card_view="http://schemas.android.com/apk/res-auto"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context=".MainActivity">    <android.support.v7.widget.CardView        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_margin="5dp"        android:orientation="horizontal"        card_view:cardBackgroundColor="#ffFF8C00"        card_view:cardCornerRadius="4dp" >        <RelativeLayout            android:layout_width="match_parent"            android:layout_height="100dp" >            <ImageView                android:id="@+id/activity_card_view_imageview"                android:layout_width="match_parent"                android:layout_height="match_parent"                android:layout_centerInParent="true"                android:scaleType="centerCrop"                android:adjustViewBounds="true"                android:src="@drawable/notre_dame_de_paris" />            <TextView                android:id="@+id/activity_card_view_label_textview"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginBottom="10dip"                android:layout_alignParentBottom="true"                android:layout_centerInParent="true"                android:textColor="@android:color/white"                android:textSize="24sp"                android:text="@string/show_label" />        </RelativeLayout>    </android.support.v7.widget.CardView></RelativeLayout>

注意事项：

1.如果可以请使用Android Studio来开发它，我也不知道为什么我的Eclipse在不报错的情况下，为什么运行不了。我也要再摸索一下，后期再补到文章中来。

2.在看到代码和程序运行的效果图来看，可能你会觉得这个跟一个普通的RelativeLayout有什么区别？不过，的确CardView是继承自FrameLayout，它们都是ViewGroup，即其他控件的容器。所以这一点也就不足为奇了。

3.虽然CardView与RelativeLayout都是ViewGroup，有很多类似的东西，也可以把CardView替换成RelativeLayout。不过，CardView还有一些比较优越的属性。elevation(CardView的Z轴阴影)，cardBackgroundColor(CardView的卡片颜色)和cardConerRadius(CardView卡片的四角圆角矩形程度)。

4.elevation：在API21（Android L）等级以上才拥有此属性。只能通过xml中的elevation属性指定；

cardBackgroundColor：Android2.0以上有效，只能通过xml的cardBackgroundColor属性进行指定；

cardConerRadius：Android2.0以上有效，单位dimen（dp，px，sp），可以通过xml指定，也可以通过Java代码的setRadius指定。

源码下载：

http://download.csdn.net/detail/u013761665/8959985

Android Material Design之在RecyclerView中嵌套CardView实现

前言：

笔者开发环境：

效果图展示：

关键代码：

注意事项：

源码下载：

更多相关文章

随机推荐