さっそく、最初にレンダリングをお見せしましょう:
これは 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"); }); });