| |
基本技术: 在java中实现动画有很多种办法,但它们实现的基本原理是一样的,即在 屏幕上画出一系列的帧来造成运动的感觉。 我们先构造一个程序的框架,再慢慢扩展,使之功能比较齐备。 使用线程: 为了每秒中多次更新屏幕,必须创建一个线程来实现动画的循环,这个循环 要跟踪当前帧并响应周期性的屏幕更新要求。实现线程的方法有两种,你可以创建 一个类thread的派生类,或附和在一个runnable的界面上。 一个容易犯的错误是将动画循环放在paint()中,这样占据了主awt线程,而 主线程将负责所有的绘图和事件处理。 一个框架applet如下: public class animator1 extends java.applet.applet implements runnable { int frame; int delay; thread animator; public void init() { string str = getparameter("fps"); int fps = (str != null) ? integer.parseint(str) : 10; delay = (fps > 0) ? (1000 / fps) : 100; } public vois start() { animator = new thread(this); animator.start(); } public void run() { while (thread.currentthread() == animator) { repaint(); try { thread.sleep(delay); } catch (interruptedexception e) { break; } frame++; } } public void stop() { animator = null; } } 在你的html文件中这样引用: 上面的参数fps表示每秒的帧数 保持恒定的帧速度: 上例中,applet只是在每两帧之间休眠一个固定的时间,但这有些缺点,有时 你会等很长时间,为了每秒显示十帧图象,不应该休眠100毫秒,因为在运行 当中也耗费了时间。 这里有一个简单的补救方法: public void run() { long tm = system.currenttimemillis(); while (thread.currentthread() == animator) { repaint(); try { tm += delay; thread.sleep(math.max(0,tm - system.currenttimemillis())); } catch (interruptedexception e) { break; } frame++; } } 画出每一帧: 剩下的就是将每一帧图象绘出。在上例中调用了applet的repaint() 来绘出每一帧图象。 public void paint(graphics g) { g.setcolor(color.black); g.drawstring("frame " + frame, 0, 30); } 生成图形: 现在我们来画一些稍微困难的东西。下例画了一个正弦曲线的组合, 对于每一个x,画一条短的垂直线,所有这些线组成了一个图形,并且每帧变化。 但不幸有些闪动,在以后我们将解释为什么闪以及怎样避免。 public void paint(graphics g) { dimension d = size(); int h = d.height / 2; for (int x = 0 ; x < d.width; x++) { int y1 = (int)((1.0 + math.sin((x - frame)*0.05))*h); int y2 = (int)((1.0 + math.sin((x + frame)*0.05))*h); g.drawline(x, y1, x, y2); } } 避免闪烁: 上例中的闪烁有两个原因:绘制每一帧花费的时间太长(因为重绘时要 求的计算量大),二是在每次调用pait()前整个背景被清除,当在进行下一帧的 计算时,用户看到的是背景。 清除背景和绘制图形间的短暂时间被用户看见,就是闪烁。在有些平台 如pc机上闪烁比在x window上明显,这是因为x window的图象被缓存过,使得闪烁 的时间比较短。 有两种办法可以明显地减弱闪烁:重载update()或使用双缓冲。 重载update()? 当awt接收到一个applet的重绘请求时,它就调用applet的update()。 缺省地,update()清除applet的背景,然后调用paint()。重载update(),将以前 在paint()中的绘图代码包含在update()中,从而避免每次重绘时将整个区域 清除。 既然背景不在自动清除,我们需要自己在update()中完成。我们在绘制 新的线之前独自将竖线擦除,完全消除了闪烁。 public void paint(graphics g) { update(g); } public void update(graphics g) { color bg = getbackground(); dimension d = size(); int h = d.height / 2; for (int x = 0; x < d.width; x++) { int y1 = (int)((1.0 + math.sin((x - frame)*0.05))*h); int y2 = (int)((1.0 + math.sin((x + frame)*0.05))*h); if (y1 > y2) { int t = y1; y1 = y2; y2 = t; } g.setcolor(bg); g.drawline(x, 0, x, y1); g.drawline(x, y2, x, d.height); g.setcolor(color.black); g.drawline(x, y1, x, y2); } } 双缓冲技术: 另一种减小帧之间的闪烁的方法是使用双缓冲,它在许多动画applet 中被使用。 主要原理是创建一个后台图象,将一帧画入图象,然后调用drawimage() 将整个图象一次画到屏幕上去。好处是大部分绘制是离屏的。将离屏图象一次 绘至屏幕上比直接在屏幕上绘制要有效得多。 双缓冲可以使动画平滑,但有一个缺点,要分配一张后台图象,如果图象 相当大,这将需要很大一块内存。 当你使用双缓冲技术时,应重载update()。 dimension offdimension; image offimage; graphics offgraphics; public void update(graphics g) { dimension d = size(); if ((offgraphics == null) || (d.width != offdimension.width) || (d.height != offdimension.height)) { offdimension = d; offimage = createimage(d.width, d.height); offgraphics = offimage.getgraphics(); } offgraphics.setcolor(getbackground()); offgraphics.fillrect(0, 0, d.width, d.height); offgraphics.setcolor(color.black); paintframe(offgraphics); g.drawimage(offimage, 0, 0, null); } public void paint(graphics g) { if (offimage != null) { g.drawimage(offimage, 0, 0, null); } } public void paintframe(graphics g) { dimension d = size(); int h = d.height / 2; for (int x = 0; x < d.width; x++) { int y1 = (int)((1.0 + math.sin((x - frame) * 0.05)) + h); int y2 = (int)((1.0 + math.sin((x + frame) * 0.05)) + h); g.drawline(x, y1, x, y2); } } 使用图象: 现在,我们将重写paintframe()来使图象动起来。这也就带来一些 问题,图象往往相当大,被一点点调入,将图象全部画出将花费很多时间,尤其 是通过一个较慢的连接,这也就是为什么drawimage带四个参数的原因,其中 第四个参数为一个imageobserver对象。通过调用getimage()得到图象。 在屏幕上移动一幅图象: world.gif作为背景,car.gif作为移动物体,且被绘制了两次,造成 一个两辆车比赛的场景。 image world; image car; public void init() { string str = getparameter("fps"); int fps = (str != null) ? integer.parseint(str) : 10; delay = (fps > 0) ? (1000 / fps) : 100; world = getimage(getcodebase(), "world.gif"); car = getimage(getcodebase(), "car.gif"); } public void paint(graphics g) { update(g); } public void paintframe(graphics g) { dimension d = size(); int w = world.getwidth(this); int h = world.getheight(this); if ((w > 0) && (h > 0)) { g.drawimage(world, (d.width - w)/2, (d.height - h)/2, this); } w = car.getwidth(this); h = car.getheight(this); if ((w > 0) && (h > 0)) { w += d.width; g.drawimage(car, d.width - ((frame * 5) % w), (d.height - h)/3, this); g.drawimage(car, d.width - ((frame * 7) % w), (d.height - h)/2, this); } } 显示一系列图象: 通过每一帧显示一幅图象来创建动画。我们仍用双缓冲的方法减小 闪烁。原
|
|