高级UI-RecyclerView简单使用
RecyclerView从Android 5.0开始引入,用以替代ListView、GridView控件,RecyclerView的存在,使得控件的耦合度更低,在ListView中需要使用ViewHolder做优化,而在RecyclerView里面自带了ViewHolder那么这篇文章就来写一写关于RecyclerView的基本使用,后面还会有文章继续对RecyclerView的使用做介绍
使用RecyclerView的准备
RecyclerView存在于support-v7中,这是为了更好的兼容各个版本,这这里说明以下V4,v7等包的作用,在系统中的很多控件在这个包里面都能找到,其主要作用就是各个不同系统版本的兼容,说简单一点就是为了在不同Android系统版本上有着相同的体验
在使用RecyclerView之前,需要导入依赖
在Android Studio中,直接在gradle中添加
implementation'com.android.support:recyclerview-v7:25.4.0'
注:这里注意两点,3.0以前的ide使用的是complie而3.0以后的ide使用的是implementation,还有一个地方是25.4.0,这里指的是编译版本,要和上面的compileSdkVersion相一致,比如compileSdkVersion 25那么这里应该是25.x.x,后面是小版本号,在SDK下载的地方可以看到
依赖导入完成,那么就可以开始使用RecycleView,其使用过程和ListView极其类似
数据准备
这里是模拟使用,就直接使用一个数据工具来生成数据,根据输入的个数返回数据
public class DataUtils {
public static List<String> initData(int num){
List<String> list = new ArrayList<>();
for (int i = 0; i < num; i++) {
list.add("item " + i);
}
return list;
}
}
适配器准备
和ListView一样,使用RecyclerView也需要准备适配器,不过在实现上稍有不同,RecyclerView的适配器是其内部类,需要实现onCreateViewHolder,onBindViewHolder,getItemCount三个方法
public class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.MyViewHolder> {
private List<String> list;
class MyViewHolder extends RecyclerView.ViewHolder {
private TextView textView;
public MyViewHolder(View itemView) {
super(itemView);
textView = (TextView) itemView.findViewById(android.R.id.text1);
}
}
public MyRecyclerViewAdapter(List<String> list) {
this.list = list;
}
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
LayoutInflater layoutInflater = LayoutInflater.from(parent.getContext());
View view = layoutInflater.inflate(android.R.layout.simple_list_item_1,parent,false);
MyViewHolder holder = new MyViewHolder(view);
return holder;
}
@Override
public void onBindViewHolder(MyViewHolder holder, int position) {
holder.textView.setText(list.get(position));
}
@Override
public int getItemCount() {
return list.size();
}
}
网格布局
网格布局直接使用以上数据和适配器即可
public class GridActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private MyRecyclerViewAdapter adapter;
private List<String> list;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_grid);
recyclerView = (RecyclerView) findViewById(R.id.grid_recyclerview);
list = DataUtils.initData(100);
adapter = new MyRecyclerViewAdapter(list);
//设置样式,后面的参数代表设置三列
recyclerView.setLayoutManager(new GridLayoutManager(this, 3));
recyclerView.setAdapter(adapter);
}
}
线性布局
线性布局只是在设置样式的时候不同,其他地方和网格布局相同,这里可以实现水平布局,这是ListView做不到的,可以是正序,也可以是反序
public class LineActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private MyRecyclerViewAdapter adapter;
private List<String> list;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_line);
recyclerView = (RecyclerView) findViewById(R.id.line_recyclerview);
list = DataUtils.initData(100);
adapter = new MyRecyclerViewAdapter(list);
//设置样式,默认垂直
recyclerView.setLayoutManager(new LinearLayoutManager(this));
//水平布局
//recyclerView.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, true));
recyclerView.setAdapter(adapter);
}
}
瀑布流
在使用瀑布流的时候会获取填充布局的宽高,这里使用一个随机数模拟,同时加上随机背景,方便查看
所以在这里需要修改适配器,使其达到想要的结果
public class StaggedAdapter extends RecyclerView.Adapter<StaggedAdapter.MyViewHolder> {
private List<String> list;
private List<Integer> height;
class MyViewHolder extends RecyclerView.ViewHolder {
private TextView textView;
public MyViewHolder(View itemView) {
super(itemView);
textView = (TextView) itemView.findViewById(android.R.id.text1);
}
}
public StaggedAdapter(List<String> list) {
this.list = list;
height = new ArrayList<>();
for (int i = 0; i < list.size(); i++) {
//模拟瀑布流高度
int viewHeight = (int)Math.max(200,Math.random() *500);
height.add(viewHeight);
}
}
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
LayoutInflater layoutInflater = LayoutInflater.from(parent.getContext());
View view = layoutInflater.inflate(android.R.layout.simple_list_item_1,parent,false);
MyViewHolder holder = new MyViewHolder(view);
return holder;
}
@Override
public void onBindViewHolder(MyViewHolder holder, int position) {
//设置背景颜色
ViewGroup.LayoutParams params = holder.textView.getLayoutParams();
params.height = height.get(position);
int color = Color.rgb(100, (int) (Math.random() * 255), (int) (Math.random() * 255));
holder.textView.setBackgroundColor(color);
holder.textView.setLayoutParams(params);
holder.textView.setText(list.get(position));
}
@Override
public int getItemCount() {
return list.size();
}
}
其调用方法与前面的类似,这样便完成了瀑布流效果的实现
public class StaggedActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private StaggedAdapter adapter;
private List<String> list;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_stagged);
recyclerView = (RecyclerView) findViewById(R.id.stagged_recyclerview);
list = DataUtils.initData(100);
adapter = new StaggedAdapter(list);
//设置样式
recyclerView.setLayoutManager(new StaggeredGridLayoutManager(3, LinearLayoutManager.VERTICAL));
recyclerView.setAdapter(adapter);
}
}
以下是Demo的测试效果

源代码:链接:https://pan.baidu.com/s/1oEU5JyJLS5538GOZrFf1cQ 密码:95ip
给RecyclerView添加点击事件
在RecyclerView当中,是没有点击事件的,那么要实现点击,就需要自己去实现,这里就来实现一下RecycleView的点击监听
在适配器中添加点击方法和监听接口
public class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.MyViewHolder> {
private List<String> list;
private OnItemClickListener onItemClickListener;
class MyViewHolder extends RecyclerView.ViewHolder {
private TextView textView;
public MyViewHolder(View itemView) {
super(itemView);
textView = (TextView) itemView.findViewById(android.R.id.text1);
}
}
public MyRecyclerViewAdapter(List<String> list) {
this.list = list;
}
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
LayoutInflater layoutInflater = LayoutInflater.from(parent.getContext());
View view = layoutInflater.inflate(android.R.layout.simple_list_item_1,parent,false);
MyViewHolder holder = new MyViewHolder(view);
return holder;
}
@Override
public void onBindViewHolder(MyViewHolder holder, int position) {
holder.textView.setText(list.get(position));
if (onItemClickListener != null) {
holder.textView.setOnClickListener(new MyClickLister(position));
}
}
@Override
public int getItemCount() {
return list.size();
}
public interface OnItemClickListener {
void onItemClick(View view, int position);
}
public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
this.onItemClickListener = onItemClickListener;
}
class MyClickLister implements View.OnClickListener {
private int position;
public MyClickLister(int position) {
this.position = position;
}
@Override
public void onClick(View v) {
onItemClickListener.onItemClick(v, position);
}
}
}
在活动中设置监听
public class LineActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private MyRecyclerViewAdapter adapter;
private List<String> list;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_line);
recyclerView = (RecyclerView) findViewById(R.id.line_recyclerview);
list = DataUtils.initData(100);
adapter = new MyRecyclerViewAdapter(list);
//设置点击监听
adapter.setOnItemClickListener(new MyRecyclerViewAdapter.OnItemClickListener() {
@Override
public void onItemClick(View view, int position) {
Toast.makeText(LineActivity.this, "点击 " + position, Toast.LENGTH_SHORT).show();
}
});
//设置样式,默认垂直
recyclerView.setLayoutManager(new LinearLayoutManager(this));
//水平布局
recyclerView.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, true));
recyclerView.setAdapter(adapter);
}
}
测试效果如下

源代码:链接:https://pan.baidu.com/s/1FCHqwlRhdbpB-qcozkQXJA 密码:ls7y
相同的做法,还可以实现长按等监听
高级UI-RecyclerView简单使用的更多相关文章
- Android 高级UI设计笔记07:RecyclerView 的详解
1. 使用RecyclerView 在 Android 应用程序中列表是一个非常重要的控件,适用场合非常多,如新闻列表.应用列表.消息列表等等,但是从Android 一出生到现在并没有非常 ...
- WeX5的简单介绍及UI的简单讲解
WeX5的简单介绍及UI的简单讲解 (2016-01-13 14:49:05) 标签: it 分类: WeX5的初步自学 一.WeX5的简单讲解 1.WeX5是前端快速开发框架,可开发跨端运行应用.是 ...
- iOS开发UI篇—简单的浏览器查看程序
iOS开发UI篇—简单的浏览器查看程序 一.程序实现要求 1.要求 2. 界面分析 (1) 需要读取或修改属性的控件需要设置属性 序号标签 图片 图片描述 左边按钮 右边按钮 (2) 需要监听响应事件 ...
- iOS开发UI篇—简单介绍静态单元格的使用
iOS开发UI篇—简单介绍静态单元格的使用 一.实现效果与说明 说明:观察上面的展示效果,可以发现整个界面是由一个tableview来展示的,上面的数据都是固定的,且几乎不会改变. 要完成上面的效果, ...
- firefox 扩展开发笔记(三):高级ui交互编程
firefox 扩展开发笔记(三):高级ui交互编程 前言 前两篇链接 1:firefox 扩展开发笔记(一):jpm 使用实践以及调试 2:firefox 扩展开发笔记(二):进阶开发之移动设备模拟 ...
- 微信小程序初探【类微信UI聊天简单实现】
微信小程序最近很火,火到什么程度,只要你一打开微信,就是它的身影,几乎你用的各个APP都可以在微信中找到它的复制版,另外官方自带的跳一跳更是将它推到了空前至高的位置.对比公众号,就我的感觉来说,有以下 ...
- iOS开发——高级UI之OC篇&UIdatePicker&UIPickerView简单使用
UIdatePicker&UIPickerView简单使用 /***************************************************************** ...
- Android 高级UI设计笔记20:RecyclerView 的详解之RecyclerView添加Item点击事件
1. 引言: RecyclerView侧重的是布局的灵活性,虽说可以替代ListView但是连基本的点击事件都没有,这篇文章就来详细讲解如何为RecyclerView的item添加点击事件,顺便复习一 ...
- Android 高级编程 RecyclerView 控件的使用
RecyclerView 是Android 新添加的一个用来取代ListView的控件,它的灵活性与可替代性比listview更好. 看一下继承关系: ava.lang.Object ↳ and ...
- iOS开发——高级UI&带你玩转UITableView
带你玩装UITableView 在实际iOS开发中UITableView是使用最多,也是最重要的一个控件,如果你不会用它,那别说什么大神了,菜鸟都不如. 其实关于UItableView事非常简单的,实 ...
随机推荐
- 对象(面向对象、创建对象方式、Json)
一.面向对象 面向过程:凡事亲力亲为,每件事的具体过程都要知道,注重过程 面向对象:根据需求寻找对象,所有的事都用对象来做,注重结果 面向对象特性:封装.继承.多态(抽象性) js是一门基于对象的语言 ...
- 小象和老鼠 DP
小象和老鼠 DP \(N*M\)的网格图,格子\((i,j)\)有\(A_{i,j}\)个老鼠,问小象从左上角\((1,1)\)走到右下角\((N,M)\)看到的最少老鼠.小象可以看见老鼠,当且仅当老 ...
- 搭建自己的博客(十七):添加每日阅读量并使用highcharts通过图表显示
之前写了单篇博客的阅读量统计,今天添加了博客总阅读量统计,并且使用highcharts图表显示. 1.变化的部分
- Linux find,grep 命令
使用实验楼Linux环境开发,部分内容有所参考,link:https://www.shiyanlou.com/ 概述: find: 在目录中搜索文件,它的使用权限是所有用户 命令格式: find [路 ...
- Linux下基于Xampp的TestLink的安装部署
由于项目需要,故需要搭建Testlink,且出于稳定,考虑在linux环境部署,当然windows系统也是可以的. 系统:64位操作系统 linux:centos6.8 testlink:1.9.14 ...
- [bzoj 3534][Sdoi2014] 重建
传送门 Description T国有N个城市,用若干双向道路连接.一对城市之间至多存在一条道路. 在一次洪水之后,一些道路受损无法通行.虽然已经有人开始调查道路的损毁情况,但直到现在几乎没有消息传 ...
- Java 多线程示例
/** * 多线程案例 两种方式 模拟买票程序(不考虑线程安全问题) */ public class ThreadTest { public static void main(String[] arg ...
- Js 之cookie插件(jquery.cookie.js)
一.代码 (function (factory) { if (typeof define === 'function' && define.amd) { // AMD define([ ...
- 深入理解JVM虚拟机1:JVM内存的结构与永久代的消失
所有的Java开发人员可能会遇到这样的困惑?我该为堆内存设置多大空间呢?OutOfMemoryError的异常到底涉及到运行时数据的哪块区域?该怎么解决呢?其实如果你经常解决服务器性能问题,那么这些问 ...
- Mac -- pkg-config: exec: "pkg-config": executable file not found in $PATH
just run: brew install pkg-config