这个小程序作为我使用FLEX AIR做的第一个正式的程序,虽然看起来很简单,但还是涵盖了很多关于FLEX及FLEX AIR开发的知识点和一些细节上的小难点,正所谓麻雀虽小,五脏俱全,本人觉得对于初学者来说还是很有用的。下面是这个程序涵盖的知识点:
1、Timer的应用。如果使用JAVA制作抽奖程序来实现屏幕手机号的滚动效果,一般人都会想到使用线程,因为线程的wait方法可以控制手机号滚动的速度,另外suspend和resume方法也可以实现抽奖的暂停和恢复。但是很遗憾,FLEX不支持多线程,就只能使用Timer类来模仿线程的效果。
2、对文件的读写。抽奖时需要读取抽奖文件中的手机号,在抽取之后将中奖号码输出到新的中奖文件中,并将中奖手机号从抽奖文件中删除。
3、一些基本类的使用,如字符串处理和随机数生成等,这里是核心业务逻辑。
4、事件处理。如Timer事件和按键事件。事件和事件处理是FLEX的核心。
5、简单的特效使用,可以让你的程序看起来更炫。
6、AIR程序UI的设置。包括全屏显示、去掉AIR默认边框、背景透明等。
7、AIR程序的属性设置、发布和安装。
需求:
1、一个全屏显示的抽奖程序,中间一个Label滚动手机号,按下空格或回车后label停止滚动,显示中奖号码,中间四位掩盖。
2、从指定位置读取手机号码(一行一个号码)文件中的手机号,中奖号码输出到指定文件中以方便查阅记录,号码不能重复中奖。
使用工具:
FLEX BUILDER或FLEX BUILDER ECLIPSE PLUGIN皆可。
实现步骤:
1、建立AIR工程,FILE->NEW->FLEX PROJECT,工程名称为lot,下面的APPLICATION TYPE选择DESKTOP APPLICATION->FINISH.
2、UI显示设置:
在lot-app中设置背景透明:
<systemChrome>none</systemChrome>
<transparent>true</transparent>
在lot.mxml中设置去掉FLEX默认边框:
在<mx:WindowedApplication/>中设置showFlexChrome="false",如果你想让程序一直在前台可以设置alwaysInFront="true".
设置全屏显示:
我们需要程序一开始就是全屏显示的,全屏显示可以使用如下语句:
systemManager.stage.displayState = StageDisplayState.FULL_SCREEN_INTERACTIVE;
通常我们可能会想到在<mx:WindowedApplication/>中设置initialize或createComplete来调用上面的语句来实现开始全屏,但是我们实际操作发现会出错,提示空对象操作。这是为什么呢?因为在组件创建过程中stage并未被实例化,直到整个程序初始化结束后才被实例化,因此我们需要使用applicationComplete来调用。
设置面板大小为1024*768,这部看自己喜好来定。
设置面板不自动显示滚动条,因为这个程序是要在电视直播中使用,除了面板背景图片和显示号码的LABEL,其他的东西都不应该显示出来,因此我们要把滚动条全部去掉,通过在<mx:WindowedApplication/>中设置verticalScrollPolicy="off" horizontalScrollPolicy="off".
3、添加特效:
我们要给程序添加打开、关闭IRIS特效,在MXML中添加如下代码:
<mx:Iris id="irisIn" duration="500" showTarget="false"/>
<mx:Iris id="irisOut" duration="500" showTarget="true"/>
然后在<mx:WindowedApplication/>中设置closeEffect="irisIn" creationCompleteEffect="irisOut" unminimizeEffect="irisOut" minimizeEffect="irisIn"
4、业务逻辑:
整个lot.mxml代码如下,不懂的地方请看注释:
因为FLEX自带的随机数类并不能满足我们的要求,于是我们要自己写一个随机数类,用来取出指定范围的随机数:建立util包,创建NumberUtilities.as,代码如下:
至此,程序代码部分完成。
5、程序的发布配置:
如果经调试,程序可以正常运行了,我们就可以发布程序了。
在lot-app.xml中进行配置:
这个是用户安装完程序后,在桌面上显示的快捷方式的名称:
<filename>短信抽奖程序</filename>
这个是安装程序中显示的:
<name>XXX节目短信抽奖</name>
这个是安装过程中显示的程序版本号:
<version>v1.0.2</version>
所有权……:
<copyright>XXXX@2009</copyright>
在第一个ICON处设置程序图标,理论上设置一个就可以了,该图标文件与MXML文件在同一目录下:
<image48x48>icon.png</image48x48>
至此程序发布前的工作完成了,接下来就可以发布程序了:
1、右键点工程->EXPORT->FLEX BUILDER->RELEASE BUILD->下面选择发布位置,NEXT
2、这时候需要创建一个数字证书,点create,填好必填项,确定,填写好password,FINISH
这时候你刚才设置的发布位置会有一个.air格式的安装包,你需要安装AIRADOBEINSTALLER才能安装,下载地址:
http://airdownload.adobe.com/air/win/download/latest/AdobeAIRInstaller.exe
安装好之后就可以打开AIR格式的安装包了。
程序安装之后在桌面会有快捷方式,点击即可运行程序了。
附注:本程序在显示手机号时因实际需要未对手机中间号码进行遮盖,如果需要可以使用字符串处理的API很简单地实现遮盖。
实际运行效果(图片显示不完整……):