Animation 是 GWT 内的一个 class，名字取的很美妙， 实际上是在做什麽的呢？ GWT 的 showcase 给了一个示范， 不过里头的程式码实在有点古怪，姑且直接来看 1.6 版的 API doc 怎麽说。 An Animation is a continuous event that updates progressively over time at a non-fixed frame rate. 哈哈... 根本就是骗人的，哪来什麽动画 [笑]。 简单地说「Animation 是一个会持续要求 update 动作的物件。 而间隔的时间是不固定的。」阿？这什麽鬼？还是用程式码来说明好了... import com.google.gwt.animation.client.Animation; import com.google.gwt.user.client.ui.AbsolutePanel; import com.google.gwt.user.client.ui.Label; public class HelloAnimation extends AbsolutePanel{ private Label hello = new Label("Hello Animation"); private final int WIDTH = 800; private final int HEIGHT = 200; public HelloAnimation(){ this.setPixelSize(WIDTH, HEIGHT); this.add(hello); //要先加上去，才有办法移动 Player player = new Player(this); player.run(5*1000); //point-A } public void playOneFrame(double progress){ this.setWidgetPosition(hello, (int)(WIDTH*progress), HEIGHT/2); } }//end class HelloAnimation class Player extends Animation{ HelloAnimation target; public Player(HelloAnimation t){ target = t; } @Override protected void onUpdate(double progress) { target.playOneFrame(progress); } } 只要 new 一个 HelloAnimation，然後加到 RootPanel 上头去， 就会看「Hello Animation」从画面左边跑到右边。 （至於最後「Hello Animation」突然换行的状况，先跳过... XD） 里头两个 class 分别负责两件事情。 HelloAnimation 负责画面显示的部份，直接 extends AbsolutePanel， 搭配 AbsolutePanel.setWidgetPosition() 就可以很快速地设定 widget 的位置， 这样在上头的东西「动」起来就相对方便。 playOneFrame() 这个 method 就是在处理这件事情， 至於 progress 这个参数的作用，就必须回到 Animation （也就是范例程式里头的 Player）才能说明。 Player 这个 class 其实很简单，extends Animation 之後， 只有一个 method 必须实作，就是 onUpdate()。 这个 method 就是 API 提到的效果，当 Player 起作用的时候， onUpdate() 就会持续地被呼叫、并且给予不同的参数 progress 值， 值域介於 0～1 之间，会随着时间会越来越大，乘上 100 就是完成度啦， 因为实际负责「动」的物件是 HelloAnimation， 所以在呼叫 HelloAnimation.playOneFrame() 时候就原封不动地传进去。 这个参数在制作像动画这种东西时，就很方便， 因为 Animation 帮你算好 progress，不用自己动手。 像这个例子当中，「Hello Animation」要在指定的时间内横越指定的宽度， 但是在撰写 playOneFrame() 时完全不用理会「指定的时间」有多长， 只要把宽度乘上 progress 就解决了。 现在动画的长度是五秒钟（程式码 point-A）， 要改成两倍慢 or 两倍快，就只要在 player.run() 时给 10 秒 or 2.5 秒就可以了。 看到这里，是不是觉得 GWT 设计的很好、使用起来很简单呢？ [奸笑] 至於 Animation 的细节，我们下次再谈（初探嘛...） ======== 资料来源： http://pt2club.blogspot.com/2009/10/gwt-animation.html -- 侃侃长论鲜窒碍 首页：http://www.psmonkey.idv.tw 众目睽睽无心颤 Blog：http://ps-think.blogspot.com 茕居少聊常人事 杀头容易告白难 欢迎参观 Java 版（@ptt.cc） \囧/ --

※ 发信站: 批踢踢实业坊(ptt.cc) ◆ From: 61.20.154.197