<四>创建Lists和Cards

来源:互联网 发布:时时彩合买软件 编辑:程序博客网 时间:2024/06/10 03:11

http://developer.android.com/training/material/lists-cards.html

可以使用RecycleView或者CardView在app中创建复杂的且具有material design风格的lists或者是cards。

使用RecycleView创建Lists

  1. 介绍
    RecycleView是ListView的升级版,更为灵活,且效率给高。同时为item项提供了一些动画效果,如加入、移除等,并且可自定义。

  2. 使用:
    使用RecycleView必须为其指定一个适配器(继承自RecycleView.Adapter)和layout manager,如果需要,还可以为item的变化设置合适的动画效果
    layout manager 处理items视图的回收和复用,RecycleView提供了三种layout manager,分别为:
    1>.LinearLayoutManager: 设置List为横向
    (mLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);或纵向(vertical )滚动
    2>.GridLayoutManager: item为网格状排列(类似GridView效果)
    3>.StaggeredGridLayoutManager : item为不规则网格状排列
    (如果需要自定义layout manager可通过继承RecycleView.LayoutManager)

  3. 动画
    RecycleView已经提供有添加、移除等item动画效果,如果需要自定义可以继承RecycleView.ItemAnimator类进行处理,并调用RecycleView.setItemAnimator()进行设置。
  4. 示例
    1>. 在gradle中添加依赖
dependencies {    ...    compile 'com.android.support:recyclerview-v7:21.0.+'}

2>.在布局中添加RecycleView(和普通控件的用法基本一致):

<android.support.v7.widget.RecyclerView    android:id="@+id/my_recycler_view"    android:scrollbars="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent"/>

3>.在代码中关联RecycleView ,并为其设置layout manager和适配器

public class MyActivity extends Activity {    private RecyclerView mRecyclerView;    private RecyclerView.Adapter mAdapter;    private RecyclerView.LayoutManager mLayoutManager;    private String[] myDataset = new String[]{"1","2","3","4","5","......."};// 列表中显示的数据    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.my_activity);        mRecyclerView = (RecyclerView) findViewById(R.id.my_recycler_view);        // 当确定List内容(数据)的变化不会影响RecycleView布局的大小时,以下设置可以提高性能        mRecyclerView.setHasFixedSize(true);        // 使用linear layout manager        mLayoutManager = new LinearLayoutManager(this);        mRecyclerView.setLayoutManager(mLayoutManager);        // 设置设配器 (MyAdapter见步骤4)        mAdapter = new MyAdapter(myDataset);        mRecyclerView.setAdapter(mAdapter);    }    ...}

4>.适配器(MyAdapter)代码

 public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {    private String[] mDataset;    //自定义的ViewHolder,持有Item中的所有View    public static class ViewHolder extends RecyclerView.ViewHolder {        // 当前item布局中仅有的一个TextView        public TextView mTextView;        public ViewHolder(TextView v) {            super(v);            mTextView = (TextView)v.findViewById(R.id.my_text_view);        }    }    // Provide a suitable constructor (depends on the kind of dataset)    public MyAdapter(String[] myDataset) {        mDataset = myDataset;    }    // 创建一个新的 views (被layout manager回调)    @Override    public MyAdapter.ViewHolder onCreateViewHolder(ViewGroup parent,                                                   int viewType) {        // 关联item布局,item.xml见步骤5        View v = LayoutInflater.from(parent.getContext())                               .inflate(R.layout.item, parent, false);        // 创建并放回一个ViewHolder对象        ViewHolder vh = new ViewHolder(v);        return vh;    }    // 在这方法中对item中的数据(View)进行修改(被layout manager回调)    @Override    public void onBindViewHolder(ViewHolder holder, int position) {        // 对holder(即对应item)的TextView进行修改        holder.mTextView.setText(mDataset[position]);    }    // 返回数据(dataset)的大小 (被layout manager回调)    @Override    public int getItemCount() {        return mDataset.length;    }}

5>.item.xml(当前示例的item仅为一个TextView)

 <?xml version="1.0" encoding="utf-8"?><TextView xmlns: android="http://schemas.android.com/apk/res/android"    android :id="@+id/my_text_view"    android :layout_width="match_parent"    android :layout_height="48dp"   ></TextView>

经过以上5个步骤,一个简单的由RecycleView创建的List即已经完成。
这里写图片描述

使用CardView 创建 Cards(卡片效果)

  1. 介绍:
    CardView继承自FrameLayout,其创建的卡片(Cards)可以具有阴影和圆角效果。
    阴影效果:可以通过card_view:cardElevation属性设置(如果需要在低版本(5.0以下)中使用阴影效果,需要使用兼容包v7 appcompat library。详情: Maintaining Compatibility.)
    圆角效果:可以通过card_view:cardCornerRadius属性设置(在代码中可以通过CardView.setRadius方法进行设置)
    背景颜色:可以通过card_view:cardBackgroundColor属性设置
  2. 示例
    1>. 在gradle中添加依赖
dependencies {    ...    compile 'com.android.support:cardview-v7:21.0.+'}
 2>.在布局中添加CardView(这里需要注意的就是card_view这个属性域的使用):
<LinearLayout 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"    ... >    <!-- “卡片”中仅包含一个TextView -->    <android.support.v7.widget.CardView        xmlns:card_view="http://schemas.android.com/apk/res-auto"        android:id="@+id/card_view"        android:layout_gravity="center"        android:layout_width="200dp"        android:layout_height="200dp"        card_view:cardCornerRadius="4dp">        <TextView            android:id="@+id/info_text"            android:layout_width="match_parent"            android:layout_height="match_parent" />    </android.support.v7.widget.CardView></LinearLayout>

经过以上2个步骤,一个简单的由CardView创建的Cards(卡片)即已经完成。
这里写图片描述

0 0