目录:
一 Viewpager 的简单介绍
二简单的 Viewpager 使用
三简单显示图片的 Viewpager 实现
四广告图的实现及 Viewpager 指示器 (小圆点) 的实现
五 APP 引导页的实现
一 ViewPager 介绍
官方文档解释:
- Layout manager that allows the user to flip left and right through pages of data. You supply an implementation of a PagerAdapter to generate the pages that the view shows.
- ViewPager is most often used in conjunction with android.app.Fragment, which is a convenient way to supply and manage the lifecycle of each page. There are standard adapters implemented for using fragments with the ViewPager, which cover the most common use cases. These are android.support.v4.app.FragmentPagerAdapter and android.support.v4.app.FragmentStatePagerAdapter; each of these classes have simple code showing how to build a full user interface with them.
- Views which are annotated with the ViewPager.DecorView annotation are treated as part of the view pagers 'decor'. Each decor view's position can be controlled via its android:layout_gravity attribute. For example:
- <android.support.v4.view.ViewPager
- android:layout_width="match_parent"
- android:layout_height="match_parent">
- <android.support.v4.view.PagerTitleStrip
- android:layout_width="match_parent"
- android:layout_height="wrap_content"
- android:layout_gravity="top" />
- </android.support.v4.view.ViewPager>
- For more information about how to use ViewPager, read Creating Swipe Views with Tabs.
- You can find examples of using ViewPager in the API 4+ Support Demos and API 13+ Support Demos sample code.
大概的意思为:
布局管理器允许左右翻转带数据的页面, 你想要显示的视图可以通过实现 PagerAdapter 来显示这个类其实是在早期设计和开发的, 它的 API 在后面的更新之中可能会被改变, 当它们在新版本之中编译的时候可能还会改变源码
ViewPager 经常用来连接 Fragment, 它很方便管理每个页面的生命周期, 使用 ViewPager 管理 Fragment 是标准的适配器实现最常用的实现一般有 FragmentPagerAdapter 和 FragmentStatePagerAdapter
FragmentPagerAdapter 和 FragmentStatePagerAdapter 是 ViewPager 和 Fragment 一起使用时才会用到, 后面会详细介绍, 这里就不介绍了
二简单的 ViewPager 使用
使用方法其实与 Listview 和 RecyclerView 的方法类似
1. 布局文件使用 Viewpager
2. 定义一个适配器类使其继承 PagerAdapter, 复写其中的四个方法, 分别是 getCount,isViewFromObject,instantiateItem 和 destroyItem
- @Override
- public int getCount() {
- return 3;// 在 Viewpager 显示 3 个页面
- }
- @Override
- public boolean isViewFromObject(View view, Object object) {
- return view==object;
- }
- @Override
- public Object instantiateItem(ViewGroup container, int position) {
- TextView tv = new TextView(container.getContext());
- tv.setGravity(Gravity.CENTER);
- tv.setTextSize(20);
- tv.setText("第" + position + "页");
- // 添加到 ViewPager 容器
- container.addView(tv);
- // 返回填充的 View 对象
- return tv;
- }
- @Override
- public void destroyItem(ViewGroup container, int position, Object object) {
- container.removeView((View) object);
- }
3.findviewbyid 方法找到 viewpager
4. 设置适配器
效果图:
三简单显示图片的 Viewpager 实现
1. 布局中使用 viewpager
2. 定义一个适配器类使其继承 PagerAdapter, 复写其中的四个方法, 分别是 getCount,isViewFromObject,instantiateItem 和 destroyItem
- private int [] mImage;
- public AdvertiseViewpagerAdapter(int[] mImage) {
- this.mImage = mImage;// 接收传入的 mIamge
- }
- @Override
- public int getCount() {
- return 3;// 在 Viewpager 显示 3 个页面
- }
- @Override
- public boolean isViewFromObject(View view, Object object) {
- return view==object;
- }
- // 设置每一页显示的内容
- @Override
- public Object instantiateItem(ViewGroup container, int position) {
- ImageView imageView = new ImageView(container.getContext());
- imageView.setImageResource(mImage[position]);//ImageView 设置图片
- container.addView(imageView); // 添加到 ViewPager 容器
- return imageView;// 返回填充的 View 对象
- }
- // 销毁条目对象
- @Override
- public void destroyItem(ViewGroup container, int position, Object object) {
- container.removeView((View) object);
- }
这里注意看红色的代码, 我们在适配类中定义了一个成员变量, 用来接收参数传入的图片资源 id, 之后在 instantiateItem 方法中, new 一个 ImageView, 将其的图片设置为数组中存放的图片资源 id, 其他的代码与之前一样, 这里就不多解释了
3. 在 activity 文件中声明一个整型数组, 将图片资源 id 存放进去
4.new 一个适配器, 将整型数组传入
5.findviewbyid 找到 viewpager, 为其设置适配器
效果图:
四广告图的实现及 Viewpager 指示器 (小圆点) 的实现
本来开始写的时候, 我还是用的别人的库来实现小圆点功能, 之后, 研究了一下, 发现实现其实很简单, 想要了解的同学可以看我这一篇 Android 开发打造简单的 Viewpager 指示器(小圆点指示器)
今天写的就是拿别人的来使用
项目名称 CircleIndicator,github
第一步, 添加依赖
第二步, 在 xml 中使用
第三步, 为 circleIndicator 绑定 viewpager
效果图:
颜色有些白, 可能看得不太清楚
PS: 可以通过自定义属性修改颜色, 不过, 修改颜色就变成了正方形了, 不太懂是怎么回事
五 APP 引导页的实现
首先, 我们理解一下引导页的逻辑
这里有个问题, 如何才能判断是否是第一次进入 APP 呢? 其实很简单, 使用 SharedPreferences, 这里我不多说了
我这一篇有用到 SharedPreferences, 可以参考参考 Android 开发模板代码 (二) 为 ImageView 设置图片, 退出后能保存 ImageView 的状态
1. 在 xml 中使用 viewpager
这里我们还可以加上一个圆形指示器, 这样比较好看, 市场上的大部分 APP 都是有个圆形指示器的嘛, 我们也随主流
这里我们可以使用之前的那个开源库 CircleIndicator, 如果你是想实现移动的小圆点指示器, 打一波广告, 推荐使用开源库 CIrclePointMove
这个开源库是我用两天写出来的, 简单设置之后就能实现小圆点移动的功能
提示:
使用 RelativeLayout, 可以使得小圆点指示器显示在 Viewpager 上方
layout_above 该控件显示在 fragmentViewpager 的上方
layout_alignParentBottom 该控件是否贴近父布局的底部
2. 定义个适配类, 这里我们使用 viewpager 装载 fragment
我这里用了两个 Fragment, 一个 fragment 显示第一页, 来一个显示第二页
代码与之前类似, 相信大家也是看到明白, 不过, 这里提一下, ViewPager 的 FragmentAdapter 有两种, 一种是 FragmentPagerAdapter, 另外一种则是 FragmentPageStateAdapter, 这两种的区别在于, 前者在换到其他页时不会销毁之前的页面内容, 适合页面不多的情况使用, 后者则是换到其他页会将之前的页面给销毁, 返回到之前的页面就是重新加载, 适合页面过多的情况使用
3. 为 Viewpager 设置 adapter
4. 使用 CirclePointMove 实现小圆点跟随 viewpager 移动
5. 效果图
PS: 我这里只是简单地演示了 Fragment, 你也可以使用我上面的提示, 在下面加个按钮实现下一页, 需要使用到 Viewpager 的 setCurrentItem 方法, 参数为 position, 还有跳过功能, 直接显示出主界面
Demo
来源: https://www.cnblogs.com/kexing/p/8400929.html