RecyclerView(入门)

最新推荐文章于 2024-03-17 19:57:13 发布

BriskLyer

最新推荐文章于 2024-03-17 19:57:13 发布

阅读量374

点赞数

分类专栏：安卓知识文章标签： android

本文链接：https://blog.csdn.net/qq_27280457/article/details/70888802

版权

安卓知识专栏收录该内容

44 篇文章 1 订阅

订阅专栏

一、简介

Android5.0 v7扩展包之RecyclerView
RecyclerView架构，提供了一种插拔式的体验，高度的解耦，异常的灵活，通过设置它提供的不同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);
        }
    }

}

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

BriskLyer

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
RecyclerView(入门)

一、简介Android5.0 v7扩展包之RecyclerViewRecyclerView架构，提供了一种插拔式的体验，高度的解耦，异常的灵活，通过设置它提供的不同LayoutManager，ItemDecoration , ItemAnimator实现令人瞠目的效果。二、简单实现步骤1.添加依赖compile 'com.android.support:recyclerview-v7:25.3.
复制链接

扫一扫