java 怎样做出完美动画，（包括透明效果）

 <cnmm22动感原创：http://blog.youkuaiyun.com/cnmm22/article/details/44854635>


有一张 gif 

我处理了一下，拿到 java 上，直接 g.draw 是这个效果：

 

这已经是处理的极限，因为这张图做出来是为白底背景而作，而我的背景是黑底。


但，最终我做出来是这个效果：
 

可以看到我更酷了：羽毛的颜色完美融合，而且羽毛泛着荧光。
而且我的羽毛可以左右变换 ，我的羽毛在飘动，而且我的炮弹可以变色！

我是怎样做到的？？

要做到这个效果，你不能直接 g.draw gif ，因为gif 色深的问题，他不可能表现出这么完美的透明效果。

我是说，如果你不需要做出荧光的效果，你完全可以先加工好一张gif ，再在 java 里直接draw，很重要的，你在做 gif 的时候，要真正的做到背景透明，以避免像我们上面看到的，为白底做滴gif 在黑底上就不好使了，这时，前期的图片制作很重要，一定要跟美工先沟通好。

但这样，你只能跟我那样完美的泛光效果说拜拜了。

我是怎样做的？首先我把gif 动画的每一帧拆分开来，并且把他们每一张分别处理，处理包括1、魔术棒去除背景色；2、替换跟白色相关的背景色为透明色；3、在Fireworks 下做出荧光的效果，并最终把他们保存成支持更高色深的png格式。当然你也可以在PS下做。

完成后：




现在我说说跟 java 绘制有关的东西，这里涉及至少 2个知识点：

首先，静态引入图片，我先做一个静态代码块。


 
其中 tk 是 static Toolkit tk = Toolkit.getDefaultToolkit();  ，这是常规的做法。为什么要用静态代码块？因为他们在内存中我只需要放一份，而且最好是预先加载。

这里我没有用我在上一篇  关于awt 不实用第三方类库 实现 图片旋转，变形等处理 <http://blog.youkuaiyun.com/cnmm22/article/details/44628881>   里说到的 MediaTracker ，于是我用了一段代码来预加载，避免游戏开始的时候图片显示不出来：
  public void draw(Graphics g) {

if (!first) {

for (int i = 0; i < imgs1.length; i++) {

g.drawImage(imgs1[i], -466, -466, null);

}

for (int i = 0; i < imgs.length; i++) {

g.drawImage(imgs[i], -466, -466, null);

}

first = true;

}

这个 first 的作用就看出来了。

好，接下来是重点，怎样显示图片。重点在于处理透明 ，而我也只用短短两段代码完成核心功能：
 

其中红色的代码是对图片做透明处理，你可以复制粘贴使用：

((Graphics2D) g).setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_ATOP, alpha));

g.drawImage(imgs1[step], x - 46, y - 59, null);

((Graphics2D) g).setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_OVER)); 

这之前要先声明 ：float alpha = 0.7f; // 透明度

要做出我那样酷的动画还有几个细节要注意，我这里也一并解释一下：首先，看到我这里的代码分城了两部分，来针对我的炮筒方向不同绘制我翅膀不同的方向，就是最外层的 if。

其次， step++ 完成了所有动画逐帧播放的功能。

但最后发现，这样，翅膀动的太快了，动画不柔顺，所以加入ii，ii=5，表示每播5帧我翅膀才动一下，不过这个肉眼根本感受不出来，最后看到的却是柔顺的效果，这里，ii 的取值要由你的帧速来决定，我是5就OK了，关键是要能想到这样去处理。

最后说说关于炮弹的变色是怎样做到的？

我把炮弹放大，可以看到


炮弹的最外层有一层透明的红色，核心就在于你要使用这样一层透明的颜色，并且把她保存成 png 格式。当很多炮弹重叠的时候，效果就出来了。

好了，结合我上一篇博文 “ 关于awt 不实用第三方类库 实现 图片旋转，变形等处理”，相信你对 java制作游戏和动画又有了一些信心。有人说了，我有CCSprite 我何必这么累？？当然我现在说的是java。