基于Flash技术的动态博客设计——日历与动态日志设计---毕业论文

本 科 毕 业 论 文 基于Flash技术的动态博客设计 日历与动态日志设计 The Design of Dynamic Blog Base on Flash TechnologyThe Design of Calendar and Dynamic Log姓 名： 学 号：学院：软件学院系：软件工程专 业：软件工程年 级：指导教师： 年 月摘要博客以其丰富多彩的个性化展示而被广泛应用，但是简单的静态式页面无法满足发布者与欣赏者的要求。将博客以Flash的形式展示将带来一种强有力的视觉冲击,就是本小组在此次毕业研究设计中要追寻的最终目标。日历几乎会在所有的博客中出现，但它在博客中总是游离于主体之外。与此同时，具有严谨时间轴设置的日志部分也是单独存在于博客当中，这样明显浪费了日历本身所能表现出的时间特性。此次毕业设计中，本人的目标就是将两者有效的结合起来，达到动态展示的效果。本次毕业设计论文包含5部分：n 引言：引言包含了本次毕业设计的研究背景，运行环境设置以及对所要完成的日历模块进行介绍。这部分告知读者为什么选取这个研究方向，为什么选取Flash为实现工具以及此模块包含什么功能。n 日历模块实现：说明完成日历部分可以使用的方案以及完成效果对比，进而选取最适合的方案。详细阐述日历主体的制作以及事件提醒动态文本的实现，最后对完成部分进行不同的视觉效果展示。n 动态日志实现：此部分告知读者视频剪辑形式的日志制作方式以及如何将日历与它连接起来，并对完成效果进行展示。这种连接方式的实现效果，就是本小组所提倡的新的浏览方式。n 与整站的整合：此部分告知读者在模块完成后如何与整站进行整合，以及在整合中出现的问题以及解决方法。n 结论：这部分包含对本次毕业设计完成情况的判断，完成过程中带给笔者的心得体会，今后需要完善的地方以及对博客前景的展望。关键词：Flash；日历；日志AbstractBlog has been widely used for its colorful display of the personalization, but a simple static page can not met the appreciation of the publishers request. By using Flash in Blog will bring a strong visual impact. This is the ultimate goal of our group.Basically, the calendar appears all there in a blog. It is Obviously that the existing calendar of blog is drifted away from the main outside. Logs in the blog which have a strict timeline are often stand alone, so the calendar itself can be a waste of time to show properties. To effectively combine the two to achieve the effect of dynamic display, the paper contains 5 parts:n Introduction: Introduction includes the design of the graduate research background, as well as the runtime environment set to be completed by the introduction of the calendar module. This part of the election is to inform the reader why we choose this direction of the study, why we select Flash and what I need to complete in the module contains functions.n Calendar Module: This part shows what Methods can be used to complete the program and their effectcomparisons to determine the most suitable program to select. Followed in detail, as well as the production of the main calendar events to remind the realization of dynamic text. Finally, the completion of different parts of the display of visual effects.n Calendar Log to Achieve: To inform readers that this part of the log form of video clips as well as how to create a calendar with it and linking it to complete the effect and display. The realization of this connection the effect of this group is to promote new ways to browse.n Integration Points with the whole: This part shows readers how to integrate the entire station, as well as the integration problems and solutions.n Conclusion: This section contains the judge of the completion ， the process of the experiences during finishing this design, the need for improvement and the outlook of blog.Key Words: Flash；Calendar；Log 目录第一章 引言11.1研究背景11.2实现环境选择21.3日历模块介绍3第二章 日历模块实现52.1设计日历主体方式选择52.1.1调用组件方式52.1.2元件组合方式92.2日历主体实现方法102.2.1 Date Box设计102.2.2 Day Box设计122.2.3 Background设计142.2.4 Event Clendar设计142.3事件提示textbox设计182.4日历实现效果以及对比20第三章 动态日志实现：243.1日志页面设计243.2日志与日历的交互253.3日志实现效果273.4不足的地方29第四章 整站整合304.1整合的实现304.2出现问题以及解决方法30第五章 总结315.1结论315.2心得体会325.3展望32 ContentsChapter 1 Introduction11.1Background11.2Environment Settings21.3Calendar Module Introduction3Chapter 2 Calendar Module52.1Methods of Calendar Design52.1.1 Call Component Method52.1.2 Assemble Component Method92.2 Calendar Design102.2.1 Date Box Design102.2.2 Day Box Design122.2.3 Background Design142.2.4 Event Clendar Design142.3 Events Textbox Design182.4 Effect And Contrast20Chapter 3 Dynamic Log Design243.1Log Design243.2Log Interactive Calendar253.3Effect and Contrast273.4For Improvement29Chapter 4 Integration With Overall304.1Realization of Integration304.2Problems and Solutions30Chapter 5 Summary315.1Conclusion315.2Experience325.3Outlook32厦门大学本科毕业论文第一章 引言1.1 研究背景在确立了此次毕业设计的研究方向后，本小组对网络文化中有广泛应用性以及良好发展趋势的各个方面进行了深入的研究与调查。而作为进10余年来网络文化新生事物中最为重要的一员-BLOG也就进入了本小组的视线。毫无疑问的说，博客是web2.0时代最重要的组成部分之一,在其新生之初，没有人想象的到它的影响力会发展的如此迅速。 从2000年开始，博客成千上万涌现，并成为一个热门概念。在博客发展史上，911事件是一个重要的时刻。正是这场恐怖的袭击，使人们对于生命的脆弱、人与人沟通的重要、最即时最有效的信息传递方式，有了全新的认识。一个重要的博客门类：战争博客（WarBlog）因此繁荣起来，可以说对911事件最真实最生动的描述不在纽约时报，而在那些幸存者的博客日志中；对事情最深刻的反思与讨论，也不是出自哪一个著名记者手中，而是在诸多的普通博客当中1。正是从此刻开始，博客的风靡全球已经成为必然趋势。在现实生活中这个人接触的范围是及其有限的。在社会学中有一个150法则统计，人在接触其他人最大的上线大概在150人左右，经常接触这些人群的数量是及其有限的。但在博客世界中接触的范围从理论上讲几乎是无限的。在现实生活中人接触的有家庭、单位、学校和其他组织的。它对个人的社会意义是什么呢？可以积累一些个人的关系，满足一些个人的需求，实现一些个人的成就。博客世界相对于现实世界来讲，就有了一个进一步提升的空间。随着这种发展，博客进而升华为一种艺术。简单的时间轴式的日志排列以及仅对背景进行变换的“朴素”博客形式已经不能满足用户的需求。既然出现了这种需求，而它所追求的方面与本小组的研究方向匹配。与此同时，对博客浏览方式的改造对于本小组来说也是一个相当有挑战性的项目。经过我们小组的讨论，最终决定将本次毕业研究的方向设定为实现更丰富多彩，带给人更高视觉冲击，拥有新的浏览方式的博客展示样式。1.2 实现环境的选择本次设计的主体是网页，形式是博客。这样就带来了一个新的难题，本次设计应当选取何种工具进行实现呢？提到网页设计，自然会让人想起大名鼎鼎的网页制作三剑客-Dreamweaver,Flash,Fireworks。本小组在对相关资料经行研究后发现：Dreamweaver可以用最快速的方式将Fireworks，FreeHand，或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。对于选单，快捷键与格式控制，都只要一个简单步骤便可完成。它使用网站地图可以快速制作网站雏形、设计、更新和重组网页。它是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。但是，Dreamweaver难以精确达到与浏览器完全一致的显示效果。 而它的页面原始代码也难以控制。综合而言，Dreamweaver是一款擅长将图片/动画等元素组装成网页的网络制作软件。Flash 是一种创作工具，设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常，使用 Flash 创作的各个内容单元称为应用程序，即使它们可能只是很简单的动画。您也可以通过添加图片、声音、视频和特殊效果，构建包含丰富媒体的 Flash 应用程序。Flash 特别适用于创建通过 Internet 提供的内容，因为它的文件非常小。Flash 是通过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。综合而言，FLASH适用于动画制作，矢量流媒体动画以及交互应用等等。Fireworks可以加速WEB的设计与开发，它创建和编辑矢量图像与位图图像, 并导入和编辑本机 Photoshop 和 Illustrator 文件；采用预览、跨平台灰度系统预览、选择性 JPEG 压缩和大量导出控件, 针对各种交付情况优化图像；它使网站和各种 Internet 应用程序构建交互式布局原型。 将网站原型导出至 Adobe Dreamweaver, 将 RIA 原型导出至 Adobe Flex；它使用新的页面板在单个文档 (PNG 文件) 中创建多个页面, 并在多个页面之间共享图层。 每个页面都可以包含自己的切片、图层、帧、动画、画布设置, 因而可在原型中方便地模拟网站流程。综合而言，fireworks是一款适用于设计/制作图片的网页制作软件。经过以上介绍，不难发现本小组所要求的，是技术在视觉上的一种展示，而这种视觉展示又将服务于功能的实现。这其中包含着大量的交互式矢量多媒体开发技术。Flash动画支持矢量图形和流式传输。从简单的动画到复杂的交互式Web 应用程序,flash可以创建任何作品。通过添加图片、声音和视频,可以使Flash 应用程序媒体丰富多彩。Flash 提供了创建和发布丰富的Web 内容和强大的应用程序所需的所有功能。不管是设计动画还是构建数据驱动的应用程序,Flash 都提供了创作出色作品和为使用不同平台和设备的用户提供最佳体验的工具。通过以上的研究，本小组决定：使用Flash CS3.0为此次设计的实现环境。1.3 日历模块介绍经过小组讨论以及任务分配，本人所要完成的部分是日历的展示以及非跳转日志页面。纵观流传在网络上的博客，浏览著名的博客网站，不难发现在大部分的博客中都有日历的存在。这样是否说明本次研究对日历的展示是一种随大流的毫无任何创新的行为呢？事实并非如此。在通过对网络上的博客进行观察后发现：包含日历的博客样式中，日历总是作为一个单独的部分游离在主体边缘。绝大部分的日历模块仅仅是提供了一个万年历的功能，只有少部分人意识到了日历本身就是一个二维的时间轴。日志是一种基于时间轴的文字产物，而在绝大部分现有的博客中，日志是依附在单独的时间线性轴上，这就是本次设计要做出突破的地方。正因为如此，一个新的想法诞生了-如果将日志与日历结合，就会避免日历独立于主题之外，也避免了日历时间轴的重复。更重要的是，这样提供出一种新的日志浏览方式，在视觉上也拥有了极大的冲击力。这是一种新的博客浏览形式，这也是本次毕业设计中日历模块与大众博客不同的创新之处。在此次设计的日历模块中，本人所要实现的包括：日历的主体；调用XML文件进行事件提醒的textbox；日历不同外形的变化；日历与日志无跳转连接等。2 第二章 日历模块实现2.1 设计日历主体方式选择既然决定了使用FLASH软件进行日历模块的编写，自然而然就将面对一个新的问题-应用何种方式进行日历的实现。总体而言，使用FLASH软件进行日历的编写主要包括两种方式-调用组件方式以及元件组合方式。对两者实现以及展示效果的不同，本人将进行如下说明。2.1.1调用组件方式Adobe公司为了使用者的方便，在Flash AS中建立了大量的组件供使用者调用。ActionScript2.0包含了很多实用组件，其中就包括datechooser组件，用于任何想让用户选择日期的场合。它的建立如下图显示：新建FLASH ActionScript2.0项目，点选窗口中的组件选项，出现如图2-1所示页面。图2-1 Flash中组件调用窗口在组件框出现后，选择User Interface中的DateChooser组件并拉入图层区，如图2-2所示。图2-2 原始日历组件效果这样最基本的日历就出现了。ActionScript2.0提供了相当多的属性供使用者进行外形的修饰，包括（只选取部分进行说明）：themeColor：用于变换图像和所选日期的发亮的颜色。可能的值包haloGreen、haloBlue 和 haloOrange。默认值为haloGreen。backgroundColor：背景色。默认值为 0xEFEBEF（浅灰）。headerColor：组件标题的背景色。默认颜色为白色。borderColor：边框颜色。默认值为 0x919999。DateChooser 组件使用纯色单像素线作为其边框。此边框不能通过样式或外观进行修改。rollOverColor：滑过的日期的背景颜色。光晕主题的默认值为 0xE3FFD6（亮绿），范例主题的默认值为 0xAAAAAA（浅灰）。selectionColor：选定日期的背景颜色。光晕主题的默认值为 0xCDFFC1（浅绿），范例主题的默认值为 0xEEEEEE（极浅灰）。在Datechooser组件所在图层第一帧右键选取动作，输入：_global.styles.HeaderDateText.setStyle(color, 0x660000);_global.styles.WeekDayStyle.setStyle(color, 0x660000);这样就改变了组件月份以及星期几的颜色至深红，如图2-3所示。图2-3 代码实现组件日历外形改变对日历组件本身的属性修改，如图2-4显示。图2-4 组件日历属性修改完成了日历外观的修改后，在图层中选取“文件”-“导入”-“导入到舞台”，把所需的背景导入图层中，并右键设置为最底层。鼠标左键选取Datechooser组件，右键转化为元件，位置设置为居中，如图2-5所示。图2-5 组件日历转化成元件接着在属性中将元件选择成ALPHA 改变透明度到50%，以达到在填充背景后，不会出现突兀的遮蔽效果。值得注意的是，只有在将组件转化成图形元件后，才能直接进行透明度的修改，如图2-6所示。图2-6 组件日历修改透明度这样，组件调用式的日历就完成了。按Ctrl+Enter显示效果，如图2-7所示。图2-7 调用组件日历的预览效果组件调用形式存在很大的问题，日历的展示效果太过单调，同时无法进行更深入的修改。这种方式制作的日历页面在建立鼠标触发事件时，无法有效的转接到日志页面，组件本身的行为控制会对跳转造成很大的困扰。在经过谨慎的研究后决定，在本次毕业设计中不使用此种方法编写日历页面。2.1.2元件组合方式在明确组件调用形式的不适用后，使用元件组合完成日历这也就成为了最恰当的选择。总体而言，日历包含三个框架：整体框架-包含年月的转换以及箭头的选择；每日框架-包含每天的内容以及对应每日背景；星期一到星期日框架-包含星期一到星期日的内容以及对应背景。具体实现方法将在下一节进行详细论述。2.2 日历主体实现方法建立新的图层，命名为calendar，这就是日历主体存在的图层。建立三种子元件：Date Box，Day Box与Background，将三者在Event Calendar元件中进行组合成为日历主体。2.2.1 Date Box设计Date Box对应的是每日的框架及内容，这其中又包括另通用背景元件Date Box Background。Date Box元件实际包含三层，即用来读取日期对应数字的textbox，用于背景组合的图片以及最底层确定大小的框架。选择“插入”- “建立新元件”，定义为新的视频剪辑，命名为Date Box。进入Date Box的编辑页面，如图2-8所示。图2-8 Date Box编辑页面中间的十字准星即为调用元件时对应图层显示的相对坐标原点。首先进行的是最底层框架的建立。为了方便于页面修改，本人将此框架独立建立成一个元件进行直接调用。新建一个元件，定义为视频剪辑，命名为Date Box Background并放置到此到场景中，右键点击进行编辑。在此元件框架中建立3个图层，分别命名为labels，actions，bg（背景）。在labels图层拖入可调用组件中的label，并将其在时间轴上设置为3个阶段：1到9帧对应normal状态，即每月中可选的每一天；10到19帧对应active状态，即打开日历对应的当天；20到26帧对应disabled状态，即日历中不属于这个月不可用天（例如显示在此月第一天但对应上个月的31号）。与此同时，在bg图层对对应的3中状态添加背景。Normal状态对应无色，active状态对应深蓝色，disabled状态对应灰色。如图2-9所示。图2-9 Date Box Background的建立在这里建立的Date Box Background元件是可以直接调用的，所以在对其他部分元件进行建立并需要应用到设定背景框大小时，都可以直接调用此元件。返回到元件Date Box，将包含Date Box Background的图层重命名为box，进而在其上新建2个图层，分别命名为text和actions。在text图层中加入动态文本date_txt。在此date_txt中将直接经行对时间日期的调用。在动态文本与背景框架中间包含的是日历每日框的背景，放置在两者中间的原因是这样既不会造成对日期数字的遮蔽，也能很好的遮盖大小框架的边缘。如图2-10所示。图2-10 Date Box元件的三层组成将3者整合成一个整体，设置为相同的大小。元件Date Box的基本构成就结束了。2.2.2 Day Box设计Day Box元件对应的是星期一到星期日的框体。它建立的方法与Date Box类似，同样包含三层。建立新的元件，定义为“视频剪辑”，命名为Day Box，进入编辑画面。如图2-11所示。图2-11 Day Box编辑页面建立3个图层，分别命名box，text，actions。由于使用的背景框架是可以通用的，所以在box图层插入元件Date Box Background用作背景框架大小。在text图层插入动态文day_txt，在场景中导入星期对应的背景图案。如图2-12所示。图2-12 Day Box组件组成将3者叠加成一体，注意把动态文本右键设置成顶层防止被遮蔽，显示的效果如图2-13所示。图2-13 Day Box完成效果在actions图层的第一帧右键选取动作，加入代码用于动态文本调用星期几对应英文，在这里Day Box元件完成。2.2.3 Background设计此元件应用于整体日历的大小，其组成就是可调用的组件label。直接将可调用组件中的label拉入场景中。2.2.4 Event Clendar设计此元件是将以上三个元件进行组合并赋予其日历主体的功能（包含对事件的判定）。建立新的视频剪辑，命名为Event Clendar。将相关元件进行组合，组合的思路为：先将整体背景Background调入，完成其日历转换月份的功能；进而将Day Box对应的星期一到星期日框放置在Background之上；最后将Date Box对应的每日框组合并放置在Background之上。首先需要建立的是转换月份所需要用到的箭头效果。因为实质上是正反两个箭头对月份进行转换，所以需要将箭头制作成元件形式以方便调用并确保不会出现反向问题，具体实现如图2-14所示。图2-14 箭头的实现紧接着，在Background的左上方调入反向的Arrow元件，在它的右上方调入正向的Arrow元件。以Arrow的高度为高，进行相关变化。在以整个Background元件宽度为宽，Arrow的高度为高的长方形区域内，以中点为界。arrows.attachMovie(sparkHitArea,leftHitArea_mc,1);arrows.attachMovie(sparkHitArea,rightHitArea_mc,2);建立两个相关视频剪辑区域，分别建立触发事件。当点击左上方区域时，读取上个月；当点击右上方区域时，读取下个月。在完成这些后，在此区域的中点位置建立文本区域，读取对应月份及年份。效果如图2-15所示。图2-15 月份转变实现效果在完成了日历主体头部的构成后，需要的是建立星期一到星期日的所属框架组合。在Background元件中左方反向箭头的下方确定Day Box相关坐标原点，将Day Box循环放置七个，对应七个day_txt。在这七个动态文本中循环读取星期对应英文。this.daysOfWeek_array= Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday;这样就实现了星期一到星期日的排列，实现效果如图2-16所示。图2-16 星期显示效果接下来需要完成的就是每日框架的排列。实现这一部分的难点在于如何对应每月正确的调用日期数。这里提示出了一个数据的重要性起至日期。本次毕业设计中将日历的起止日期写于XML文件中，在读取了XML文件中的起始日期后，通过函数判断此起始日期对应年份月份中的位置，并将其在起始位置的文本框中输出。接着以此为基准点对每个月的日期进行顺序排列并从文本框中顺序输出。值得注意的是在判定为闰年时会在二月多输出一天。如同Day Box一样，Date Box被七个一循环放置于以Day Box下方为坐标原点的区域内。由于每个单独天最多可以存在于5个星期中，所以Date Box在伴随月份日期数顺序排列时，最多可以出现五行。这里就应用到了Date Box Background相关不同日期属性的背景设置。月份中每个有效日将设置为白色背景，属于上个或下个月的日设置为灰色背景，对应当天以深蓝色为背景。具体组合效果如图2-17所示。图2-17 日历主体完成效果完成日历主体并不代表着Event Calendar元件的完成。需要进一步对每天可能包含事件进行相关属性定义。总体而言，事件将分为三种状态：“once”代表此事件仅仅发生一次，这是最基本的事件定义。“weekly”代表事件将在每周的对应天发生。相对于“once”而言，本事件属性包含一个发生次数定义，用来决定事件出现的次数。“monthly”是最为复杂的定义，实质上的每月发生事件包含两种可能。即每个月的某一天发生重复事件和每月中确定几日发生事件，并重复发生持续出现在接下来几个月中。为了更好的处理定义为“monthly”的事件，将月份中的每一天定义为三种状态：day，weekday与weekendday。这样可以明确的区分事件发生的日期判定，并将其以附加属性的形式写入事件中，可以有效避免事件发生的歧义理解。至此，日历主体完成，Event Calendar元件组成完成。2.3 事件提示textbox设计仅仅完成日历的主体并不能满足本次毕业设计的需求。本人将完成从XML文件读取事件并在Textbox中即时输出的事件提醒功能。在完成这个功能之前，首先需要注意的是事件的输入格式。如图2-18所示。图2-18 事件输入格式正如图2-18所示，为了尽可能简便的写入事件，并考虑到中国人的输入习惯，所有的日期以“年-月-日-小时-分钟-秒”的样式写入。在经行事件输出时，输出的内容包括具体日期，标题，发生属性，起至日期与内容。在输出事件日期时，使用substr函数判定输入。通过不同的判定，允许如下输入：年：允许四位与二位时间输入。例：1999或99月：为了满足格式的对其，允许一到四位全部输入。例：2，02，002或0002日：为了满足格式的对其，允许一到四位全部输入。例：6，16，026或0016小时：允许一到二位输入。例：3或15分钟：允许一到二位输入。例：8或45秒：允许一到二位输入。例：7或37需要注意的是在读取小时数时，包含对am与pm的判定。在完成了对日期的读取并输出后，对标题进行输出。进而需要的是对应事件不同属性进行输出判定。从上文中可以清楚的发现事件拥有三种不懂的属性：once，weekly与monthly。在判定为once时，事件提醒变的相当简单，只需要对事件内容进行输出就可以完成功能。在判定为weekly时，如表1所示。表1 weekly事件输出对应日期输出MondayEvery week on Monday/ weekdaysTuesdayEvery week on Tuesday/ weekdaysWednesdayEvery week on Wednesday/ weekdaysThursdayEvery week on Thursday/ weekdaysFridayEvery week on Friday/ weekdaysSaturdayEvery week on Saturday/weekendsSundayEvery week on Sunday/weekends在判定为monthly时，通过设定的三种属性day，weekday和weekendday来进行区别。当事件发生在每月中特定天数并持续发生几个星期甚至几个月时，对事件进行统计。由于在每个星期中最多出现五个星期，所以事件同月中重复发生最多五次。通过d.pattern.attributes.recur进行发生次数的判定，可以很好的解决输出问题。完成以上事件输出并不完善。在判定无事件发生时，输出：This day has no events and this event was triggered by the onSelectDate event至此，事件即时提醒功能完成。2.4 日历实现效果以及对比需要提醒的是，在建立Day Box与Date Box时，不同的背景组合会造成不同的效果。在本次设计中，为了与整站进行更好的整合，本人对日历进行了大量的修改，完成了几种不同背景组合而成的日历页面。这些将在下面进行展示。没有添加背景时，无事件日期显示的效果如图2-19所示图2-19 无事件无背景日历效果没有添加背景时，有事件日期显示的效果如图2-20所示。图2-20 有事件无背景日历效果组合显示成羊皮纸时，无事件日期显示的效果如图2-21所示。图2-21 羊皮纸效果日历组合成仿iphone手机的日历显示效果如图2-22所示。图2-22 iphone手机日历效果最终进行整合时选定的日历显示效果如图2-23所示。图2-23 最终整合日历效果显而易见的，与调用组件形式的日历效果相比，元件组合形式的日历拥有更高的观赏性，虽然在实现上复杂了许多，但也完成了组件形式所没法实现的功能-即时事件提醒。事实证明，应用元件组合进行日历的设计，更适合于本次毕业设计的要求。3 第三章 动态日志实现3.1 日志页面设计要完成无跳转的日志展示形式，首先要完成日志页面的设计。在进行日志的创建时，最重要一点是日志应该以视频剪辑的形式出现。其原因是为了更好的与整站进行整合，同时因为格式的相同而可以随意调用。日志的实现方法如下：新建一个FLASH Actionscript3.0，命名为loadjpg.fla。建立两个图层，分别命名为loadjpgMC与as。Loadjpg图层用于实现渐变出现的动画效果，as图层用于对日志图片的调用。选取日志一天的内容以图片的形式输出，效果如图3-1所示。图3-1 日志图片效果在as图层的第一帧写入代码用于读取日志图片：loadpic.loadMovie(events/event3/event3.jpg);接着，在as图层第15帧插入关键帧，加入代码stop();使剪辑在运行到此处时停止并以最终状态展示。然后在loadjpgMC图层的第一帧加入白色的全景图遮盖图。在第15帧插入关键帧，创造补间动画，赋予它一个基本的ALPHA透明度变化从100%到0%，这样就达成了日志图片的视频剪辑效果。日志剪辑完成后的图层如图3-2所示。图3-2 日志剪辑相关图层3.2 日志与日历的交互在已经完成的日历模块上进行日志展示的关键在于对日志视频剪辑的调用。这需要在calendar与textbox所在的图层上方建立三个新的图层，将其命名为：news_key-用于对日志图片视频剪辑的调用；events-用于加载视频剪辑；exit_key-用于展示完日志图片剪辑后回归日历图层。在news_key图层中，从组件中加取两个button放置到场景中，一个用于对图片日志剪辑的调用，一个用于对单纯图片的调用。在属性中将两个button设置成透明，大小改为为与Date Box等同的大小，放置其在对应的想要展示的日期上。在调用图片的button上右键点选动作，加入代码：on(release)loadMovie(events/event1/event1.swf,news_mc);用于加载单纯图片转化而成的视频剪辑。在调用日志图片的button上右键点选动作，加入代码：on(release)loadMovie(events/event3/event3.swf,news_mc);用于加载日志转化而成的视频剪辑，如图3-3所示.图3-3 点击触发读取日志在最上层的events图层中建立一个空白的视频剪辑，用于放置被加载的视频剪辑。在加载完相应的视频剪辑后，还需要实现返回日志页面。此功能需要在exit_key图层上加入一个透明的组件button，调整大小使其可以覆盖整个日历的右方，在其对应的动作中加入代码：on(release)unloadMovie(news_mc); 用来删除已经加载的视频剪辑。效果如图3-4所示。图3-4 点击恢复日历主体至此日历与日志无跳转连接完成。3.3 日志实现效果在没有点选日志时效果显示为图3-5所示。图3-5 初始状态在选择日志当天时出现的渐变效果如图3-6图3-6 点击出现渐变效果渐变效果完成后将显示为图3-7.图3-7 日志完全出现效果点击右方触发动作恢复到日历初始状态如图3-8.图3-8 点击恢复到日历主体3.4 不足的地方虽然完成了对日志图片的展示，表现出了本小组对于日历与日志结合的新的博客展出方式，但这其中还有相当的不足：没有实现点选每天即时出现日志的效果。在本次毕业设计中本组使用一种调用剪辑的方式来完成这种新的展出方式，这是以后需要重点改进的地方。4 第四章 整站整合4.1 整合的实现在完成以上功能模块之后，需要将其和整站其他模块进行整合。由于本次设计是整站FLASH制作，所以不会出现无法整合的情况。本小组进行整合的方法是：把个人完成的功能模块导出为影片，将完成部分以SWF文件的形式发布。在进行整合的时候，只需要在整站主框架内调用SWF文件，既可以完成相关部分的整合。4.2 出现问题以及解决方法在本次设计进行整合的过程中，曾经出现过一个困扰了本人很久的问题：在完成日历部分后，按整合所需发布为SparkEventhsCalendar_loadXml.swf文件，但是将其与相应读取事件的SparkEventsCalendar_loadXml.xml文件同时放置与调用默认目录.BlogCalendar时，出现运行整站的过程中日历月份变化箭头功能以及事件的提醒功能无法有效实现这个严重的问题。为了解决它，本人使用了很多方法，包括把XML中关于日历时限的部分删除掉，将时限写死在代码当中，在代码当中声明新的事件等。经过长时间的研究以及他人的帮助下，最终发现问题是出在读取XML文件时没有成功读取。而解决它的方法很简单，只需要把相应的SparkEventsCalendar_loadXml.xml文件放入上级菜单.Blog中即可。至此，整合完成。5 第五章 总结5.1 结论博客的灼热毋庸置疑，但它到底是怎样进行定义的呢？博客是继Email、BBS、ICQ之后出现的第四种网络交流方式。 博客是网络时代的个人“读者文摘”。 博客是以超级链接为武器的网络日记。 博客是信息时代的麦哲伦。 博客代表着新的生活方式和新的工作方式，更代表着新的学习方式。通过博客，让自己学到很多，让别人学到更多。 博客代表着“新闻媒体3.0版”：旧媒体（old media） 新媒体（new media） 自媒体（we media）。Flash网页制作带给了我们什么？Flash网站设计精美，拥有更多声效、动画、流媒体剪辑、美术效果及兼顾互动性。Flash提供了我们一个舞台，图形和动画为演员，演员