《java时间特效设计课设》由会员分享，可在线阅读，更多相关《java时间特效设计课设（22页珍藏版）》请在金锄头文库上搜索。
1、成成 绩绩 评评 定定 表表学生姓名班级学号专 业电子信息工程课程设计题目基于 JavaScript 的网页时间特效设计（连连看）评语组长签字：成绩日期 2014 年 月 日1课程设计任务书课程设计任务书学 院信息学院专 业电子信息工程学生姓名班级学号课程设计题目基于 JavaScript 的网页时间特效设计（连连看）实践教学要求与任务实践教学要求与任务: :基于 JavaScript 设计网页，网页可以在 IE 中运行（设置成允许脚本访问） 。实现如下时间特效1.万年历有了一个电子万年历，就不用翻看日历了，本例是使用 JavaScript 内置的时间对象，获取相关 的值，通过巧妙的页面设计，
2、显示出了一个万年日历。 2.JavaScript 时钟通过 JavaScript 能够创建出时钟效果。本例主要原理是需要构建时钟的布局，以及根据当前时 间，动态的改变创建时钟的指针位置。这是一个完全用 JavaScript 实现的时钟，结合了数学函数 来实现精确定位，没有使用任何的图片。工作计划与进度安排工作计划与进度安排: :第 19 周：布置课程设计任务，查阅资料，分组设计，程序调试。第 20 周：程序调试，编写课程设计报告，验收，答辩。指导教师：2014 年 月 日专业负责人：2014 年 月 日学院教学副院长：2014 年 月 日2目目 录录 1 1 设计目的设计目的-4-42 2 总
3、体设计总体设计-4-42.12.1 万年历万年历-4-42.22.2 JavaScriptJavaScript 时钟时钟-4-42.32.3 连连看连连看-5-53 3 关键技术关键技术-5-54 4 程序流程程序流程-6-64.14.1 万年历万年历 -7-74.24.2 数字时钟数字时钟-8-84.34.3 连连看连连看-8-85 5 主要源代码主要源代码-9-95.15.1 万年历万年历-9-95.25.2 数字时钟数字时钟-14-146 6 运行结果及结论运行结果及结论-19-196.16.1 万年历万年历-19-196.26.2 数字时钟数字时钟-19-196 63 3 连连看连连看
4、-20-207 7 参考文献参考文献-21-2131 设计目的设计目的网页时间设计是伴随着互联网的产生而形成的新课题，是对网页的构成元素进行艺术规划的创造性思维活动，必然成为设计艺术的重要组成部分，并随着网络技术的发展而发展。表面上看，它不过是关于网页版式编排的技巧与方法，而实际上，它不仅是一种技能，更是艺术与技术的高度统一。设计时间中包含着主观和客观两方面的因素。在确立了网页主题之后，首先要明确和熟悉设计的对象和构成的要素。网页艺术设计涉及的具体内容很多，可以概括为视听元素和版式设计两个方面。视听元素，主要包括：文本、背景、按钮、图标、图像、表格、颜色、导航工具、背景音乐、动态影像等。网页的
5、版式设计在网页的艺术设计中占据着重要的地位。所谓网页的版式设计，是在有限的屏幕空间上将视听多媒体元素进行有机的排列组合，将理性思维个性化的表现出来，是一种具有个人风格和艺术特色的视听传达方式。视觉设计表达的是一定的意图和要求，有明确的主题。那么就要求视觉设计不但要单纯、简练、清晰和精确，而且在强调艺术性的同时，更应该注重通过独特的风格和强烈的视觉冲击力，来鲜明地突出设计主题。网页是传播信息的载体，设计时强调其整体性，可以使浏览者更快捷、更准确、更全面地认识它、掌握它，并给人一种内部有机联系、外部和谐完整的美感。总而言之运用网页时间设计可以方便用户查找时间，了解历史元年，使用户了解的时间更精确，
6、同时也使网页更为美观，视觉效果更强。2 总体设计总体设计2.1 万年历万年历编写函数获取当前时间，通过 IE 浏览器调用函数，通过 setInterval 方法实现函数的调用，通过 div class 来启动主函数2.2 JavaScript 时钟：时钟：today( )通过 date( )对象的 getYear( )、getMonth( )、getDate( )获得系统的年月日。最初使setTod 函数显示当前的系统日期和相应的日历，对于 2000 年以前，年份是用两位数表示的，因此要让其加上 1900。 功能函数中有很多校验函数，用来对日期进行判断。isLeapYear (Year)是用来
7、判年份是否为闰年，来确认月的天数。isFourDigitYear(year)用来保证年份的长度为四位此便需要加入这个函数防止混乱。每个月所包含的天数，是通过getDaysInMonth(month,year)函数来进行相应的存储，特别注意了闰年的 2 月有 29 天。selectDate( )是万年历的基础功能，相对来讲实现起来也较为容易，只需获取用户通过下拉菜单和文本输入的年月并用日历输出函数输出该年该月的日历即可。底下的五个按钮，除4今天是用 setToday( )实现外，其余四个是用 setPreviousYear( )等四个函数实现的，具体的做法就是在之前的年份月份上面加一减一，再通过
8、 displayCalendar(month,year)显示日历，只是对于一月和十二月要特别注意。2.3 连连看连连看前期工作是制定规则和设计算法，这一阶段主要任务是搜集相关资料，然后根据搜集到的资料结合自己所学知识制定系统实现算法；中期工作是算法实现和调试系统，这一阶段主要任务是完成算法的实现，然后进行调试和优化系统；后期工作是对数据结果进行分析，然后完成课程设计报告。本游戏主要细分为以下几大模块： （1）游戏主界面 以 Microsoft Visual Studio 2010 为开发平台设计主界面，主要控件有 1 个主窗体 Form、1 个 groupbox、1 个progressbar、
9、4 个 button、7 个 label。 （2）随机排列小方块 （3）鼠标事件 （4）小方块消除判断 （5）游戏难度设置 本游戏没有用户自定义游戏难度选择，而是使用默认的图案种类数是 20 种，每种图案的重复数是 4 对，所以游戏的灵活性较差。 （6）游戏重列 对本局游戏中剩下的小方块重新排列，计时器不会暂停。此模块的主要作用就是在用户自身不能找到能够消掉的小方块的情况下，通过重列剩下的小方块来产生新的路径，使游戏能够继续玩下去。 （7）暂停/重新开始 点击“暂停”按钮能够使当前正在运行的游戏暂时停止，主要是使让时间停止，不再倒计时；游戏暂停时鼠标不能对游戏操作区域进行操作，此时“暂停”按钮
10、变成“重新开始”按钮，用户只要点击“重新开始”按钮即可继续游戏操作。 （8）游戏胜利（游戏结束，需要重新开始游戏） （9）游戏失败（游戏结束，需要重新开始游戏）5图 2.3 连连看功能模块图3 关键技术关键技术图像模块：图像处理程序运行后，用户直接由年初的时间菜单命令，开始进入时间查找，在此模块中尝试绘制在资源文件中的图片处理，然后装入在节目中的游戏场景是通过DrawMap（）方法。主要是使用 API 函数的 BitBlt，他的主要功能是将一个内存块的数据被转移到另一个内存块，以前的内存块被称为“源” ，一个内存块被称为“目标”的形象后，应用程序开发人员使用 Blit 的功能在一个页面上，内存改造后，一些被转移到另一个页面的位图关键技术就是实现程序必须执行的部分，我觉得实现此程序的关键技术是 HTML 的应用，关键技术原理如下：3.1HTML 概念概念：HTML（Hyper Text Markup Language 超文本标识语言） 是一种用来制作超文本文档的简单标记语言用 HTML 编写的超文本文件称为 H
