ViewPager实现引导动画的效果|与Fragment结合实现多页面滑动

1,071 阅读4分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第27天,点击查看活动详情

👨‍🎓作者简介:一位喜欢写作,计科专业的大三菜鸟

🏡个人主页:starry陆离 的个人主页

如果文章有帮到你的话记得点赞👍+收藏💗支持一下哦

ViewPager实现引导动画的效果

ViewPager 以可滑动的格式显示视图或 Fragment。

记录一下通过viewpager实现滑动显示图片,步骤如下

  • 1.写布局文件,添加一个viewpager控件
  • 2.在Activity中获取实例
  • 3.创建一个数据-视图适配器adapter
  • 4.创建一个myViewPagerAdapter实例
  • 5.初始化数据
  • 6.将数据添加到适配器中
  • 7.布局与适配器绑定
  • 8.addOnPageChangeListener()添加事件响应

1.布局文件

布局文件很简单就添加一个viewpager控件即可,当然还有一个更新的控件是viewpager2,不过是新学我们从viewpager开始,之后学viewpager2就简单很多,因为估计两者的差别不大

 <?xml version="1.0" encoding="utf-8"?>
 <androidx.constraintlayout.widget.ConstraintLayout 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.viewpager.widget.ViewPager;
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         android:id="@+id/viewpager1">
     </androidx.viewpager.widget.ViewPager>
 </androidx.constraintlayout.widget.ConstraintLayout>

2.获取viewpager控件

在MainActivity中获取viewpager控件

 //        获取实例
         viewPager=findViewById(R.id.viewpager1);

3.数据-视图适配器adapter(介绍)

adapter与viewpager的关系 adapter是将数据渲染到视图的桥梁;创建适配器的步骤如下:

  • 1.继承自PagerAdapter抽象类
  • 2.重写抽象类中的方法getCount()和isViewFromObject()
  • 3.ctrl+o重写 生成:instantiateItem() 销毁:destroyItem()
  • 4.用一个imageViewList数组来存储图片数据,并创建构造函数初始化
  • 5.getCount()方法返回图片的数量
  • 6.instantiateItem()将图片数据加载到viewpager页面,返回加载的这个图片
  • 7.destroyItem()将图片从viewpager中移除

注意:需要为viewpager设置适配器,

适配器继承PagerAdapter,

并重写getCount、isViewFromObject、instantiateItem和destroyItem四个方法。

4.创建Adapter

第一步创建一个MyViewPagerAdapter继承自PagerAdapter抽象类,并重写其中的四个方法

image-20220928172415360

image-20220928172653099

5.初始化数据、布局与适配器绑定

回到MainActivity中,初始化数据、将ViewPager布局与MyViewPagerAdapter适配器绑定

image-20220928172924239

6.添加事件响应

为ViewPager控件添加点击事件

image-20220928173014903

7.效果展示

ad001

8.Gitee源码

Android_Java_Review: 学习--代码即笔记 (gitee.com)

ViewPager与Fragment结合实现多页面滑动

上次记录了ViewPager实现引导动画的效果,这次来实现一个类似的效果ViewPager与Fragment结合实现多页面滑动

主要使用到了FragmentPagerAdapter :用于连接ViewPager与Fragment的桥梁

复习ViewPager实现引导页:

  • 数据List+适配器Adapter+ViewPager

FragmentPagerAdapter的用法

  • 1.重写getItem() 获取fragment
  • 2.重写getCount() 返回fragment的实例个数

具体实现:

  • 1.设置布局,并给viewPager控件设置id
  • 2.获取到viewPager实例
  • 3.创建fragment页面(初始化数据)
  • 4.创建一个自定义的适配器myFragmentVPAdapter
  • 5.初始化数据
  • 6.获取MyFragmentVPAdapter实例,需要传入两个参数
  • 7.将ViewPager和myFragmentVPAdapter适配器绑定
  • 8.实现事件监听,和上一个demo一样

1.设置布局

布局还是很简单就是一个ViewPager

2.获取到viewPager实例

同样的在MainActivity中获取到viewPager控件

3.创建Fragment页面

可以看到我创建了一个名为MyFragment的碎片,因为我们等会要创建多个MyFragment对象,填充到ViewPager中,因此通过一个文本控件来区别不同的fragment页面

  • 1.声明文本控件变量
  • 2.外部通过newInstance实例化fragment,并带入外界传入的参数。参数存在Bundle对象中
  • 3.onCreate取出存在Bundle中的数据
  • 4.onViewCreated通过view找到布局中的文本控件并设置为外界传入的参数

4.创建适配器myFragmentVPAdapter

  • 1.自定义一个适配器类MyFragmentVPAdapter继承自FragmentPagerAdapter
  • 2.重写getItem()和getCount()方法
  • 3.在构造方法中初始化数据
  • 4.getItem返回当前的fragment
  • 5.getCount返回fragment的数量

这里getItem和getCount方法中我都采用的三元表达式,对fragment数据为空进行了处理。

5.初始化数据并绑定适配器

回到MainActivity中初始化数据并将ViewPager和myFragmentVPAdapter适配器绑定

6.实现事件监听

实现事件监听,和上一个demo一样

7.效果展示

ad002

8.Gitee源码

Android_Java_Review: 学习--代码即笔记 (gitee.com)