基于Web的手机模拟器的实现(含源文件)

编程知识 更新时间:2023-05-01 16:58:57

欢迎添加微信互相交流学习哦!

项目源码:https://gitee/oklongmm/biye


设计说明书 


题    目   基于Web的手机模拟器的实现 
                         


 
摘  要
随着信息技术的迅速发展,Web技术的应用越来越普及。除了常见的教学课件演示、实验动画模拟、过程仿真实现、可视化仿真及测试系统等方面的应用外,Web也因其浏览方便、实现技术相对简单、使用方式灵活等特点,开始涉及生活中的方方面面,为人们的生活带来越来越多的便利。
本文介绍的手机模拟器的设计,是以某企业某型号手机为研究对象,为了让更多的民众能够更方便的了解企业推出的各款手机的新增服务功能的使用方法而提出的需求。所开发的模拟器展示可移植在Web网站以及触摸屏上,方便用户能够随时随地的了解手机新功能的使用方法。所有的用户只要通过终端机进行手动操作,完全模拟真实的手机功能而设置,具有人性化、简单化、可视化等优势。从而增加了更多的受众面,达到很好的产品推广的作用。
Web手机模拟器的设计所涉及的技术层面主要包括:图形界面设计,主要是利用Photoshop创造出逼真的手机外观及操作界面;Flash基本工具,利用动作与形状渐变,各帧动画的设计,准确的把握手机的功能演示流程,制作影片剪辑;Javascript和ActionScript动作脚本,后台对手机各功能按钮以及一些关键帧上创建脚本语言。正确的完成从“功能菜单”转向个子功能菜单的跳转。系统开发的工具主要是采用Adobe公司推出的Flash CS和Dreamweaver系列产品,配合Javascript和Actionscript动作脚本语言作为支撑。

关键词:动画,动作脚本语言,手机模拟器

Abstract
With the rapid development of information technology, Flash technology is becoming increasingly popular. In addition to the common courseware presentation, experimental animation, process simulation to achieve, visual simulation and test systems outside the application, Flash is also because of its small size, to achieve technology is relatively simple, flexible features, has been involved in life all aspects of people's lives as more and more convenient.
This article describes the design of mobile phone simulator is a company with an opportunity to launch new phones in order to allow more people to more easily understand the business sections of the new phone to use new services demand made . Flash animation showing the development of portable touch screen on the website and to facilitate understanding of mobile phone users anytime, anywhere to use the new features. All users as long as the manual operation by the terminal, completely simulate the real function of the phone is set up, with a user-friendly, simple, visual and other advantages. Thus increasing the audience and more, to promote the role of a good product.
Flash phone simulator technical aspects involved in the design include: graphical interface design, mainly using Photoshop to create a realistic look and user interface phone; Flash basic tools, the use of movement and shape of the gradient, each frame of animation design, accurate grasp the function of the phone shows the process, make a video clip; ActionScript dynamic script, the background of the function buttons on the phone and some scripting language to create keyframes. Done correctly from the function menu to a sub-function menu the jump. System development tool is mainly used Adobe's Flash CS introduced products, with Actionscript dynamic scripting language as support.

Key words: Flash, ActionScript Dynamic Scripting Languages, Mobile Simulator 

目  录
摘  要    I
Abstract    II
1  绪论
1.1 课题研究背景    (1) 
1.2 课题的现实意义    (1) 
1.3 论文结构    (2) 
2  系统分析
2.1可行性研究    (4) 
2.2 需求分析    (5) 
2.3 系统开发工具及运行环境    (5) 
2.4 系统流程和数据流图    (7) 
2.5 本章小结    (9) 
3  系统的设计
3.1 系统体系结构设计    (10) 
3.2 系统层级功能设计    (11) 
3.3 本章小结    (12) 
4  系统的实现
4.1功能框架的整理    (13) 
4.2前期准备    (13) 
4.3 外围功能模块的实现    (14) 
4.4 内部功能模块的实现    (20) 
4.5 本章小结    (31) 
5  系统功能测试
5.1 功能测试    (32) 
5.2 本章小结    (34) 
6  总结
致  谢    (36) 
参考文献    (37) 
 
1  绪论
1.1课题研究背景
如今,手机几乎已经成为当今社会人手必备的一件用品。手机用户已经横跨了小、青、中、老年龄段的各式人群当中。基于如此大的需求,自然市场上对于手机的广告宣传战也从来没有终止过。现今的各种手机广告不乏一些很具有创意的思想,但是有很多还紧紧停留在以明星代言的书面、口头宣传上。而且,随着手机品牌的不断推出、手机内在功能不断的增加、手机操作界面上的复杂多变……都在无形中增加了手机的宣传难度。因此,若是能够让顾客通过手机广告,直截明了的了解手机的一些操作和所具有的功能,这将明显的会在同类竞争中增加筹码。
网络化时代的快速来临,无疑给现在的手机广告带来一个新的出路。基于Web的手机模拟器的设计,将很好的体现这一点。Web模拟器通过动画交互,模拟演示,对于手机的功能界面、操作流程都可以很好的表现出来。其中不但可以让顾客在欣赏有趣动画的同时达到广告宣传的目的,而且顾客还可以通过其中的一些人机交互按钮达到互动的效果。真实的模拟手机功能,让顾客在没有接触到手机之前就清楚的了解到未来上市手机的大概情况。
1.2课题的现实意义
由于Web技术在近些年,已经发展的相当成熟。利用Web技术制作的产品也已经在各个方面得到了很好的利用。有专门应用Web技术设计的游戏网站,也有从事Web技术开发的外包公司,或者在一些广告策划公司,也可以见到Flash活跃的身影。互联网的普及,带给Web技术的改革和益处是空前的。当我们看到各种各样的网站上那些生动有趣的界面,以及在这种效果下给我们带来的震撼时,我们不再怀疑Web技术的市场运营前景。
加之近几年来电子商务技术的快速发展,对于传统的买卖交易模式来说,无疑是一个更为方便快捷的模式。当我们能够足不出户的就可以了解到最新产品的功能时,我们何必还要亲自到商场四处寻找呢?基于Web技术的仿真模拟技术,在产品展示、宣传策划、网站游戏……当中,担任着重要的角色。
例如,用Web感受新手机,利用Web可以很方便地体验新产品,比如用Web可以体验你想要购买的手机。在这个Web里,你可以随意地为你的手机翻看菜单,听各种铃音,并熟悉各种操作。这样可以省去你在商店里试用的麻烦,也为网上购物提供了很多方便。
坐在家里看新居,看房子。逛房展是最累人的了,但是凭借Web技术,可以很方便地观察房屋的情况。比如,当你选定小区后,点击你喜欢的那座楼,Web网站会提示你选择户型,在Flash里房屋的尺寸、布局等等可以看得一清二楚。当你的鼠标落在一间屋子上时,就会相应地向你显示这间屋子布置好以后的效果,感觉非常真实。如果你想进房间看看,也可以,在Web网站的右边有两个按钮,分别是拉近和远离,当鼠标左移时,你的视野也会随之移动,这样你就可以很轻松地看遍房间里的每个角落。
综上所述,Web技术必将还在市场经济当中发挥着不可小觑的作用。
1.3论文结构
本文主要由绪论、系统分析、系统的设计、系统的实现、系统功能测试等五大部分组成,详细框架详见图1-1所示。
第一章是绪论部分,主要介绍了课题研究的背景、现实意义。
第二章是系统的分析部分,主要包括从技术可行性、经济可行性、操作可行性以及需求分析等方面全面的对系统进行分析,通过对系统的分析理出系统的架构图。
第三章首先是功能设计部分,主要包括分析系统的主要功能,分清主次,强调主要方面。此外对子功能也做详细的分析,以期完成各层之间的正确跳转。
第四章是系统实现部分,主要对系统的各个功能模块进行详细的分析,其中包括功能的拆分、素材的整理、代码的编写、元件的制作、界面的设计等各项工作。
第五章是系统测试及维护部分,主要介绍了系统测试的方法和步骤,系统维护应该遵守的原则。
 
图1-1  系统框架图

2  系统分析
2.1可行性研究
2.1.1经济可行性分析
Web技术已然相当成熟,而且如今已经有许多专业从事该领域的企业或个人。针对各类大中小型的企业来说,都不是一项大的经济开支。加之现在Web网站的兼容性良好,能够在各种配置环境中运行,所以不需要专门的设备,只要能够上网的地方,均可以得到展示,因此节约了固定成本的投入。对于销售终端产品时,因Web相对较小且易操作,故而只需配置一台简单的演示机器,便可实现面向用户的功能。
2.1.2技术可行性分析
根据该系统制定的目标来衡量所需的技术是否具备,一般可从硬软件的性能要求、环境条件、操作人员水平和数量等方面去考虑和分析。
软件方面选用Adobe公司推出的Flash CS系列产品,结合该公司出品的PhotoShop、Firework等图形处理软件的协助,加之Flash中内置的ActionScript动作脚本语言,从而在前台以及后台的设计方面都能够得到很好的效果。因此软件方面是可行的。
在硬件方面,则选择空间较大,市场上一般的PC终端机都可以得到运行。所以硬件方面是可行的。
2.1.3操作可行性分析 
本系统采用用户浏览器模式,系统提供友好的操作界面,通过点击手机模拟器上面的菜单键,选择各项子功能,进入功能演示界面。因此系统在操作上是可行的。
2.2需求分析
2.2.1系统功能需求分析
Web手机模拟器总的功能是采用Flash动画技术,实现对手机功能的模拟仿真,形象逼真的演示手机各项功能的操作步骤及流程。
2.2.2系统性能需求分析
作为一个演示系统,它不需要存储信息,只需要在演示机器上安装支持Flash的播放软件(如Flash Player),而对于网络用户,也必须安装Active控件,获得相应的服务。
2.3系统开发工具及运行环境
2.3.1Flash技术介绍
Flash 是一种创作工具,设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常,使用 Flash 创作的各个内容单元称为应用程序,即使它们可能只是很简单的动画。您也可以通过添加图片、声音、视频和特殊效果,构建包含丰富媒体的 Flash 应用程序。
Flash 特别适用于创建通过 Internet 提供的内容,因为它的文件非常小。Flash 是通过广泛使用矢量图形做到这一点的。与位图图形相比,矢量图形需要的内存和存储空间小很多,因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大,是因为图像中的每个像素都需要一组单独的数据来表示。 
要在 Flash 中构建应用程序,可以使用 Flash 绘图工具创建图形,并将其它媒体元素导入 Flash 文档。接下来,定义如何以及何时使用各个元素来创建设想中的应用程序。 
在 Flash 中创作内容时,需要在 Flash 文档文件中工作。Flash 文档的文件扩展名为 .fla (FLA)。Flash 文档有四个主要部分: 
(1)舞台是在回放过程中显示图形、视频、按钮等内容的位置。在Flash 基础中将对舞台做详细介绍。 
(2)时间轴用来通知 Flash 显示图形和其它项目元素的时间,也可以使用时间轴指定舞台上各图形的分层顺序。位于较高图层中的图形显示在较低图层中的图形的上方。 
(3)库面板是 Flash 显示 Flash 文档中的媒体元素列表的位置。 
(4)ActionScript 代码可用来向文档中的媒体元素添加交互式内容。例如,可以添加代码以便用户在单击某按钮时显示一幅新图像,还可以使用 ActionScript 向应用程序添加逻辑。逻辑使应用程序能够根据用户的操作和其它情况采取不同的工作方式。Flash 包括两个版本的ActionScript,可满足创作者的不同具体需要。Flash 包含了许多种功能,如预置的拖放用户界面组件,可以轻松地将 ActionScript 添加到文档的内置行为,以及可以添加到媒体对象的特殊效果。这些功能使 Flash 不仅功能强大,而且易于使用。 
完成 Flash 文档的创作后,可以使用"文件"—"发布"命令发布它。这会创建文件的一个压缩版本,其扩展名为 .swf (SWF)。然后,就可以使用 Flash Player 在 Web 浏览器中播放 SWF 文件,或者将其作为独立的应用程序进行播放。
2.3.2系统运行环境
硬件平台:
CPU:P41.8GHz
内存:256MB以上
软件平台:
操作系统:Windows XP/ Linux
浏览器:IE6.0,firefox
分辨率:最佳效果1024×768像素
播放器:Flash Player 8.0及以上
2.4系统流程和数据流图
2.4.1系统流程图
根据系统的实际操作和控制情况,本系统运行可以分为两类:第一类场景展示与切换、手机外观显示、按钮事件。第二类手机菜单展示、功能界面切换。
 
图2-1  系统流程图

2.4.2数据流图
用户通过鼠标点击各功能按键,跳转到主菜单界面。再通过上下左右方向键选择各个子菜单,按确定键进入相应界面。按照一级、二级、三级……菜单的排列,选择进入或者退出。
数据流图如下所示。
(1)最顶端的流程图是两个场景的相互切换,通过一个按钮,写上相应的脚本语言,以实现此项功能。如图2-2所示。
 
图2-2  顶层切换图
(2)第一层功能起着一个功能导航作用,利用各个元件进行排版布局。此层主要是展示一个手机的大概功能给用户,方便用户能够直接了解手机的各项功能菜单。此层主要是链接到各个子功能列表的通道。如图2-3所示。
 

图2-3 第一层功能列表

(3)第二层功能是在第一层的功能基础上建立而来。按照父子结点的关系以树状结构展现。此层可以说更加清晰的将整个手机具体拥有的哪项功能一一列出。由于我主要完成了手机的部分功能,因此并没有完全按照真实手机的所有功能来做。但其余功能步骤都可以举一反三的应用制作,此不作赘述。如图2-4所示。
 
图2-4 第二层功能列表
2.5本章小结
本章针对系统的开发,从系统的经济可行性、技术可行性、操作可行性三个方面对系统进行分析,得出该系统具有很高的开发可行性。而且还对系统进行了需求分析,通过系统的功能需求和性能需求的需求分析,从而进一步设计出了数据流图,同时得出了系统运行所需的硬件和软件环境。
 
3  系统的设计
经过前面的分析,我们已经初步确定了系统的功能需求,分析了操作的流程,现在我们需要对系统的各个功能进行分析,得出他们的相关联系。另外,要按照正常的操作步骤,以大众的习惯设计各个功能的正确链接跳转。
3.1系统体系结构设计
Web手机模拟器得设计是一个典型的树状模型,每一层级菜单里又包含各个子功能菜单。其主要分为外围功能模块和内部功能模块,具体如下:
(1)外围功能模块
外围功能模块的的作用主要起一个展示可控制开关的作用,在用户没有接触到手机的内部功能时,先对其外表、性能、主要功能等有一个大致的了解。如图3-1。
 
图3-1  系统外围功能结构图
(2)内部功能模块
内部功能模块的主要功能是通过按键,真实的模拟手机内部菜单的各项功能,其中主要包括:拨号、短信、多媒体、照相机、附加功能、电话簿等。如图3-2所示。
 
图3-2  系统内部功能结构图
3.2系统层级功能设计
现在按照一层一层的设计思路,为系统定出基本的功能层级框架。从最顶层开始,逐层跳转,以形成真实的功能演示模型。如表3-1所示。

表3-1  系统层级功能表
层级    判定    功能项
顶层    跳转按钮    完成场景一和场景二之间的跳转
一层    开盖控制按钮、功能列表按钮、菜单键、数字按钮……    手机功能展示、控制手机的开与关、
拨号功能、主菜单显示
二层    菜单键、方向按钮、返回按钮    进入下一层菜单、菜单的选择、
进入功能演示、返回上一级菜单
n层    确定按钮、返回按钮、方向按钮    继续进入n级菜单、返回n-1级菜单

3.3本章小结
本章首先分析了系统的各平行界面的相应功能,然后对每个平行界面进行树状分析,得出外部功能模块和内部功能模块的结构图。最后,从结构图中,得出了系统的每个层级之间的联系。这其中,按钮键起到了重要的作用。通过这些按钮,连通上下层级,以达到功能的完美跳转,实现动态模拟的效果。

4  系统的实现
通过对需求分析和对系统的各个功能模块的设计,在第四章主要是实现系统的各个功能模块。首先是框架的搭建,通过对手机内置功能的详细调研,理出各个功能之间是如何跳转的,得到一个大概的功能列表;其次根据第三章系统结构图,对系统(外围和内部)的各个功能模块的实现进行描述,并用图片和部分代码加以介绍。
4.1功能框架的整理
根据此次设计的目的,要设计出一个用Web制作手机功能模拟器,首先必须选定一个品牌的手机进行实物对照。在此,我选定了三星公司出品的一款翻盖手机作为模型。此手机内置功能较为完善,与市场上的大部分手机大同小异,因此在以后的技术应用当中,可以不必要花费太多的时间去修改。
待选定了一个实物模型之后,便开始详细的了解手机的各项性能如分辨率、像素、内存卡大小等信息。之后,就要进入手机的内部,通过自己的详细操作,知道这款手机所有的功能以及操作步骤。并做好记录。
当所有的这些完成后,简单的描绘出未来的设计框架。这主要是给自己在未来的设计过程当中起到一个提纲挈领的作用。让自己的脑海中清晰的明白自己将如何向公众展示这款手机。如通过怎样的操作、色彩如何搭配、如何布局等[1]。
4.2前期准备
4.2.1素材准备
要完成一个完完全全的设计,素材是必不可少的。素材的来源主要分为两种:一种是网上下载,这主要是各个功能图标,手机品牌标志,背景图片等;另外一种是自己制作,主要是指元件(影片剪辑、按钮、图形)[2]。
4.2.2技术工具准备
制作本设计需要的工具主要是Adobe公司出品的Flash CS系列,配合使用的图形制作工具有PhotoShop及Fireworks。对于版本的要求,可随意选择,Flash版本我选用的是Flash 8和Flash CS3,因为这两个版本的差别不大,主要是名称的问题。
4.3外围功能模块的实现
外围功能模块的实现主要包括场景切换、手机外观展示、场景设计、功能列表、控制按钮等几个方面。具体实现如下。
4.3.1场景切换的实现
场景的切换主要实现手机性能区与仿真体验区的切换。两个相对应的场景名称分别是:shouye、fangzhen。场景shouye主要是列出手机的各项性能数据,并置一个跳转按钮,转到场景fangzhen中去。添加按钮代码如下:
on (release) {
    gotoAndStop("fangzhen", 1);//跳转到fangzhen场景的第一帧
}
在主时间轴上的第一帧写入“stop();”防止不经过按钮的控制,而直接跳转到下一个场景中去[3]。
4.3.2手机外观展示的实现
手机外观展示主要是手机待机时的显示。整个手机是一个影片剪辑,并在属性中的实例名称中命名为phone,以在后面的步骤当中对其实施作用。
手机整体是通过图形制作软件制作的一个元件,通过各个元件的组合,形成一个手机的外体模型。手机待机时,可以显示时间、日期、星期。这实现的步骤是通过动态文本框time、time1、time2显示,而在时间轴上的当前帧写入以下代码:
function timelist() {
    nowdate = new Date();
    year = nowdate.getFullYear();
    //获取当前的年份
    month = nowdate.getMonth()+1;
    //获取当前的月份,因为数组从0开始用0-11表示1-12月,所以要加1
    date = nowdate.getDate();
    //获取当前日期
    day = nowdate.getDay();
    //获取当年的星期
    hour = nowdate.getHours();
    minute = nowdate.getMinutes();
    if (month<10) {
        month = "0"+month;
    }
    if (date<10) {
        date = "0"+date;
    }
    if (hour<10) {
        hour = "0"+hour;
    }
    if (minute<10) {
        minute = "0"+minute;
    }
    if (day == 1) {
        time2.text = "一";
    }else if(day==2){
        time2.text = "二";
    }else if(day==3){
        time2.text = "三";
    }else if(day==4){
        time2.text = "四";
    }else if(day==5){
        time2.text = "五";
    }else if(day==6){
        time2.text = "六";
    }else if(day==0){
        time2.text = "日";
    }
    time.text = hour+":"+minute;
    time1.text = month+"/"+date;
}
timelist();
setInterval(timelist, 1000);
实现效果如图4-1所示[4]。
 
图4-1  整体效果图

4.3.3场景设计的实现
场景设计的实现主要是背景图片的导入,布局摆放,以及遮罩的应用。在此介绍遮罩的实现。遮罩层主要是用于当界面最大化时,不至于将一些超过界面的地方显示出来,影响整体的美观。
新建一层,命名为“遮罩层”,用矩形框画出一个内部无填充的矩形,大小与界面一致。再运用“窗口—变形”至400%,复制并应用。同时选中大小两个矩形框,打散之后填充一个颜色即可[5]。
4.3.4功能列表实现
功能列表主要运用了按钮控制影片剪辑技术以及空白按钮的制作。主要实现的功能是当鼠标滑动到功能列表按钮上时,显示主要功能菜单,当再一次单击此按钮时,整个下拉菜单消失。而且在每个功能菜单之上添加空白按钮,为以后的直接跳转做好准备。按钮代码如下:
on (rollOver) {
     menu.gotoAndStop(2);
}
on (release) {
    menu.gotoAndStop(1);
}
效果显示如图4-2所示[6]。
             
图4-2  功能列表效果图
4.3.5控制按钮的实现
此功能主要分为开盖键和闭盖键以及手机性能区按键。通过在按钮上写入代码,控制影片剪辑phone的播放。代码为:
on (release) {
    phone.gotoAndPlay(2);//第一帧为停止帧,整个影片动作从第二帧开始
}
 
图4-3  开盖效果图
4.4内部功能模块的实现
内部功能主要是通过手机按键的操作,进入到各个功能菜单界面,并能够演示相应的功能。而且还得通过返回键至上一菜单。总之要近乎真实的演示出整个手机的功能。
4.4.1拨号功能的实现
当通过开盖按钮打开手机之后,首先可以见到的是整个手机的操作界面。这分为:屏幕区和按键区。我们要能够通过按键区里的数字按键拨打号码,并能够显示在主屏幕上,在点击绿色拨号键后,能够模拟拨号的动作。且在每个按钮上加入声音[6]。
如数字按键“1”的代码如下:
on (release) {
    gotoAndStop(200);
    this.shuru.text = this.shuru.text+"1";
}
shuru为号码显示的动态文本,拨号键的代码为:
on (release) {
    dail.gotoAndPlay(2);
}
dail是模拟拨打电话的一个影片剪辑。拨号效果如图4-2所示。
4.4.2主菜单功能的实现
主菜单的显示主要是利用影片剪辑,分别将各个功能的图标依次排列好,由于初始选中的是“短信”功能,需要在选中某个菜单项时能够清楚的看到选中的标志。
在此设置一个闪动光标,光标是一个由明到暗的动画渐变。如图4-4所示[7]。

 
 
图4-4  演示效果图
4.4.3方向键功能的实现
方向键的功能主要是通过点击按钮,实现选择不同菜单项的功能。在此需要注意的是,方向键不同方向有不同的实现方式。上下键可以上下的移动光标,当此时的光标位于最顶端时,按下向上键转到最底端;左右键则是以“Z”字型的的移动方式。当处以第一个时按下向左按键,则移动至最后一个[8]。
on (release) {
    gotoAndPlay(_currentframe-3);//当前帧减3
}
on (release) {
    gotoAndPlay(_currentframe+3);//当前帧加3
}
on (release) {
    prevFrame();
}
on (release) {
    nextFrame();
}
注意:在前后六帧都要写入跳转代码,只有这样,才能实现临界端点的正确移动。
4.4.4功能列表链接的实现
现在可以在之前功能列表添加的空白按钮上写入代码了,每一个主要功能都对应了一个功能菜单。用一个鼠标点击事件,链接到对应的菜单上去。如图4-5所示。
 
图4-5  功能列表链接效果图
4.4.5短信功能的实现
短信功能主要分为写短信和收件箱两个主要功能,在写短信功能中,通过确定按钮,能够模拟一个发送的过程。在收件箱功能中,当打开一个短信后,能够进行短信回复。回复功能与写短信功能相同。在此需要注意的是如何从写短信和收件箱二者选定的问题。设计效果如图4-6所示[9]。这需要在确定按钮上添加如下代码:
on (release) {
    if (duanxin._currentframe == 1) {
        nextFrame();
    } else if (duanxin._currentframe == 2) {
        gotoAndStop(99);
    }
}
 
 
图4-6  写短信/收件箱效果图
4.4.6电话簿功能的实现
电话簿功能主要做了两个功能:快速查找、查找联系人。快速查找是利用向下按键在所有的号码中逐一显示。这里应用了文字遮罩和动画补间。当显示完当前页面时,可以滚动到下一行。[14]如图4-7所示。
查找联系人则可以实现通过键盘输入一个姓名,跳转到相应的号码上去。帧上添加的代码如下:
for (asc=65; asc<91; asc++) {
    obj = eval(chr(asc));
    if (Key.isDown(asc)) {
        input_string = chr(asc);
    }
}
obj = eval(chr(asc));

  
图4-7  电话簿效果图

 
图4-8  电话簿效果图
4.4.7多媒体功能的实现
多媒体的功能主要是相册功能和音乐播放器功能。相册功能相对简单,只需要在每一个关键帧上加入图片,通过方向键控制即可[10]。
on (release) {
    xc.nextFrame();
}
音乐播放器因为其中需要插入音乐文件,但要是直接插入的话,文件将会变得很大,这个时候就得从外部导入进来了。这里需要注意的是,所有的音乐文件都要和系统的源文件在同一个根目录中[11]。
mySound=new Sound();//建立一个新的声音对象mySound;
mySound.loadSound("1.mp3",true);
另外还需要设置一个全局变量_global.i,以控制确定按钮,正确的播放歌曲。每首歌对应的值不同,通过以下代码,完成播放的动作[13]。
on (release) {
    if (xuanxiang._currentframe == 3) {
        xuanxiang.gotoAndPlay(7);
    } else if (xuanxiang._currentframe == 4) {
        xuanxiang.gotoAndPlay(7);
    } else if (xuanxiang._currentframe == 1) {
        if (_global.i == 0) {
            gotoAndStop(93);
        } else if (_global.i == 1) {
            gotoAndStop(94);
        } else if (_global.i == 2) {
            gotoAndStop(95);
        } else if (_global.i == 3) {
            gotoAndStop(96);
        } else if (_global.i == 4) {
            gotoAndStop(97);
        } else if (_global.i == 5) {
            gotoAndStop(98);
        }
    }
}
4.4.8 附加功能的实现
附加功能主要由计算器和日历两个功能模块组成。计算器的实现,再一次需要数字按键与动态文本的结合。如在数字“1”按钮上添加代码:
on (release) {
    PressNum("1");
}
方向键模拟加减乘除功能。此代码如下:
on (release) {
    PressOper("÷");
}
确定键模拟“=”,得出计算结果。[15]在帧上添加如下代码:
stop();
memory = 0;
display = "0";
function PressNum(num) {
    if (clear) {
        clear = false;
        dot = false;
        display = "0";
    }
    if (display == "0" and num != ".") {
        display = num;
    } else {
        display = display+num;
    }
}
function PressOper(oper) {
    if (operator == "+") {
        display = Number(opernum)+Number(display);
    }
    if (operator == "-") {
        display = opernum-display;
    }
    if (operator == "×") {
        display = opernum*display;
    }
    if (operator == "÷") {
        display = opernum/display;
    }
    clear = true;
    dot = false;
    operator = oper;
    opernum = display;
    if (oper != "=") {
        display = oper;
    }
}
计算器效果显示如图4-9所示[16]。
日历功能利用Flash当中内置的组件:DateChooser/TextArea做出一个rili.swf文件,再通过“loadMovie("rili.swf", "loadmc");”导入到影片剪辑当中。通过以下代码约束大小。
其中在制作日历时,应该注意这是一个数据捆绑式的日历,因此要想在DateChooser中选中的日期在TextArea中显示出来,就必须要对其进行绑定。待绑定了之后,继续对其架构,以按照中国地区的显示习惯显示。显示效果如图4-10所示。
setProperty(_root.load, _xscale,100); 
setProperty(_root.load, _yscale,100);
 
图4-9  计算器功能效果图
 
图4-10  日历功能效果图
4.4.9照相机与设置功能的实现
照相机功能只是利用一个按钮,控制一个元件,由清晰—模糊—清晰的动画渐变。手机设置做的功能是手机铃声设置。当点击铃声设置时,转到多媒体当中的界面,选择铃声设置。在此需要注意的地方是当从多媒体进入到选项界面时,按“返回键”返回到的是歌曲列表,而从设置界面进入铃声设置,按“返回键”返回到的是设置面板。
这里又要用到一个全局变量_global.j,当进入到播放器初始化界面的时候,设置_global.j=1;而当_global.j=0;则转向铃声设置界面。实现代码如下:
on (release) {
    if (_global.j == 0) {
        gotoAndStop(105);
    } else if (_global.j == 1) {
        gotoAndStop(91);
    }
}
4.5本章小结
本章主要对系统各模块的实现功能进行了介绍,介绍了外围功能模块部分、内部功能模块部分的功能实现所包括的页面设计和代码实现。

5  系统功能测试
系统测试是为了发现错误而执行程序的过程,成功的测试是发现了至今尚未发现的错误的测试。它的目的在于通过与系统的需求定义作比较,发现软件与系统的定义不符合或与之矛盾的地方。
5.1功能测试 
通过实际的操作,对系统的各项功能按键进行测试。
建议使用的硬件环境:
(1)处理器:Inter Pentium 4或更高;
(2)内存:256M以上;
(3)硬盘空间:20GB以上;
(4)显卡:SVGA显示适配器。
建议使用的软件环境:
(1)操作系统:Windows XP;
(2)播放器:Flash Player 8及以上版本。
下面是功能测试:
(1)场景切换功能部分,可以通过仿真体验区按钮链接到场景二中。
(2)按键功能部分,以用户的身份进行操作。点击开盖闭盖按钮,能够打开手机和关闭手机。打开手机之后,能够通过数字按键进行号码的写入以及拨号的功能。通过菜单键能够转到主菜单界面。当鼠标滑过功能列表时,会出现下拉列表,再次点击后,下拉列表消失。手机背面可显示日期时间。
(3)方向键功能部分,按上下左右四个方向键时,能够选中相应的菜单或列表。
(4)播放器功能部分,选择歌曲,点击播放时,能够听到歌曲的声音。
(5)附加功能部分,计算器计算时,结果正确;且日历能够显示。
(6)设置功能部分,能够实现铃声的设置并且能够正确返回到对应界面。
(7)返回键部分,能够在点击返回键之后,正确显示之前选中的父菜单。例如当从相册演示界面点击返回键时,光标选中的是“相册”栏。测试效果如图5-1所示。
 
图5-1  返回效果图一
当从音乐播放列表返回时,显示的是“音乐播放器”栏。测试效果如图5-2所示。
 
图5-2  返回效果图二

5.2本章小结
本章主要从系统的各个层面进行测试。首先检测运行环境,检查系统所处的硬件环境和软件环境是否都可以满足系统运行的条件。同时可以观察到画面显示的清晰程度以及运行的流畅程度如何。
接着又对系统的各个主要功能及关键按钮功能进行了测试,其中不乏出现一些细节问题。通过整个功能的测试,完整的演示了一遍手机的各项功能,检测各个功能的现实性以及各个界面链接的合理性及正确与否。
通过以上测试,系统基本上完成了预定的目标,可以说很好的向用户展示了一款手机的主要功能以及操作手机的基本流程。


6  总结
基于Web的手机模拟器的设计,成功的实现了手机的主要功能。包括短信、电话簿、相册、音乐播放器、计算器、日历、照相机、铃声设置等。此设计的主要特点是操作简单,运行方便,价格便宜。面向各个用户均可适用。并且提供了方便的操作界面,只需要轻轻一点,即可完成某个功能的演示。具有形象、生动、逼真的效果。此系统可以应用在商品的展示、广告宣传、多媒体教学等多个领域。Web技术及配套软件的强大功能将为我们提供巨大的便利与经济效应。
整个系统从一开始的进入到最后的结束,都在一个统一色调的界面当中操作。各个功能衔接得当,布局合理,主次分明。重点演示了多媒体、短信、附加功能几个模块。对于其余模块,有繁有简,基本将一个手机的功能演示出来。并且步骤清晰,转换合理,初步完成了设计的目标。
通过此次系统的设计,发现对于Flash技术以及现在不断发展的Actionscript动作脚本语言的理解和应用,都还有许多有待加强的地方。对于许多细节设计没有准确的把握,对一些脚本语言的理解还不是很深入。另外此系统本身也不可避免的存在着许多不足。如界面较小,美观度不足,真实性不强,另外有些功能的实现效果也不尽如人意。
所有的这些都表明自己在Flash这个领域了解的太浅,自己虽然比较喜爱Web技术,可仍将在以后的日子里继续坚持不懈的钻研下去。


致  谢
在毕业设计及论文完成的过程当中,我得到许多来自各方面的帮助。尤其感谢我的指导老师。整个过程,得亏了他的悉心指导以及提出了许多宝贵的意见。这在后来的系统设计过程当中起到了重要的作用。老师对待学生亲切热情,工作态度令人敬仰。在论文的撰稿过程当中,经过了他的多次审阅,并且耐心的指出论文当中存在的不足。没有老师的帮助,我想我不能很好的完成毕业设计的任务。
另外,我还要感谢在这几年来对我有所教导的老师,他们孜孜不倦的教诲不但让我学到了很多知识,而且让我掌握了学习的方法,更教会了我做人处事的道理,在此表示感谢。同时,在系统的设计过程中同学也给了我不少帮助,这里一并表示感谢。


参考文献
[1]  卓越科技.Flash 8动画制作—入门、进阶与提高.电子工业出版社,2006.11~13
[2]  吴俊等编著.Flash MX 2004—ActionScript精彩实例.清华大学出版社,2004.63~65 
[3]  薛欣编著.Flash Professional 8动画设计标准教程.中国电力出版社,2006.34~36
[4]  孙颖著.Flash ActionScript 3殿堂之路.电子工业出版社,2007.12~14
[5]  张志会.基于Web的车站作业可视化仿真[J].铁路信息化,2009(10):21~22
[6]  张东林,付洪波.Flash动画技术在电子地图中的实际应用[J].测绘与空间地理信息,2007(5):56~58
[7]  刘明伟,任永攀,黄兴等编著.Flash与后台.清华大学出版社,2007.33~38
[8]  王瑾. 基于Web的智能题库测试系统的设计与实现[J].苏州职业技术学院学报,2009(6):19~20
[9]  王瑾.基于Web技术的手机功能交互式仿真实现.常州信息职业技术学院学报,2010,9(2):1~2
[10] 郑屺,秦少刚,张俊生等编著. Flash 8中文版标准实例教程.机械出版社,2006.4~6
[11] 赵英杰.风云—Flash ActionScript 高级编程艺术[M].电子工业出版社,2006.45~48
[12] 倪洋.Flash Mx网上交互动画及游戏课件制作[M].人民邮电出版社,2004.109~111
[13] 苏俊.用多媒体学Flash[M].清华大学出版社,2005.17~19
[14] 王哲.Flash导演创意大本营[M].电子工业出版社,2006.45~48
[15] 细子. Flash 8 全实例学习手册[M].中国青年电子出版社,2005.78~82
[16] 陈冬.Flash Actionscript2.0互动编程从基础到应用.电子工业出版社,2007. 23~25
 

更多推荐

基于Web的手机模拟器的实现(含源文件)

本文发布于:2023-04-23 17:29:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/892584542e7812a9ef9a75c6909b520e.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:源文件   模拟器   手机   Web

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!

  • 99083文章数
  • 25812阅读数
  • 0评论数