这篇文章主要给大家介绍了关于机器人自定义引导玩转查看寻呼机的相关资料,文中通过示例代码介绍的非常详细,对各位机器人开发者们具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
ViewPager简介:
查看寻呼机(Android。支持。v4。查看。查看寻呼机)是机器人扩展包v4包中的类,这个类可以让用户左右切换当前的查看,实现滑动切换的效果。
注意:
查看寻呼机类直接继承了视图组类,也就是说它和我们经常打交道的线性布局一样,都是一个容器,需要在里面添加我们想要显示的内容。
查看寻呼机类需要一个寻呼机适配器适配器类给它提供数据,这个和列表视图类似。
ViewPager基础使用
具体步骤:
1.在布局文件里加入
安卓。支持。v4。查看。查看寻呼机
android:id='@ id/in_viewpager '
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
/安卓。支持。v4。查看。查看寻呼机
2.在活动中加载要显示的观点,通过动态加载布局得到一个个视角
mview list=new ArrayList view();
LayoutInflater lf=getLayoutInflater().来自(主要活动。这个);
视图视图1=左前。膨胀(r .布局。we _指标1,空);
视图视图2=左前。膨胀(r .布局。we _指标2,空);
view view 3=lf。膨胀(r .布局。we _指标3,空);
mviewlist。添加(视图1);
mviewlist。添加(视图2);
mviewlist。添加(视图3);
3.自定义PagerAdapter,以便将步骤2中的视图数据加载到查看寻呼机容器中
公共类ViewPagerAdatper扩展PagerAdapter {
私有ListView视图列表
公共视图页面读取程序(ListView mViewList ) {
这个。mview list=mview list
}
@覆盖
public int getCount() {
返回视图列表。size();
}
@覆盖
公共布尔值isViewFromObject(视图视图,对象对象){
返回视图==对象;
}
@覆盖
公共对象实例化项(视图组容器,int位置){
集装箱。添加视图(mviewlist。get(位置));
返回mviewlist。get(位置);
}
@覆盖
公共无效销毁项目(视图组容器,int位置,对象对象){
集装箱。移除视图(mviewlist。get(位置));
}
}
4.将查看寻呼机和自定义的寻呼机适配器关联起来
mIn_vp.setAdapter(新viewpageradtper(mViewList));
通过简单使用查看寻呼机,得到的展示效果,仅仅支持左右滑动,效果比较单一。
查看寻呼机进阶使用——实现跟随式小圆点效果
步骤:
1.添加小圆点
在布局中的设置如下:
相对布局
android:id='@ id/rl_dots '
Android:layout _ width=' wrap _ content '
Android:layout _ height=' wrap _ content '
Android:layout _ alignParentBottom=' true '
Android:layout _ center horizontal=' true '
Android:layout _ margin bottom=' 60dp '
线性布局
android:id='@ id/in_ll '
Android:layout _ width=' wrap _ content '
Android:layout _ height=' wrap _ content '
安卓:方向='水平'
/线性布局
图像视图
android:id='@ id/iv_light_dots '
Android:layout _ width=' wrap _ content '
Android:layout _ height=' wrap _ content '
Android:src=' @ drawable/light _ dot '/
/RelativeLayout
随后在线性布局中动态添加3个小黑点,小白点默认覆盖在第一个小黑点的上面。
在活动中的添加小黑点,代码如下:
私有void addDots() {
mOne _ dot=new ImageView(this);
mOne _ dot。设置图像资源(r . drawable。灰_点);
线性布局layout params layout params=新线性布局。布局参数(视图组LayoutParams。WRAP_CONTENT,ViewGroup .布局参数。WRAP _ CONTENT);
layoutParams.setMargins(0,0,40,0);
mIn_ll.addView(mOne_dot,layout params);
mTwo_dot=新ImageView(这个);
mTwo _ dot。设置图像资源(r . drawable。灰_点);
mIn_ll.addView(mTwo_dot,layout params);
mThree _ dot=new ImageView(this);
mThree _ dot。设置图像资源(r . drawable。灰_点);
mIn_ll.addView(mThree_dot,layout params);
setClickListener();
}
2.获得两个点之间的距离
实现小白点动态跟随的思路是:根据页面的移动,通过设置小白点的左边距来实现小红点的动态跟随。所以首先要得到两点之间的距离,根据页面移动的位置进行相应的操作。
需要注意的是:直接在onCreate()中获取小白点的左边距getLeft()结果为0。这是因为视图组件的布局必须在onResume回调之后完成。
因此,使用另一种方法:
mLight _ dots . getviewtreeobserver()。addOnGlobalLayoutListener(新视图树观察者。OnGlobalLayoutListener() {
@覆盖
public void onGlobalLayout() {
//获取两个点之间的距离
mDistance=mIn_ll.getChildAt(1)。getLeft() - mIn_ll.getChildAt(0)。get left();
mLight _ dots . getviewtreeobserver()。removeGlobalOnLayoutListener(this);
}
});
当布局更改或视图的可视状态更改时,将调用此事件。但是这个方法会被多次调用,所以需要在获取视图的宽度和高度后执行remove方法来移除listening事件。
3.监控页面的移动
mIn_vp.addOnPageChangeListener(新视图分页器。OnPageChangeListener() {
@覆盖
public void onpagesrolled(int position,float positionOffset,int positionOffsetPixels) {
//页面滚动时白点移动的距离,其位置通过setLayoutParams(params)不断更新
float leftMargin=mDistance *(位置position offset);
相对布局。layout params params=(relative layout。layout params)m light _ dots . getlayout params();
params . left margin=(int)left margin;
mLight _ dots . setlayoutparams(params);
}
@覆盖
public void on page selected(int position){
//页面跳转时,设置点的边距。
浮点leftMargin=mDistance * position
相对布局。layout params params=(relative layout。layout params)m light _ dots . getlayout params();
params . left margin=(int)left margin;
mLight _ dots . setlayoutparams(params);
}
@覆盖
public void onPageScrollStateChanged(int state){
}
});
}
在页面移动的过程中,小白点的位置可以根据m距离*(位置位置偏移量)实时更新。
这部分增加了一个新功能。点击小黑点直接跳转到对应的引导页面。具体逻辑是在小黑点的click事件中添加以下代码:
mIn _ VP . setcurrentitem(1);
在页面选择过程中,可以根据mDistance * position实时定位小红点的位置。
4.跳转按钮的实现
具体逻辑:当引导页到达最后一页时,出现跳转到主页的按钮。其他情况隐藏。
因此,可以将以下代码添加到on page scrolled (int position、float position offset、int position offset pixels)和onPageSelected(int position)方法中:
if(position==2){
mBtn_next.setVisibility(查看。可见);
}
跟随第一页到最后一页,然后点击按钮跳转到第一页,上面的逻辑就足够了。
但是当用户浏览到最后一页,再返回到感兴趣的上一页时,按钮仍然出现,不符合要求。因此,要改进逻辑并添加新的判断,逻辑如下:
如果(位置!=2mb TN _ next . get visibility()==View。可见){
mBtn_next.setVisibility(查看。不见了);
}
以上逻辑保证了按钮的正常显示,剩下的可以具体操作实现跳转到首页的逻辑。
——高级自定义酷动画
ViewPager自带setPageTransformer设置切换动画~
页面转换器(布尔反转绘制顺序,页面转换器转换器)需要传入两个参数。
第一个参数:如果为真,说明自定义pageTransformer需要页面视图从后向前绘制,否则为假。
第二个参数:传入自定义pageTransformer对象。
所以实现炫酷动画的关键在于:定制pageTransformer。
Google官方给我们展示了两个动画例子:DepthPageTransformer和ZoomOutPageTransformer,相当耀眼。让我们用Google的官方例子来学习如何定制pageTransformer。基于此,我们可以定制各种动画效果。
1.位置分析在1。页面转换器
自定义PageTransformer只需要实现一个方法,Transform Page(查看页面,浮动位置),而这个方法实现的关键是对位置的理解。
源代码中的注释解释如下:
将转换应用于此页面
position -页面相对于当前页导航的前端和中心位置的位置。0是前面和中间。1是向右一整页的位置,-1是向左一整页的位置。
我们可以理解为:
0表示当前页面,即当前页面。
-1表示左页,即左页。
1表示右页,就是右页。
当用户滑动界面时,位置会动态变化。以左边的幻灯片为例:
选择页面位置:0-1。
前一项位置:-1-2
下一个项目位置:1-0
但当ViewPager设置pageMargin并设置两页之间的距离(通过调用viewPager.setPageMargin()方法设置)时,情况就不一样了。
如果设置了pageMargin,则需要用偏移量(偏移量计算为pageMargin/pageWidth)来增加(或减少,在减少之前和之后)。
以同一张左侧幻灯片为例:
选择页面位置:0-1-页边距/页面宽度。
前一个项目位置:-1-页面边距/页面宽度-2-页面边距/页面宽度
以下项目位置:1页面边距/页面宽度-0
因此,我们可以将position的值应用于setAlpha()、setTranslationX()或setScaleY()等,从而实现自定义动画效果。
2.实现TransformPage(查看页面,浮动位置)方法
公共类DepthPageTransformer实现ViewPager。页面转换器{
私有静态最终浮点MIN _ SCALE=0.75f
@覆盖
公共void transformPage(查看页面,浮动位置){
int page width=page . getwidth();
if(位置-1){//[-无穷大,-1)
//离开左侧页面
page . set alpha(0);
} else if (position=0) { //[-1,0]
//页面从中间页面滑动到左侧页面,或者从左侧页面滑动到中间页面。
page . set alpha(1);
page . settranslationx(0);
page . setscalex(1);
page . setscaley(1);
} else if (position=1) { //(0,1]
//页面从中间页面滑动到右侧页面,或者从右侧页面滑动到中间页面。
//淡化效果
page.setAlpha(1位);
//向相反的方向移动
page.setTranslationX(页面宽度*-位置);
//标度在0.75-1标度之间
浮点比例因子=最小比例
(1 - MIN_SCALE) * (1 - Math.abs(位置));
page . setscalex(scale factor);
page . setscaley(scale factor);
} else { //(1,无穷大]
//离开右页
page . set alpha(0);
}
}
}
Github代码地址
以上是ViewPager作为引导页使用的一些知识点。希望和大家分享,一起学习。由于水平有限,如有不妥请指正。
总结
这就是本文的全部内容。希望这篇文章的内容对你的学习或工作有一定的参考价值。谢谢你的支持。
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。