基于JS实现Android,iOS一个手势动画效果
更新时间:2016年04月27日 09:42:39 作者:AndButcher
这篇文章主要介绍了基于JS实现Android,iOS一个手势动画效果 的相关资料,需要的朋友可以参考下
废话不多说了,先给大家展示下效果图:
这是iOS下的效果,android下完全一致。通过do_GestureView组件和do_Animation组件,deviceone能很容易实现复杂的跨平台纯原生动画效果,这个示例就是通过手势控制图片上下动画滑动实现开合效果,还支持声音效果。
下面是主要的代码
//index.ui.js var do_Animator1 = mm("do_Animator"); do_Animator1.append(500, { y: -1334, curve:"Linear" }); var do_Animator2 = mm("do_Animator"); do_Animator2.append(500, { y: 0, curve:"Linear" }); do_Page.on("NextPagemoveing", function(){ currentView=json_define[currentIndex].view; currentIndex++; if (currentIndex>=json_define.length) currentIndex=0; nextView=json_define[currentIndex].view; for(var i=0;i<json_define.length;++i){ if (json_define[i].view != currentView && json_define[i].view != nextView){ json_define[i].view.visible=false; } else{ json_define[i].view.visible=true; } } currentView.fire("closingBottom", "NextPagemove"); }); do_Page.on("NextPagemove", function(){ nextView.fire("initMoving", "NextPagemoved"); }); do_Page.on("NextPagemoved", function(){ currentView.y= 0; nextView.y= 1332; do_ALayout_main.y=0; do_ALayout_main.redraw(); do_ALayout_main.animate(do_Animator1, function(){ nextView.fire("opening"); }); }); do_Page.on("PrePagemoveing", function(){ currentView=json_define[currentIndex].view; currentIndex--; if (currentIndex<0) currentIndex=json_define.length -1; nextView=json_define[currentIndex].view; currentView.fire("closingHead", "PrePagemove"); }); do_Page.on("PrePagemove", function(){ nextView.fire("initMoving", "PrePagemoved"); }); do_Page.on("PrePagemoved", function(){ for(var i=0;i<json_define.length;++i){ if (json_define[i].view != currentView && json_define[i].view != nextView){ json_define[i].view.visible=false; } else{ json_define[i].view.visible=true; } } currentView.y= 1332; nextView.y= 0; do_ALayout_main.y=-1334; do_ALayout_main.redraw(); do_ALayout_main.animate(do_Animator2, function(){ nextView.fire("opening"); }); });
相关文章
JavaScript求一组数的最小公倍数和最大公约数常用算法详解【面向对象,回归迭代和循环】
这篇文章主要介绍了JavaScript求一组数的最小公倍数和最大公约数常用算法,结合实例形式分析了javascript基于面向对象,回归迭代和循环等算法求解一组数的最小公倍数与最大公约数相关操作技巧,需要的朋友可以参考下2018-05-05uniapp实现h5、app与微信小程序三端pdf文件下载和预览功能
作为使用uni-app的小白来说,尝试了好几种方法,终于得到了我想要的效果,下面这篇文章主要给大家介绍了关于uniapp实现h5、app与微信小程序三端pdf文件下载和预览功能的相关资料,需要的朋友可以参考下2022-12-12javascript中substring()、substr()、slice()的区别
在js中字符截取函数有常用的三个slice()、substring()、substr()了,下面我来给大家介绍slice()、substring()、substr()函数在字符截取时的一些用法与区别吧。2015-08-08
最新评论