转自riameeting
原文地址http://www.riameeting.com/node/407
说起启动界面,相信读者都很熟悉,当一个软件体积很大,导致加载比较缓慢的时候,通常的做法是显示一个启动界面,告诉用户这个软件正在启动,这在很大程度上改善了用户体验,因为用户通常情况下忍受不了软件的加载速度不是因为你的软件加载慢,而是你没有显示一个界面出来通知用户,这会让用户心理上感觉时间很漫长,可能几秒钟用户都无法等待,而如果有实时的界面显示,几十秒都不是很大的问题,举个例子,Adobe的Photoshop大家可能用过或接触过,它的体积是很大的,如果没有启动界面,你就会感觉启动无法忍受,甚至会怀疑自己点击错误没有成功启动Photoshop而去多点击几下。所以说启动界面在大体积的软件加载过程中的作用是非常大的,也是我们在软件设计的阶段需要考虑到的一个重要的问题。
同理我们在开发AIR应用(注意AIR也是桌面应用)的时候,也可以引入启动界面的机制。下面我们来看看如何在AIR开发中去实现这个功能。
首先需要先准备一张位图,这个图片用于你的程序加载完毕并显示之前,先显示给用户一个界面,可以是你的应用的Logo之类的,你可以用Photoshop或其它的位图处理工具来制作这个图片,在这个例子中,要使用的位图如下图所示:
下面让我们来看看实现的过程。首先我已经在Flex Builder中创建了一个AIR项目,并且我的主程序文件是基于“WindowedApplication”组件的,并且其它的弹出窗口是基于Window或其它的可弹出的绘图组件。window组件使用是非常方便的,所以这里我也将使用window作为我的启动界面的容器,并且需要设置的地方是去除这个Window的边框和系统样式,只保留要显示的那张位图。要删除系统边框和样式,你需要修改应用程序的配置XML并且更改以下的部分:
<systemChrome>none</systemChrome>
<transparent>true</transparent>
<visible>false</visible>
注意通过这样设置之后,系统默认将显示Flex的默认皮肤。在主程序文件的窗体中,这个样式非常酷,但是在启动界面的窗体中,我们还是需要把它的边框删除掉。你可以通过下面的设置来隐藏边框和皮肤:
type="lightweight"
showFlexChrome="false"
transparent="true"
visible="false"
然后我们希望启动界面的位置要处于屏幕的中央,可以通过更改这个窗体的坐标来实现,注意窗体跟Flash里其它的显示对象类似,也有自己的坐标定位(x,y),而计算它的位置我们又需要知道屏幕的尺寸,屏幕的尺寸我们可以通过Screen类来获取,代码示例如下:
private function init():void {
this.nativeWindow.x = Screen.mainScreen.visibleBounds.width/2 - this.width/2;
this.nativeWindow.y = Screen.mainScreen.visibleBounds.height/2 - this.height/2;
this.nativeWindow.visible = true;
}
在显示启动界面的同时,我们希望主界面是隐藏的,只是设置visible是false是不够的,我们同时给它设置坐标值是一个很大的负值,比如-2000,然后我们再添加启动界面到显示列表。
<x>-2000</x>
<y>-2000</y>
mainWindow = this.stage.nativeWindow;
mainWindow.visible = false;
splashScreen = new Splash_Window();
splashScreen.open();
在这个应用里,我只是简单的添加了一个Timer(计时器)来控制启动界面和主界面的显示/隐藏,实际上你在开发的时候可以根据具体的真实情况(比如数据的加载情况),来实时的控制这个过程。
源码下载地址:
http://ultravisual.co.uk/blog/sourceFiles/splash_screen_src.zip
分享到:
相关推荐
在 Flash Professional 中创建您的第一个 AIR for Android 应用程序 创建第一个用于 iOS 的 AIR 应用程序 使用 Dreamweaver 创建第一个基于 HTML 的 AIR 应用程序 使用 AIR SDK 创建第一个基于 HTML 的 AIR 应用...
使用Flex SDK创建第一个桌面AIR应用程序
《air范例精解-创建、修改、重用》-书配源码,删掉第12章有个太大的视频(可用任一视频文件代替),不便之处,请谅解 AIR(Adobe Integrated Runtime,Adobe 集成运行环境)的出现是对RIA(Rich Internet ...
Android移动应用开发 基于Adobe AIR内容简介:《Android移动应用开发:基于AdobeAIR》共四部分19章,主要介绍如何使用AdobeAIR开发Android移动应用,深入讲解Android移动开发特有的各种主题,力图帮助读者创建高品质...
AIR2.0调用应用程序AIR2.0调用应用程序AIR2.0调用应用程序AIR2.0调用应用程序AIR2.0调用应用程序AIR2.0调用应用程序AIR2.0调用应用程序
AIR2.0 调用应用程序 修正AIR2.0 调用应用程序 修正AIR2.0 调用应用程序 修正AIR2.0 调用应用程序 修正AIR2.0 调用应用程序 修正AIR2.0 调用应用程序 修正AIR2.0 调用应用程序 修正AIR2.0 调用应用程序 修正 ...
Adobe Integrated Runtime (AIR) 是一个跨操作系统的运行时,利用现有的Web 开发技术 (Flash,Flex,HTML,JavaScript,Ajax)来构建富Internet 应用程序并部署为桌面应用 程序。 AIR 支持现有的Web 技术如Flash,...
AIR应用开发中文指南(BETA2).pdf
使用HTML和AJAX开发AIR应用程序的中文帮助文档,很不错!
使用 Adobe Flex 3 开发 Adobe AIR 1.1 应用程序
用flex开发了一个air的应用,适用于初学者,引领初学者入门,高手勿下。
解压密码:123 ||Air Cluster Pro是一个强大而简单...总之,Air Cluster Pro是一个令人难忘的应用程序,用于加入和管理您的云空间很容易。安装说明:https://blog.csdn.net/hongfu951/article/details/11 解压密码:123
一个简单的air应用 用flash开发的air程序,仅供参考
flash as AIR 天气预报 桌面应用程序 内含源文件
在 Adobe AIR 应用程序中对 PDF 内容进行跨脚本编写 拖动、复制和粘贴数据 读写 XML 首选参数文件 处理停靠栏和系统任务栏 异步处理本地 SQL 数据库 同步处理本地 SQL 数据库 处理窗口和菜单 控制窗口的显示...
使用AdobeAIR开发android应用
独立air应用程序打包的附件..................
全书共16章,分为五个部分:准备篇(1~2章) 主要介绍了利用AIR开发Android应用之前需要了解的基本信息、开发环境的搭建,以及一个简单的AIR Android应用开发的全过程,旨在让读者对AIR Android应用开发有一个全面...
一个AIR开发的免费的屏幕标注系统, 带聚光灯和幕布, 幕布可更换背景图, 是教学和PPT的好助手. 需要安装Adobe AIR运行环境支持.
Flash创建AIR