Flash CS4设计天气预报程序.docx

1、Flash CS4 设计天气预报程序第18章 设计天气预报程序目前，互联网中已经存在很多种语言设计的天气预报程序，例如Ajax、HTML、ASP.NET、PHP、JSP等。其实在Flash中，通过ActionScript脚本语言与上述语言相结合使用，也可以设计出Flash版的天气预报程序，而且该程序可以承继Flash的优点。18.1 创建数据库及ASP页面Flash的ActionScript语言属于客户端语言，利用它可以在客户端实现比较绚丽的效果。但是，它无法直接对服务器端的文件和数据库进行操作。如果想要与服务器端的程序进行通信，则必须与服务器端语言（ASP、PHP、JSP等）相结合使用。18

2、.1.1 创建数据库数据库是用于存储数据信息的系统，通过其它语言程序可以读取数据库中的信息，或将信息存储到数据库中。本例中创建的数据库用于存储获取的天气预报信息，以及为天气预报程序提供数据来源。数据库结构如图18-1所示。图18-1 数据库创建过程：（1）在电脑的【开始】菜单中，执行【所有程序】|【Microsoft Office】|【Microsoft Office Access 2007】命令，打开Access 2007数据库，如图18-2所示。图18-2 打开Access 2007数据库Microsoft Office Access 2007是关联式数据库管理系统，用于存储数据信息，是M

3、icrosoft Office 2007的成员之一。在创建数据库之前，首先需要确认电脑中是否已经安装此程序。（2）在【Microsoft Access】界面中选择【模板类别】选择面板中的【功能】选项。然后，选择【新建空白数据库】选项面板中的“空白数据库”选项，如图18-3所示。图18-3 选择空白数据库（3）在界面右下角弹出的【空白数据库】界面中，单击【文件名】文本框右侧的【打开文件】按钮，即会弹出【文件新建数据库】对话框，如图18-4所示。图18-4 打开【文件新建数据库】对话框（4）在【文件新建数据库】对话框中选择要保存数据库的位置，本例中的数据库保存在IIS主目录（F盘下的myWeb文件

4、夹）下的“weatherReport”文件夹内，并为数据库命名为“weather”，如图18-5所示。图18-5 选择数据库保存路径（5）单击【确定】按钮后，在【Microsoft Access】界面的右下角即会显示数据库所要保存的路径和名称，如图18-6所示。18-6 显示数据库路径和名称（6）单击【创建】按钮后，将会创建并打开“weather”数据库。然后，在数据库界面中右击【表1】选项卡，在弹出的菜单中执行【设计视图】命令，如图18-7所示。图18-7 选择设计视图（7）在弹出的【另存为】对话框中输入数据表的名称（本例为weatherInfo），该数据表用于存储天气预报信息，如图18-8

5、所示。图18-8 命名数据表（8）单击【确定】按钮后即可打开“weatherInfo”数据表，该表中默认存在“ID”字段，如图18-9所示。图18-9 打开数据表（9）将光标放置在“ID”字段名称的下面的单元格中，然后输入新的字段名称“allInfo”，如图18-10所示。图18-10 创建新字段（10）将光标放置在字段名称右侧的单元格中，在弹出的菜单中选择【文本】选项，即设置该字段中存储的数据为文本类型，如图18-11所示。图18-11 选择数据类型（11）右击【weatherInfo】选项卡，在弹出的菜单中执行【数据表视图】命令，即可切换到数据表视图模式中，此时数据库就创建完成了，如图18

6、-12所示。图18-12 数据表视图18.1.2 创建ASP页面ASP是一种服务器端语言，它可以对文件和数据库进行操作。本例将通过ASP页面实现获取网页中提供的天气预报信息、存储天气预报信息到数据库，以及为Flash提供信息源的功能。创建过程：（1）在电脑的【开始】菜单中，执行【所有程序】|【Adobe Dreamweaver CS4】命令，打开Dreamweaver CS4软件，该软件用于制作HTML、ASP、PHP等网页，如图18-13所示。图18-13 打开Dreamweaver CS4（2）单击该界面中【新建】列表的【ASP VBScript】选项，即可新建并打开一个ASP页面，如图1

7、8-14所示。图18-14 新建ASP页面（3）选择文档中的所有代码并将其删除，然后输入以下代码。该段代码通过创建XMLHTTP对象来获取指定网页中的源代码。代码如下所示：新建文本文档，将上面的代码复制到文档中，将其保存为后缀名为“.asp”的文件也可。（4）输入完代码后，按Ctrl+S组合键，在弹出的【另存为】对话框中选择网页要保存的路径和名称（本例将网页保存在“weatherReport”文件夹内并命名为“proxy”），如图18-15所示。图18-15 保存ASP页面对于没有安装Dreamweaver软件的用户来说，可以将代码输入到记事本中，然后再转换为asp格式的网页。（5）使用相同的

8、方法，在“weatherReport”文件夹内新建“process”ASP页面。然后，在代码中通过创建Connection对象连接数据库；创建Recordset对象将获取的信息存储到数据表中。代码如下所示：（6）在“weatherReport”文件夹内新建“getInfo”ASP页面。然后，在代码中通过创建Connection对象连接数据库；创建Recordset对象输出“allInfo”字段中存储的数据。代码如下所示：18.2 服务器端的功能设计和实现服务器端程序用于从获取的网页源代码中提取天气预报信息，并将其显示在可视化的界面中。而为了方便简化操作，本例利用ActionScript语言定时

9、从网页中获取天气预报信息，以快速为用户提供天气预报信息。18.2.1 获取天气预报信息界面为了方便获取天气预报信息，可以让服务器端的Flash每到晚上8:00自动从“中国气象局”网站获取新的数据，并更新到本地服务器中的数据库，从而可以大大减少劳动力。获取天气预报信息的界面如图18-16所示。图18-16 自动获取天气预报信息界面设计过程：（1）在Flash CS4中，执行【文件】【新建】命令，在打开的【新建文档】对话框中选择文档【类型】为“Flash文件（Adobe AIR）”，如图18-17所示。图18-17 新建Flash文件（2）在【文档属性】面板中，设置文档的【尺寸】为600340像素

10、。然后，在舞台中绘制一个绿色的渐变背景，如图18-18所示。图18-18 绘制背景（3）将导入的“阴影”图像拖入到舞台中，并在上面绘制两个不同颜色和大小的矩形，以构成一个带边框的显示区域，然后将其转换为影片剪辑，如图18-19所示。图18-19 绘制显示区域（4）新建图层，在显示区域的顶部输入标题文字，并在【属性】面板中设置其字符【系列】为“迷你简综艺”；【大小】为“37点”，如图18-20所示。图18-20 输入标题文字（5）打开【组件】面板，将“GataGrid”组件拖入到标题文字的下面，并缩放其至适当的尺寸。然后，在【属性】面板中设置其【实例名称】为“myDataGrid”，该组件用来显

11、示天气预报信息，如图18-21所示。图18-21 拖入“DataGrid”组件（6）在显示区域的左下角插入一个动态文本，并调整其大小。然后，在【属性】面板中设置其【实例名称】为“mess”，该动态文本用来显示加载天气预报信息的状态，如图18-22所示。图18-22 插入动态文本（7）在该动态文本的右侧再插入一个动态文本，调整其大小并设置【实例名称】为“mess”；字符【系列】为“迷你简综艺”；【大小】为“20点”，如图18-22所示。图18-23 插入动态文本（8）此时，获取天气预报信息的界面就制作完成了，按Ctrl+Enter组合键可预览效果。18.2.2 获取天气预报信息程序获取天气预报信

12、息程序通过调用ASP页面，可以从指定网页中的获取源代码。然后，利用ActionScript语言将源代码中的天气预报信息分离出来，最后再通过调用ASP页面将天气预报信息存储到数据库中。获取天气预报信息程序如图18-24所法。图18-24 获取天气预报信息制作过程：（1）在“weatherReport”文件夹内新建名称为“countDown”的ActionScript文件。然后，在该文件中创建pack包、“countDown”自定义类和主函数。代码如下所示：package public class countDown /countDown自定义类 public var now_millisecon

13、dsFrom1970:Number; public var now_secondsFrom1970:Number; public var to_millisecondsFrom1970:Number; public var to_secondsFrom1970:Number; public var remainSeconds_Total:Number; public var remainDays:String; public var remainHours:String; public var remainMinutes:String; public var remainSeconds:Str

14、ing; public var outputMess:String; /声明变量 public function countDown(fromYear, fromMonth, fromDay, fromHour, fromMinute, fromSecond, toYear, toMonth, toDay, toHour, toMinute, toSecond) /countDown主函数 （2）在countDown()函数体中，通过创建Date对象初始化起始时间和目标时间，并获取自1970年1月1日午夜（通用时间）以来的毫秒数，然后计算它们之间相距的秒数。代码如下所示：var fromDat

15、e:Date = new Date(fromYear, fromMonth, fromDay, fromHour, fromMinute, fromSecond);/初始化起始时间now_millisecondsFrom1970 = fromDate.getTime();/获取起始时间自1970年1月1日午夜（通用时间）以来的毫秒数now_secondsFrom1970 = int(now_millisecondsFrom1970/1000);/将毫秒数转换为秒数var toDate:Date = new Date(toYear, toMonth, toDay, toHour, toMinut

16、e, toSecond);/初始化目标时间to_millisecondsFrom1970 = toDate.getTime();to_secondsFrom1970 = int(to_millisecondsFrom1970/1000);/获取目标时间自1970年1月1日午夜（通用时间）以来的秒数remainSeconds_Total = to_secondsFrom1970-now_secondsFrom1970;/计算起始时间与目标时间相距的秒数（3）通过If语句判断目标时间是否落后于起始时间。如果是，则自动将起始时间延后到第二天。代码如下所示：if (toHourfromDate.get

17、Hours() /如果目标时间的小时数落后于起始时间的小时数 toDay += 1; /时间延后到第二天if (toHour = fromDate.getHours() & toMinutefromDate.getMinutes() /如果目标时间的分钟数落后于起始时间的分钟数 toDay += 1; /时间延后到第二天if (toHour = fromDate.getHours() & toMinute = fromDate.getMinutes() & toSecondfromDate.getSeconds() /如果目标时间的秒数落后于起始时间的秒数 toDay += 1; /时间延后到

18、第二天（4）计算起始时间和目标时间之间相距的天数、小时数、分钟数和秒数，并将它们存储到outputMess变量中。代码如下所示：var tmpRemainDays:Number;tmpRemainDays= int(int(remainSeconds_Total/3600)/24);/将相距的秒数转换为天数remainDays=String(tmpRemainDays);/将天数转换为字符串值var tmpRemainHours:Number;tmpRemainHours = int(remainSeconds_Total-tmpRemainDays*24*3600)/3600);/计算剩余的

19、小时数if (tmpRemainHours10) /如果小时数小于10 remainHours = 0+tmpRemainHours; /则在小时数前面加上“0”字符串 else remainHours=String(tmpRemainHours); /将小时数转换为转换字符串值var tmpRemainMinutes:Number;tmpRemainMinutes = int(remainSeconds_Total-tmpRemainDays*24*3600-tmpRemainHours*3600)/60);/计算剩余的分钟数if (tmpRemainMinutes10) remainMin

20、utes = 0+tmpRemainMinutes; else remainMinutes =String(tmpRemainMinutes);var tmpRemainSeconds:Number;tmpRemainSeconds = int(remainSeconds_Total%60);/计算剩余的秒数if (tmpRemainSeconds10) remainSeconds = 0+tmpRemainSeconds; else remainSeconds =String(tmpRemainSeconds);outputMess = remainHours+:+remainMinutes

21、+:+remainSeconds;/将剩余的小时数、分钟数和秒数存储到outputMess变量中（5）在“weatherReport”文件夹内新建名称为“weatherInfo”的ActionScript文件。然后，在该文件中创建pack包、“weatherInfo”自定义类和主函数。代码如下所示：package /导入文件运行所需的类 import flash.display.*; import .*; import flash.events.*; import flash.errors.*; import flash.system.*; import flash.text.*; impor

22、t flash.utils.*; import fl.controls.DataGrid; /导入DataGrid组件 import fl.controls.dataGridClasses.DataGridColumn; /导入DataGridColumn类 import fl.managers.StyleManager; import fl.data.DataProvider; /导入DataProvider类 public class weatherInfo extends Sprite private var IP:String; private var iisPath:String;

23、private var proxyPath:String; private var processPath:String; /定义ASP文件路径 private var aspRequest:URLRequest; private var aspLoader:URLLoader; private var tmpString:String; /定义URLRequest和URLLoader对象 private var mainArray:Array; private var tmpArray:Array; private var strToSend:String; private var CITY

24、:String; private var DATE:String; private var WEAT:String; private var TEMP:String; private var WIND:String; private var ULTR:String; private var AIR:String; /定义天气预报参数 private var tmpOutputMess:String; private var tmpArrayForCountDown:Array; private var countDownInterval:uint; private var getInfoInt

25、erval:uint; private var startCountInterval:uint; /定义倒计时 private var tryGetInfoTimes:Number; private var tryWriteInfoTimes:Number; /定义尝试调用次数 public function weatherInfo() init(); /初始化设置 startLoad(); /获取天气预报信息 startInterval(); （6）创建init()函数，该函数用来初始化天气预报程序中的设置，包括编码、服务器IP、程序位置等。代码如下所示：private function init() System.useCodePage=true;/设置编码，使Flash和操作系统使用的语言保持一致IP=127.0.0.1;/定义服务器IPiisPath=http:/