AIR的窗口外观修饰
?
这个教程主要针对对flex有一定基础,准备开始AIR开发的朋友。由于AIR是针对桌面应用程序,所以相对于flex的web应用,自然就多出了 对应用程序窗口的控制。而 AIR的一大特点就是允许开发者使用自定义的窗口代替系统窗口从而使开发者对程序UI的设计更加随心所欲,设计出独具个性风格的跨平台的桌面应用程序。 罗嗦的话到次为止,下面正式开始主题,本教程主要实现了以下功能。 1. 屏蔽系统窗口、 flash窗口、窗口底部状态栏。使用自定义窗口。 在实现以上操作的过程中,我加入了一些额外的操作来丰富我们的demo,都是很简单,很实用的东西。 3. 移动窗口时实现半透明效果,移动结束时还原。 1. 屏蔽系统窗口, flash窗口,窗口底部状态栏。使用自定义窗口。 <!– The type of system chrome to use (either “standard” or “none”). Optional. Default standard. –> 去掉对systemChrome的注释,改为 <!– The type of system chrome to use (either “standard” or “none”). Optional. Default standard. –> 这样我们就去掉了系统窗口,转而使用了flash的自带窗口,下面我们把flash窗口也去掉。在你的主mxml文件中设置WindowedApplication 的这些属性 <mx:WindowedApplication showTitleBar=”false” borderThickness=”0″ showStatusBar=”false” showGripper=”false” ….. /> 这样就完全去掉了所有的窗口,程序运行后只显现应用程序的内容。大家可以参考帮助手册来了解以上属性的意思。说到这里就引出了下一个问题,屏蔽了所有窗口以后如何对窗口进行基本的,放大,缩放,关闭操作呢。我们看下面。 2. 对自定义窗口的缩放,移动,关闭。 this.nativeWindow.startResize(”L”); 很容易可以看出,L R B T代表 Left,Right,Bottom 和 Top,所以在调用startResize时设置适当的参数我们就可以轻易的实现对窗口各个方向的缩放。对于窗口的移定,在mouseDown event中使用 this.nativeWindow.startMove(); 而对窗口的关闭,则很简单的在按钮click事件调用this.close()。 好了,以上就是对自定义窗口的操作。下面的东西我是用来完善我的demo,使它cool一点。相信大家在自己的应用程序中也会需要类似的东西,一个应用程序除了功能,细节上的处理也是很重要的。 3. 移动窗口时实现半透明效果,移动结束时还原。 <!– Whether the window is transparent. Only applicable when systemChrome is none. Optional. Default false. –> 这个可以允许我们让应用程序的背景透明,这个很有用,比方说QQ宠物就是一个背景透明的应用程序,利用背景透明,我们可以开发出很独特的应用程序。接下来要做的就简单了。 在上面移动窗口的mouseDown事件中加入 this.alpha = 0.x; 下面是demo中的代码。我将透明度设为0.6,this. alpha只针对应用程序的背景设置透明,如果你想让更多的东西透明,只需要对相应的控件设置alpha既可。 private function moveMe():void{ 让透明还原我在mouseUp事件中设置alpha =1; private function mouseUpHandle():void{ 这样简单的设置也许就会使你的应用程序看起来不一样,怎么不试试呢:) 4. 关闭窗口动画。 <mx:WindowedApplication closeEffect=”irisIn” ….. /> <mx:Iris id=”irisIn” duration=”500″ showTarget=”false” /> 5. 窗口背景填充。 private function setBackground():void{ var backgroundImage :Bitmap; backgroundImage = new bg(); workarea.graphics.beginBitmapFill( backgroundBitmapData,null,true );
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |