你的位置:首页 > Java教程

[Java教程]轻松实现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");  });});

 完全的项目代码参考:https://github.com/do-project/code4do/tree/master/demoECode