又是好几天没有更新博客了，真的很对不住大家了！这些天比较忙，忙东忙西的。先来我们继续AIR游戏的编写。
在一个游戏的开发过程中我们会遇到很多问题，尤其是界面部分，一个好的游戏，在用户体验上一定要做的有个性，非常优秀才可以。我们可以参照很多大公司的优秀案例来看一下。每个游戏都有不同的风格，我们来看看一些不错的案例！
卡通风格——跑跑卡丁车
这个游戏的最大特点就是卡通风格，而且画面很清新很亮丽。给人一种非常可爱的感觉。
而且在一些画面的处理上用了很多大面积的纯色色块，这样就使得画面更加协调，2D和3D画面结合的非常协调。
科幻风格——红色警戒
作为一款老牌的游戏，红色警戒给我们太多的回忆了。现在这个图片是红色警戒3的画面。从画面中我们可以看到很多科幻风格。玩家在游戏中可以体会到真实战争中的一些体验。比如，通讯，建筑等。这样，让玩家在一个环境体验中进行游戏。提高了游戏的体验度。
写实风格——模拟人生
模拟人生这款游戏的写实程度已经是非常高的了。其实我们可以把它归为模拟经营类游戏，这类游戏的最大特掉就是写实。虚拟人生不仅仅在游戏题材上进行这样的一个概念的描述，而且在画面上也非常的逼真。所以玩家在游戏中会有身临其境的感觉。
上面几款游戏大作我们就欣赏到这里吧。实际上在游戏开发初期，我们的界面还没有这样的成熟，需要后期喜欢并且调整。但是在制作前期我们一定找好我们的风格定位，到底属于哪种风格，需要哪些元素等等。可能一开始的界面感觉非常的糟糕，甚至说用户无法接受这样的游戏，但是没有关系，这仅仅是一个雏形。当一切都完善后都会有所改善的。下面我们来看一看我们这个《星际俄罗斯方块》的界面吧！这里只是一个界面的雏形，后期我们还有优化修改甚至是推翻，但是我们的定位就是“星际”。换句话说就是科幻，想《星球大战》那种感觉一样。
可能大家觉得这样的界面非常的糟糕，首先我们需要进行一下定位。为什么初期的界面需要这样。
1、你的开发团队可能会很小，也许只有一两个人，而且没有专业的美工
2、你的整体游戏还没有搭建完成，所以现在你需要制作出大体的框架
3、你的部分功能可能还有待完善，现在的界面也许后期可能会被推翻
好了，至于如何出现这样的界面，我们需要进行一个顺序的设计，首先是界面如何出现，怎么出现，什么时候出现。我们来编写一个简单的流程图！
那么根据这样一个简单的流程图我们就可以开始程序的编写了！首先出现的是loading的界面，考虑到本地加载速度会非常的快，所以我们的loading最好制作成一个movie影片，后面的logo和说面也可以制作成一个简单的影片。不过这些简单的小影片都是通过程序来实现的。为了突出我们这套教程的主体内容，我们还是用淡出淡入的画面来制作动画！同时要注意的是，我们使用的是新版的flashplayer11,AIR3。在程序运行的时候我们会调用GPU加速，所以我们会选择starliing这个引擎。
我们将这些个过渡动画全部编写为单独的类，下面我就通过片头类来看一下程序如何编写吧！
我们把片头动画自定义为一个类，这个类的名称就叫做TitlesAnimation。表示开始特效！
其中logo和说面等画面我们已经作为资源文件进行了加载，关于资源文件加载引擎部分大家可以去看我的上一篇文章AIR game （六） 资源管理模块
这里我就将关键代码贴出来，其实也非常的简单。代码中都包含注释，所以不做过多的讲解！
/**
* 加载图片
*
*/
private function init():void
{
this.imageVec.push(ResManage.getImage(“logoscene”) );
this.imageVec.push(ResManage.getImage(“gameinfoscene”) );
this.imageVec.push(ResManage.getImage(“state”) );
animation();
}
private function animation():void
{
this.imageVec[this.now_pic_index].alpha = 0;
this.addChild( this.imageVec[this.now_pic_index]);
//
var t:Tween = new Tween(this.imageVec[this.now_pic_index],2);
t.onComplete = showOver;
t.fadeTo(1);
Starling.juggler.add(t);
}
private function showOver():void
{
var t:Tween = new Tween(this.imageVec[this.now_pic_index],2);
t.onComplete = disOver;
t.delay = 1;
t.fadeTo(0);
Starling.juggler.add(t);
}
private function disOver():void
{
this.removeChild(this.imageVec[this.now_pic_index]);
this.now_pic_index++;
if(this.now_pic_index!=3)
{
this.animation();
}
else
{
var movieevents:AnimationEvents = new AnimationEvents(AnimationEvents.ANIMATION_OVER);
this.dispatchEvent(movieevents);
movieevents = null;
}
}
OK！关于画面初期架设的问题我们先暂时探讨到这里，有问题或者想交流的朋友欢迎给我发e-mail或者直接留言哈~！
