1.RecycleView简介
从Android 5.0开始，谷歌公司推出了一个用于大量数据展示的新控件RecylerView，可以用来代替 传统的ListView，更加强大和灵活。 RecyclerView是一个强大的滑动组件，与经典的ListView相比，同样拥有item回收复用的功能，这 一点从它的名字Recyclerview即回收view也可以看出。 RecyclerView 支持 线性布局、网格布局、瀑布流布局 三种，而且同时还能够控制横向还是纵向滚 动。
1.2RecycleView纵向排列使用
1.2.1 第一步：布局
步骤就是
1. 在主布局中引入控件
2. 编写好子项布局
布局第一步：主要是在主布局中引入RecyclerView控件
注意：因为是远程导入的，所以需要把完整的包名写出来 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="15dp"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/rv_v_view"/>
</LinearLayout>布局第二步：创建子布局，然后在子布局中，写好自己的子项布局
addressbook_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/iv_icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tv_name"/>
</LinearLayout>1.2.2 第二步：代码
步骤就是
1. 编写实体类
2. 创建适配器
3. 在主活动中使用
代码第一步：编写实体类
这个主要是看你想做一个怎么样的项目来定，在本课程，做一个左边显示图标图片，右边显示名字的简 单项目，就需要名字与图片id
AddressBook.java
public class AddressBook {
private String name;
private int imageId;
public AddressBook(String name, int imageId) {
this.name = name;
this.imageId = imageId;
}
public String getName() {
return name;
}
public int getImageId() {
return imageId;
}
}
代码第二步：创建适配器
1. 创建一个新类：AddressBookAdapter继承RecyclerView.Adapter，并且将泛型指定为 AddressBookAdapter.ViewHolder。 一开始这么写会报错，因为ViewHolder是一个内部类，我们 还没有定义。所以接下来我们就定义内部类。这个内部类的作用主要是通过传入的一个参数view， 从而获取RecyclerView子项的最外层布局，然后通过findViewById()方法获取控件的实例（在本例 子中获取的是ImageView和TextView）。 2. 定义全局变量mList，生成构造函数。 这个构造函数是用来把要展示的数据源（图片、名字）传进 来，并赋值给mList。 3. 重写onCreateViewHolder()方法 这个函数主要是用来加载子项布局（addressbook_item），然后 创建ViewHolder实例并把子项布局传入到构造函数中，最后返回ViewHolder实例。 4. 重写onBindViewHolder()方法 这个方法是用来对传入的子项布局进行赋值的，也就是说当子项布 局被传入进来，是它让布局有了名字、图片。它会在每个布局被滚动到屏幕的时候执行。在本例子 中，是通过position参数得到当前项的AddressBook实例，然后再把数据设置到ViewHolder的 ImageView和TextView里。 5. 重写getItemCount()方法 这个方法主要是用来返回数据源的长度，也就是告诉RecyclerView他有多 少个子项
AddressBookAdapter.java
public class AddressBookAdapter extends
RecyclerView.Adapter<AddressBookAdapter.ViewHolder> {
private List<AddressBook> mList;
static class ViewHolder extends RecyclerView.ViewHolder{
ImageView AddressBookImage;
TextView AddressBookName;
public ViewHolder(@NonNull View view) {
super(view);
AddressBookImage = (ImageView)view.findViewById(R.id.iv_icon);
AddressBookName = (TextView)view.findViewById(R.id.tv_name);
}
}
public AddressBookAdapter(List<AddressBook> mList) {
this.mList = mList;
}
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int
viewType) {
View view =
LayoutInflater.from(parent.getContext()).inflate(R.layout.addressbook_item,paren
t,false);
ViewHolder viewHolder = new ViewHolder(view);
return viewHolder;
}
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
AddressBook AddressBook = mList.get(position);
holder.AddressBookImage.setImageResource(AddressBook.getImageId());
holder.AddressBookName.setText(AddressBook.getName());
}
@Override
public int getItemCount(){
return mList.size();
}
}
代码第三步：在主活动中使用
1. 获取RecyclerView的实例
2. 创建LinearLayoutManager对象
3. 创建AddressBookAdapter实例
4. 模拟数据
5. 将模拟数据传入AddressBookAdapter的构造函数中
6. 调用setAdapter()方法完成适配器设置
MainActivity.java
public class MainActivity extends AppCompatActivity {
// 模拟从服务器返回的结果数据
private String[] names = {"庄周","花木兰","刘禅","猪八戒","孙悟空","盘古","蒙
恬","后羿","李元芳","诸葛亮"};
private int[] imgs = {R.mipmap.cat, R.mipmap.chameleon, R.mipmap.dog,
R.mipmap.owl, R.mipmap.grizzly, R.mipmap.goose, R.mipmap.panda, R.mipmap.parrot,
R.mipmap.penguin, R.mipmap.squirrel};
// 组合的数据存放的地方
private List<AddressBook> list = new ArrayList<>();
private RecyclerView rv_v_view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
rv_v_view = findViewById(R.id.rv_v_view);
RecyclerView recyclerView = findViewById(R.id.rv_v_view);
//设置布局管理器
LinearLayoutManager layoutManager = new LinearLayoutManager(this);
recyclerView.setLayoutManager(layoutManager);
AddressBookAdapter fruitAdapter = new AddressBookAdapter(list);
recyclerView.setAdapter(fruitAdapter);
}
private void initData() {
for (int i = 0; i <names.length ; i++) {
AddressBook addressBook = new AddressBook(names[i],imgs[i]);
list.add(addressBook);
}
}
效果展示：
1.3 RecycleView横向排列
直接上代码：
public class MainActivity extends AppCompatActivity {
// 模拟从服务器返回的结果数据
private String[] names = {"庄周","花木兰","刘禅","猪八戒","孙悟空","盘古","蒙
恬","后羿","李元芳","诸葛亮"};
private int[] imgs = {R.mipmap.cat, R.mipmap.chameleon, R.mipmap.dog,
R.mipmap.owl, R.mipmap.grizzly, R.mipmap.goose, R.mipmap.panda, R.mipmap.parrot,
R.mipmap.penguin, R.mipmap.squirrel};
// 组合的数据存放的地方
private List<AddressBook> list = new ArrayList<>();
private RecyclerView rv_v_view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
rv_v_view = findViewById(R.id.rv_v_view);
RecyclerView recyclerView = findViewById(R.id.rv_v_view);
LinearLayoutManager layoutManager = new LinearLayoutManager(this);
// 只需要增加方向即可
layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
recyclerView.setLayoutManager(layoutManager);
AddressBookAdapter fruitAdapter = new AddressBookAdapter(list);
recyclerView.setAdapter(fruitAdapter);
}
private void initData() {
for (int i = 0; i < names.length; i++) {
AddressBook addressBook = new AddressBook(names[i], imgs[i]);
list.add(addressBook);
}
}
}
效果展示：
1.4 掌握并实现RecycleView网格排列效果
直接上代码：
public class MainActivity extends AppCompatActivity {
// 模拟从服务器返回的结果数据
private String[] names = {"庄周","花木兰","刘禅","猪八戒","孙悟空","盘古","蒙
恬","后羿","李元芳","诸葛亮"};
private int[] imgs = {R.mipmap.cat, R.mipmap.chameleon, R.mipmap.dog,
R.mipmap.owl, R.mipmap.grizzly, R.mipmap.goose, R.mipmap.panda, R.mipmap.parrot,
R.mipmap.penguin, R.mipmap.squirrel};
// 组合的数据存放的地方
private List<AddressBook> list = new ArrayList<>();
private RecyclerView rv_v_view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
rv_v_view = findViewById(R.id.rv_v_view);
RecyclerView recyclerView = findViewById(R.id.rv_v_view);
//设置布局管理器
GridLayoutManager gridLayoutManager = new GridLayoutManager(this,3);
recyclerView.setLayoutManager(gridLayoutManager);
AddressBookAdapter fruitAdapter = new AddressBookAdapter(list);
recyclerView.setAdapter(fruitAdapter);
}
private void initData() {
for (int i = 0; i < names.length; i++) {
AddressBook addressBook = new AddressBook(names[i], imgs[i]);
list.add(addressBook);
}
}
}
效果展示：
1.5 点击事件
RecyclerView的点击事件比ListView的点击事件更精确。 假如我是用的是ListView，那么我点击子项的时候，无论我点击图片还是文字，他都只知道，我点击了 子项。但是如果使用的是RecyclerView，他就可以准确地判断出我点击了文字还是图片！ 修改代码其实也很简单，只用修改适配器里的代码。主要是给最外层布局和图片加了点击事件，所以点 击图片的时候会有Toast，点击文字的时候因为没有给文字注册点击事件，所以会被最外层布局捕捉到， 相当于点击了最外层布局。
AddressBookAdapter.java
public class AddressBookAdapter extends
RecyclerView.Adapter<AddressBookAdapter.ViewHolder> {
private List<AddressBook> mList;
static class ViewHolder extends RecyclerView.ViewHolder{
View addressView;
ImageView AddressBookImage;
TextView AddressBookName;
public ViewHolder(@NonNull View view) {
super(view);
addressView = view;
AddressBookImage = (ImageView)view.findViewById(R.id.iv_icon);
AddressBookName = (TextView)view.findViewById(R.id.tv_name);
}
}
public AddressBookAdapter(List<AddressBook> mList) {
this.mList = mList;
}
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int
viewType) {
View view =
LayoutInflater.from(parent.getContext()).inflate(R.layout.addressbook_item,paren
t,false);
ViewHolder viewHolder = new ViewHolder(view);
viewHolder.addressView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
int position = viewHolder.getAdapterPosition();
AddressBook addressBook = mList.get(position);
Toast.makeText(v.getContext(), "你点击了这个布局",
Toast.LENGTH_SHORT).show();
}
});
viewHolder.AddressBookImage.setOnClickListener(new
View.OnClickListener() {
@Override
public void onClick(View v) {
int position = viewHolder.getAdapterPosition();
AddressBook addressBook = mList.get(position);
Toast.makeText(v.getContext(), "你点击了图片",
Toast.LENGTH_SHORT).show();
}
});
return viewHolder;
}
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
AddressBook AddressBook = mList.get(position);
holder.AddressBookImage.setImageResource(AddressBook.getImageId());
holder.AddressBookName.setText(AddressBook.getName());
}
@Override
public int getItemCount(){
return mList.size();
}
}2.Viewpager2
2.1简介：
ViewPager2 是基于 RecyclerView 实现的，自然继承了 RecyclerView 的众多优点，并且针对 ViewPager 存在的问题做了优化。 支持垂直方向的滑动且实现极其简单。 完全支持 RecyclerView 的相关配置功能。 支持多个 PageTransformer。 支持 DiffUtil，局部数据刷新和 Item 动画。 支持模拟用户滑动与禁止用户操作。
2.2具体使用
2.2.1布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.viewpager2.widget.ViewPager2
android:id="@+id/vp_imgs"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>2.2.2 Adapter
因为 ViewPager2 是基于 RecyclerView 的，所以在使用上与 RecyclerView 的使用基本一致，而且 Adapter 用的也是 RecyclerView.Adapter。
public class ViewPager2Adapter extends
RecyclerView.Adapter<ViewPager2Adapter.ViewHolder> {
private List<Integer> colors;
ViewPager2Adapter(List<Integer> colors){
this.colors = colors;
}
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int
viewType) {
return new
ViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.fragment_no
rmal,parent,false));
}
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
int i = position % 4;
holder.titleTv.setText("item " + i);
holder.container.setBackgroundColor(colors.get(i));
}
@Override
public int getItemCount() {
//实现无限轮播
return Integer.MAX_VALUE;
}
class ViewHolder extends RecyclerView.ViewHolder{
RelativeLayout container;
TextView titleTv;
public ViewHolder(@NonNull View itemView) {
super(itemView);
container = itemView.findViewById(R.id.container);
titleTv = itemView.findViewById(R.id.tv_title);
}
}
}
public class MainActivity extends AppCompatActivity {
private ViewPager2 vp_imgs;
private List<Integer> colors = new ArrayList<>(); //颜色
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initColors();
vp_imgs = findViewById(R.id.vp_imgs);
ViewPager2Adapter viewPagerAdapter = new ViewPager2Adapter(colors);
vp_imgs.setAdapter(viewPagerAdapter);
}
private void initColors() {
colors.add(Color.BLUE);
colors.add(Color.YELLOW);
colors.add(Color.GREEN);
colors.add(Color.RED);
}
}
}2.3. PageTransformer
setPageTransformer 是 ViewPager 中就提供的方法，用于设置页面切换动画效果。相较于 ViewPager 在 ViewPager2 中 setPageTransformer 的功能要更加的强大，除了可以设置页面切换动 画，还可以用来设置页面边距而且支持同时设置多个 PageTransformer 。 MarginPageTransformer ViewPager2 中取消了在 ViewPager 中的 setPageMargin() 方法，改为通过提供的 MarginPageTransformer 来设置页面间距。
MarginPageTransformer pageTransformer = new MarginPageTransformer(20);
vp_imgs.setPageTransformer(pageTransformer);2.4. CompositePageTransformer 与自定义 Transformer
上面我们提到了 ViewPager2 支持设置多个 Transformer 就是通过 CompositePageTransformer 实现 的。 CompositePageTransformer 类中通过 List 来维护多个 Transformer。
/设置Transformer
CompositePageTransformer compositePageTransformer = new
CompositePageTransformer();
//添加边距Transformer
compositePageTransformer.addTransformer(new MarginPageTransformer(20));
//添加缩放效果的Transformer
compositePageTransformer.addTransformer(new ScaleInTransformer());
vp_imgs.setPageTransformer(compositePageTransformer);上面的代码中除了系统提供的 MarginPageTransformer 还添加了一个 ScaleInTransformer ， ScaleInTransformer 就是我们自定义的 Transformer。 自定义 Transformer 的实现也很简单跟 ViewPager 中的实现基本一致，只不过需要继承实现的接口变 成 ViewPager2.PageTransformer ，同时实现 transformPage 方法即可， transformPage 方法有 两个参数：第一个是发生改变的页面对象，第二个是偏移量。 View page 发生改变的页面对象。 float position 页面偏移量，取值范围（-1,1）当前页面显示位置值为 0，页面向左滑动时，当 前页面从屏幕位置向左移动时取值从 0 变为 - 1，完全不可见时取值趋向 - 1，右侧页面向左移动到 当前屏幕位置取值从 1 变为 0，页面右滑时同理。
如图：
具体实现代码：
public class ScaleInTransformer implements ViewPager2.PageTransformer {
public static final float DEFAULT_MIN_SCALE = 0.85f;
public static final float DEFAULT_CENTER = 0.5f;
private float mMinScale = DEFAULT_MIN_SCALE
@Override
public void transformPage(@NonNull View page, float position) {
int pageWidth = page.getWidth();
int pageHeight = page.getHeight();
//动画锚点设置为View中心
page.setPivotX(pageWidth/2);
page.setPivotY(pageHeight/2);
if(position < -1){
//屏幕左侧不可见时
page.setScaleX(mMinScale);
page.setScaleY(mMinScale);
page.setPivotY(pageWidth / 2);
} else if(position <= 1){
if (position < 0) {
//屏幕左侧
//(0,-1)
float scaleFactor = (1 + position) * (1 - mMinScale) +
mMinScale;
page.setScaleX(scaleFactor);
page.setScaleY(scaleFactor);
page.setPivotX(pageWidth);
} else {
//屏幕右侧
//(1,0)
float scaleFactor = (1 - position) * (1 - mMinScale) +
mMinScale;
page.setScaleX(scaleFactor);
page.setScaleY(scaleFactor);
page.setPivotX(pageWidth * ((1 - position) * DEFAULT_CENTER));
}
} else{
//屏幕右侧不可见
page.setPivotX(0f);
page.setScaleY(mMinScale);
page.setScaleY(mMinScale);
}
}
}
2.5. 实现一屏多页效果
一屏多页也是一个相对比较常用的效果，先回顾下 ViewPager 中的实现方式。
1. 在ViewPager和父布局中设置
android:clipChildren="false"
2. 给ViewPager设置marginLeft和marginRight
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
虽然此方式在 ViewPager2 中此方式不起作用，但是实现原理是一样的。且因为 ViewPager2 是基于 RecyclerView 实现的，所以我们需要拿到 RecyclerView 来进行设置。
/预加载页面数量
vp_imgs.setOffscreenPageLimit(1);
//一屏多页
View recyclerView = vp_imgs.getChildAt(0);
if(recyclerView != null && recyclerView instanceof RecyclerView){
recyclerView.setPadding(100, 0, 100, 0);
((RecyclerView) recyclerView).setClipToPadding(false);
}使用 setOffscreenPageLimit 来设置 ViewPager2 至少预加载左右各一个页面，否则可能存在左右页 面未初始化，导致不显示问题。
效果如下：
