RecyclerView(入门)

来源：互联网发布：淘宝手机网站模板编辑：程序博客网时间：2024/06/09 14:13

一、简介

Android5.0 v7扩展包之RecyclerViewRecyclerView架构，提供了一种插拔式的体验，高度的解耦，异常的灵活，通过设置它提供的不同LayoutManager，ItemDecoration , ItemAnimator实现令人瞠目的效果。

二、简单实现步骤

1.添加依赖

compile 'com.android.support:recyclerview-v7:25.3.1'

2.布局里面的引用

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

3.代码的实现

package com.example.administrator.mystudydemo;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.v7.widget.DividerItemDecoration;import android.support.v7.widget.LinearLayoutManager;import android.support.v7.widget.RecyclerView;import com.example.administrator.mystudydemo.adapter.SimpleAdapter;import java.util.ArrayList;public class MainActivity extends AppCompatActivity {    private RecyclerView recyclerView;    private ArrayList<String> mDatas;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initData();    }    private void initData() {        mDatas = new ArrayList<String>();        for (int i = 0; i < 70; i++) {            mDatas.add("这是第几个Item？" + i);        }        initView();    }    private void initView() {        recyclerView = (RecyclerView) findViewById(R.id.id_recyclerview);        SimpleAdapter SimpleAdapter = new SimpleAdapter(MainActivity.this, mDatas);        recyclerView.setLayoutManager(new LinearLayoutManager(this));        //添加分割线        recyclerView.addItemDecoration(new DividerItemDecoration(MainActivity.this, DividerItemDecoration.VERTICAL));        recyclerView.setAdapter(SimpleAdapter);    }}

package com.example.administrator.mystudydemo.adapter;import android.content.Context;import android.support.v7.widget.RecyclerView;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ListView;import android.widget.TextView;import com.example.administrator.mystudydemo.R;import java.util.ArrayList;/** * Created by Administrator on 2017/4/25. */public class SimpleAdapter extends RecyclerView.Adapter<SimpleAdapter.MyViewHolder> {    private Context mContext;    private ArrayList<String> mDatas;    public SimpleAdapter(Context mContext,ArrayList<String> mDatas) {        this.mContext=mContext;        this.mDatas=mDatas;    }    @Override    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {        MyViewHolder holder = new MyViewHolder(LayoutInflater.from(mContext).inflate(R.layout.item_simple, parent, false));        return holder;    }    @Override    public void onBindViewHolder(MyViewHolder holder, int position) {        holder.tv.setText(mDatas.get(position));    }    @Override    public int getItemCount() {        return mDatas.size();    }    class  MyViewHolder extends RecyclerView.ViewHolder {        private TextView tv;        public MyViewHolder(View itemView) {            super(itemView);            tv= (TextView) itemView.findViewById(R.id.tv);        }    }}

效果图

图片描述

详解

1.关于分割线

//添加自定义的分割线 传递ItemDecoration（抽象类）  可以指定方向recyclerView.addItemDecoration(new DividerItemDecoration(MainActivity.this, DividerItemDecoration.VERTICAL));怎么修改系统默认的分割线：1.在stytles.xml（系统主题）文件中添加 <item name="android:listDivider">@drawable/divider_bg</item><resources>    <!-- Base application theme. -->    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">        <!-- Customize your theme here. -->        <item name="colorPrimary">@color/colorPrimary</item>        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>        <item name="colorAccent">@color/colorAccent</item>        <item name="android:listDivider">@drawable/divider_bg</item>    </style></resources>2.自己写个drawable即可<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="rectangle" >    <gradient        android:centerColor="#ff00ff00"        android:endColor="#ff0000ff"        android:startColor="#ffff0000"        android:type="linear" />    <size android:height="4dp"/></shape>效果：

图片描述

开发中实现修改ItemView的Margin+Background 这种是最简单的方法

关于万能分割线（贴出来网站，自己可以研究）http://blog.csdn.net/chen413203144/article/details/52662378

2.recyclerView.setLayoutManager详解

RecyclerView提供了三种内置的LayoutManager:LinearLayoutManager:线性布局,横向或者纵向滑动列表：LinearLayoutManager layoutManager=new LinearLayoutManager(MainActivity.this);//直接指定滑到第几个layoutManager.scrollToPosition(10);//指定方向 默认是竖的layoutManager.setOrientation(OrientationHelper.HORIZONTAL);recyclerView.setLayoutManager(layoutManager);GridLayoutManager:表格布局//指定个数GridLayoutManager layoutManager =new GridLayoutManager(mContext,2);layoutManager.setOrientation(OrientationHelper.HORIZONTAL);StaggeredGridLayoutManager:流式布局//指定个数和方向StaggeredGridLayoutManager layoutManager=new StaggeredGridLayoutManager(3,OrientationHelper.VERTICAL);recyclerView.setLayoutManager(layoutManager);当然除了上面的三种内部布局之外，我们还可以继承RecyclerView.LayoutManager来实现一个自定义的LayoutManager。

3.仿京东商品列表转换（横向转换成竖向的）

package com.example.administrator.mystudydemo;import android.app.Activity;import android.os.Bundle;import android.support.v7.widget.GridLayoutManager;import android.support.v7.widget.LinearLayoutManager;import android.support.v7.widget.RecyclerView;import android.view.View;import android.widget.ImageButton;import com.example.administrator.mystudydemo.adapter.RecyclerViewAdapter;import com.example.administrator.mystudydemo.bean.ImageBean;import java.util.ArrayList;/** * Created by Administrator on 2017/4/27. */public class SwitchingActivity extends Activity implements View.OnClickListener {    private RecyclerView rv;    private ImageButton btnChange;    //切换标示,默认显示线性布局    private boolean isLinearLayout = true;    private RecyclerViewAdapter recyclerViewAdapter;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.content_main);        initView();        initData();    }    private void initView() {        rv = (RecyclerView) findViewById(R.id.recyclerView);        //切换按钮        btnChange = (ImageButton) findViewById(R.id.btn_change);        btnChange.setOnClickListener(this);    }    private void initData() {        ImageBean imageBean;        ArrayList<ImageBean>  datas=new ArrayList<ImageBean>();        for (int i=0;i <20;i++){            imageBean=new ImageBean();            imageBean.setImageUrl(ImageBean.imageUrls[i]);            imageBean.setTitle("我是美女"+i);            imageBean.setDesc("别说话  请看图"+i);            datas.add(imageBean);        }        recyclerViewAdapter = new RecyclerViewAdapter(this,datas);        rv.setLayoutManager(new LinearLayoutManager(this));        rv.setAdapter(recyclerViewAdapter);    }    @Override    public void onClick(View v) {        switch (v.getId()) {            case R.id.btn_change:                //切换                if(isLinearLayout) {                    //切换成网格布局                    recyclerViewAdapter.setType(1);                    rv.setLayoutManager(new GridLayoutManager(this, 2));                    recyclerViewAdapter.notifyDataSetChanged();                    isLinearLayout = false;                } else {                    //切换成垂直线性布局                    recyclerViewAdapter.setType(0);                    rv.setLayoutManager(new LinearLayoutManager(this));                    recyclerViewAdapter.notifyDataSetChanged();                    //startAnimation(R.anim.zoom_in);                    isLinearLayout = true;                }                break;            default:                break;        }    }}

package com.example.administrator.mystudydemo.adapter;import android.content.Context;import android.graphics.Bitmap;import android.support.v7.widget.RecyclerView;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import android.widget.TextView;import com.bumptech.glide.Glide;import com.example.administrator.mystudydemo.R;import com.example.administrator.mystudydemo.bean.ImageBean;import java.util.ArrayList;import java.util.List;/** * Created by Song on 2016/7/19. */public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.BaseViewHolder>{    private int type = 0;    private Context mContext;    private LayoutInflater inflater;    private ArrayList<ImageBean> datas;    public RecyclerViewAdapter(Context context, ArrayList<ImageBean> datas) {        this.datas=datas;        this.mContext = context;        inflater = LayoutInflater.from(context);    }    @Override    public BaseViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {        View rootView;        if(viewType == 0) {            rootView = inflater.inflate(R.layout.layout_linear,null,false);            LinearViewHolder linearViewHolder = new LinearViewHolder(rootView);            return linearViewHolder;        } else {            rootView = inflater.inflate(R.layout.layout_grid,null,false);            GridViewHolder gridViewHolder = new GridViewHolder(rootView);            return gridViewHolder;        }    }    @Override    public void onBindViewHolder(BaseViewHolder holder, int position) {        if(type == 0) {            LinearViewHolder linearViewHolder = (LinearViewHolder)holder;            linearViewHolder.tvName.setText(datas.get(position).getTitle());            linearViewHolder.tvDesc.setText(datas.get(position).getDesc());            String url=datas.get(position).getImageUrl();            Glide.with(mContext).load(url).asBitmap().into(linearViewHolder.ivPhoto);        } else {            GridViewHolder gridViewHolder = (GridViewHolder)holder;            gridViewHolder.tvName.setText(datas.get(position).getTitle());            String url=datas.get(position).getImageUrl();            Glide.with(mContext).load(url).asBitmap().into(gridViewHolder.ivPhoto);        }    }    @Override    public int getItemCount() {        return datas.size();    }    @Override    public int getItemViewType(int position) {        return type;    }    public void setType(int type) {        this.type = type;    }    public static class BaseViewHolder extends RecyclerView.ViewHolder{        public BaseViewHolder(View itemView) {            super(itemView);        }    }    public static class LinearViewHolder extends BaseViewHolder {        private TextView tvName;        private TextView tvDesc;        private ImageView ivPhoto;        public LinearViewHolder(View itemView) {            super(itemView);            tvName = (TextView) itemView.findViewById(R.id.tv_name);            tvDesc = (TextView) itemView.findViewById(R.id.tv_desc);            ivPhoto= (ImageView) itemView.findViewById(R.id.iv_photo);        }    }    public static class GridViewHolder extends BaseViewHolder {        private TextView tvName;        private ImageView ivPhoto;        public GridViewHolder(View itemView) {            super(itemView);            tvName = (TextView) itemView.findViewById(R.id.tv_name);            ivPhoto= (ImageView) itemView.findViewById(R.id.iv_photo);        }    }}

效果图（没有找到合适图片，导致图片过大，显示丑陋，希望多多包涵）
图片描述

0 0