Android基础控件——ViewPager实现带有动画的引导页


好了,又到我们学习基础控件的时候了,其实引导页很简单,就是五张图片而已

传统的ViewPager实现引导页和ListView是一样道理的,只是把ListView的Item换成图片,把BaseAdapter换成PagerAdapter,我们先来看下传统引导页的效果图

既然用到的是ViewPager,那么xml文件就必须要有ViewPager,细心的你,可能会发现最后一页还有个按钮的出现,没错,xml文件中也要有个按钮

开头也说了,Viewpager其实就和ListView一样的,需要一个Adapter,那么就从Adapter入手。Google提供了一个专门适配ViewPager的Adapter——PagerAdapter

基本ViewPager的Adapter都是这么写的,就是往ViewPager中添加List传过来的View和删除List传过来的View,可以说是每个ViewPager的模板

我们找到对应的ViewPager,然后设置Adapter,代码中的initViews、initListener、initData是按顺序执行下去的,这段代码不难,很容易看懂

细心的你可能也发现了该引导页是没有状态栏的,所以我们需要设置其主题为状态栏透明

特别注意:这里需要注意的是图片的大小问题,如果图片高清太大,可能会出现内存溢出的错误。

带有动画的引导页编写步骤和传统是一模一样的,只不过给ViewPager设置一个动画。Google提供ViewPager.setPageTransformer(boolean reverseDrawingOrder, PageTransformer transformer)方法来设置引导页的切换效果,这里先看Google提供的切换Demo

从上面效果看出,只是在引导页之间添加了一个动画而已,而Google提供的PageTransformer就可以对当前位置的引导页进行操作,比如:设置透明度的变化,设置缩放的变化,就能实现切换的动画效果

从上面的代码中,可以知道在ViewPager滑动的时候,苏月会触发transformPage这个方法,并且会将当前的position和View传递过来,下面就是我们的对View的操作

① position

  1. position < -1(即-无穷到-1):让引导页消失,透明度为0
  2. position <=0(即-1到0):让引导页出现
  3. position <=1(即0到1):让引导页根据position做动画
  4. 剩下else(即1到无穷):让引导页消失,透明度为0

② 图解position

原谅我画图不好看,不生动,如果还不理解的话可以自己打印Log信息,把View和Position都打印出来帮助理解

使用PageTransformer非常简单,只要通过ViewPager设置即可

Google还为我们提供了另一个动画效果,看效果图

实现步骤其实和上面的步骤是一样的,具体我们来看PageTransformer的编写

这里的原理就不分析了,和上面是一样的,只不过操作不同而已。除了Google提供的Demo之外,我们可以模仿谷歌的Demo,编写出我们自己的动画效果

效果如图

好了,今天基础控件就到这里了,如果不懂的话可以自己实践一下,然后用纸笔思考思考,你就会有收获的。我也是通过博客学习别人的博客,然后通过自己的方式,将学习的内容写出来。我们一起加油,后来者们

原文地址:https://www.cnblogs.com/zhanglixina/p/9603678.html

时间: 2024-10-18 15:50:15

Android基础控件——ViewPager实现带有动画的引导页的相关文章

Android基础控件使用汇总

平时写代码总会遇到一些问题,准备写一个比较基础的控件使用汇总系列!本系列持续不定期更新,希望能够帮到需要的朋友!get! Android基础控件使用细节--TextView Android基础控件使用细节--Button Android基础控件使用细节--EditText Android基础控件使用细节--ImageView Android基础控件使用细节--WebView Android基础控件使用细节--ListView Android基础控件使用细节--Menu Android基础控件使用

Android基础控件——SeekBar的使用、仿淘宝滑动验证

学习,学习,学以致用 SeekBar是一个拖动条控件,最简单的案例就是我们的调节音量,还有音频视频的播放,传统的SeekBar样式,如图 传统的实现太简单,不足以让我们到能装逼的地步.本来是打算实现滴滴出行滑动完成订单的效果,可惜找不到效果图,今天也就用淘宝的滑动验证来作为实例 SeekBar:使用progressDrawable属性自定义SeekBar 拖动块:使用thumb属性更改,其实就是一张图片 文字:使用RelativeLayout嵌套在一起 其效果是 android:max:设置进度

Android基础控件——SwipeRefreshLayout最简单的下拉刷新

还在使用传统的下拉刷新,觉得不够漂亮,怕被产品经理骂吗? 还在忧愁自己技术不够好,不会改造带动画的下拉刷新吗? 那么不要担心,使用SwipeRefreshLayout最简单的下拉刷新,既不失美观又简洁 SwipeRefreshLayout下拉刷新是Google自家的下拉刷新控件,使用过程跟开源库PullToRefresh差不多,废话不多说,开车啦 SwipeRefreshLayout实质上是一个ViewGroup,所以我们将其作为我们的根布局进行演示 经过这个步骤之后,其实在页面上就已经能够下拉

Android基础控件ProgressBar进度条的使用

1.简介 ProgressBar继承与View类,直接子类有AbsSeekBar和ContentLoadingProgressBar, 其中AbsSeekBar的子类有SeekBar和RatingBar! android:max:进度条的最大值 android:progress:进度条已完成进度值 android:progressDrawable:设置轨道对应的Drawable对象 android:indeterminate:如果设置成true,则进度条不精确显示进度 android:indet

Android基础控件使用细节——ListView

这个系列准备了很久,由于项目比较紧,一直没时间写博客. ListView是Android开发中使用比较广泛的控件了,这里会结合实际开发中的问题,做一个汇总,并不断更新补充,希望以后可以帮到更多需要的朋友! 有时候为了精简代码,不使用xml布局文件了,直接setContentView(mListView);,这时就要用到代码里硬编码设置ListView的样式了,本人开发时遇到一个奇葩问题,给ListView设置分割线,没有效果,擦,坑爹呢,找了好多资料,遇到这问题的不是我一个人,竟然没人解决,有人

Android基础控件使用细节——WebView

在开发中经常会出现莫名其妙的问题,做个记录,方便以后汇总,该系列将不定期更新! WebView是android的一个组件,它的内核是基于开源WebKit引擎.如果我们对WebView进行一些美化.包装,可以非常轻松的开发出自己的浏览器. 1.禁止超链接的时候调用其他浏览器 今天调用网页显示控件,一组轮播图,根据服务器返回的URL连接做网页显示,同样的格式,有的可以正常在WebView中打开,有的会莫名其妙的弹出了浏览器选择框.很郁闷! 搜索了一下,找到解决方案,两步搞定,如下: step1:首先

Android基础控件之Button的基本使用

Button基本使用方法 首先,添加Button控件到XML布局文件中.也可通过程序添加. 在布局文件中设置按钮的一些属性,如位置,宽高,按钮上的字,颜色等. 比较重要的是要给按钮一个id号,这是按钮唯一的名字. 这样在程序中可以通过如下形式获得按钮: button = (Button)findViewById(R.id.buttonId); 处理按钮点击 按钮点击有两种处理方法. 第一种是通过onClick属性,通过这个属性设置处理点击事件的方法名,在Activity中实现这个方法. 另一种方

Android基础控件——RecyclerView实现拖拽排序侧滑删除效果

RecyclerView实现拖拽排序侧滑删除效果 事先说明: RecyclerView是ListView的升级版,使用起来比ListView更规范,而且功能和动画可以自己添加,极容易扩展,同样也继承了ListView复用convertView和ViewHolder的优点.   思路分析: 1.导包.在布局中使用RecyclerView 2.需要一个JavaBean用来存储展示信息 3.需要一个填充RecyclerView的布局文件 4.在代码中找到RecyclerView,并为其绑定Adapte

Android基础控件——ImageView的自定义,巧用Matrix实现图片不变形的炫酷PK条

前言 在开发中常常会遇到PK条制作,如果在PK条中是纯色的情况下,比较好办,如下:我们通常会设置其权重进行更新两个PK条的进度,实现起来也简单 //更新PkBar宽度比例 private void updateLayoutParams(float ratio) { LinearLayout.LayoutParams paramsLeft = (LinearLayout.LayoutParams) mLeftBar.getLayoutParams(); LinearLayout.LayoutPar