【原创论文全套栏目提醒】:本文主要为网学会员提供“FLASH影音在线播放器的设计-界面的实现 - 计算机教材”,希望对需要FLASH影音在线播放器的设计-界面的实现 - 计算机教材网友有所帮助,学习一下!
03网络2 季晓花 11 1 南通纺织职业技术学院毕业设计
论文 FLASH影音在线播放器 —— 界面 季 晓 花 3514211 班 级 03网 络 2 班 专 业 网络技术/市场营销 教 学 系 信 息 系 指导老师 周 悦 完成时间 2007年04月01日至 2007年05月03日 03网络2 季晓花 11 2 目 录 第一章 引 言 ............................................................................................................... 5 第二章 FLASH的特点与功能 ................................................................................ 6 2.1 FLASH的特点 ........................................................................................................ 6 2.2 FLASH的功能 ........................................................................................................ 7 第三章 元件、实例的使用 .................................................................................... 9 3.1关于元件 .............................................................................................................. 9 3.1.1 元件和实例 .............................................................................................. 9 3.1.2元件的类型 ............................................................................................. 10 3.1.3 元件的优点 ............................................................................................ 10 3.2创建按钮 ............................................................................................................ 11 3.3遮罩层的使用 ..................................................................................................... 12 3.4滤镜和混合模式 ................................................................................................. 13 第四章 播放器界面功能需求分析 ................................................................... 14 第五章 播放器界面结构分析 ............................................................................. 15 5.1界面需求横向分析场景帧 ............................................................................ 15 5.2界面需求纵向分析场景层 ............................................................................ 15 第六章 色彩的应用 ................................................................................................. 17 6.1色彩在界面中的作用 ......................................................................................... 17 6.2 色彩的运用 ........................................................................................................ 17 第七章 播放器界面实现 ....................................................................................... 19 7.1 视频、进度条和列表界面等美工 .................................................................. 19 7.2 9个常见播放器按钮的制作 ........................................................................... 20 7.3 暂停/继续按钮的切换显示 ............................................................................ 20 7.4 音量按钮上的菜单效果 .................................................................................. 21 7.5 音量大小图形控制 ......................................................................................... 22 03网络2 季晓花 11 3 7.6 双击视频区完成“全屏模式”与“完整模式”间的切换 ............................ 23 7.7 当前播放曲目着重显示 .................................................................................. 24 7.8 对盗用SWF的给以友情提示 ........................................ 错误未定义书签。
23 7.9 Flash文件优化 ................................................................................................ 25 第八章 设计总结 ...................................................................................................... 27 致 谢 ........................................................................................................................... 28 参 考 文 献 ................................................................................................................. 29 03网络2 季晓花 11 4 FLASH影音在线播放器 —— 界面 【 摘 要 】 现在WEB和电脑用户对网页媒体需求是越来越多。
因为宽带的普及和质量的提高更多的用户已经不太习惯下载音乐、MV和电影了。
都习惯于在线观看浏览而且又不占用硬盘、不需要长时间等待下载、又可以经常更新。
所以本课题尝试用时下最为流行且最具发展前景的WEB元素——Flash设计并实现一个多媒体影音在线播放系统侧重其按钮、滑条、进度条的制作以及页面框架美工的设计、功能的实现。
【 关键词 】 Flash 播放器 多媒体 美工 界面设计与实现 【 Abstract 】 Now WEB and computer user to the homepage media demand is more and more many. Because of wide band popularization and quality enhancement more users already not too custom downloading music MV and movie. All is accustomed to on-line watches the browsing more over does not take the hard disk does not need the long time to wait for downloading may frequently renew. Therefore this topic tastes the test to be at present most popular also most to have the prospects for development WEB element - Flash designs and realizes a multimedia video and music on-line broadcast system contact surface: Button slippery strip progress strip manufacture and page frame art designing design function realization. 【 Keyword 】 Flash player Multimedia Art designing Contact surface design and realization 03网络2 季晓花 11 5 第一章 引 言 Flash中文译为“闪动、一闪”这个英文单词是一个用于制作网络动画的软件的名称在今天已是广为人知了。
就像Photoshop、Corel-draw、3D MAX等设计软件名称一样已被许多爱好者熟悉和掌握因为Flash是为制作网络动画而开发的软件。
现在的Flash它的流行经历了一个由默默无闻到惊天动地的历程并终于迎来了它的成功迎来了市场特别是设计界的关注和认可使设计界对于未来设计的发展趋势有了一个有据有理的认识也引发了我对于Flash现象的研究和有关设计探索的兴趣。
今天Flash已经不是什么新鲜事物了。
它大约是在两年前出现在我国的那时我国的网络才刚刚开始发展网络正式进入千家万户网络动画也随着进入了千家万户。
或是因为兴趣或是因为商业的需要或是因为设计的需要部分网民开始了Flash动画的制作。
Flash一族自2000年来逐渐成型并迅速壮大Flash
原创作品蜂拥而起。
因为动画的实用性、趣味性和娱乐性很强它已经逐步的占据了广大青少年、甚至是部分中老年的工作和生活Flash动画短片成为一时间网络最热的娱乐方式也成为了一种时尚和潮流。
开始学习和制作Flash的人越来越多人们都以能够制作出倍受大家关注的Flash动画作品而感到骄傲、自豪。
现在有许多专门的如“FLASHEMPIRE闪客帝国大话三国闪盟在线”等等这样的一些网站这里面不仅拥有大量的Flash动画供爱好者在线观看而且还是Flash迷们的一个专门交流的空间。
的确它的发展让人不得不刮目相看。
Flash作为现代的一种新的设计方式和娱乐方式不仅有其实用功能并且还有视觉和听觉上的双重享受更因为它所具有的趣味性成为现代人放松自我表现自我甚至是陶醉自我的一种方式因为各大媒体对它的宣传设计界和市场也开始对这样一种新的宣传和表达方式重视起来Flash动画的价值也开始以秒来计算大大的刺激了更多的Flash迷的创作热情。
他们汇聚在自己的网络空间里以始终如一的热情创作出一个又一个的Flash精品吸引着成千上万双眼睛的关注 03网络2 季晓花 11 6 第二章 FLASH的特点与功能 FLASH是目前最为流行的网络动画制作工具。
它集矢量编辑和动画创作功能为一体并具有灵活的交互功能能将图形、图像、音频、动画和深层次的交互动作有机地结合在一起。
由于FLASH广泛使用矢量图形文件非常小因此特别适合于创建通过INTERNET提供的内容。
与位图图像相比矢量图形所需要的内存和存储空间要小的多因为它们是一数学公式而不是大型数据集表示图像自身的。
而位图图形之所以更大是因为图像中的每个像素都需要一组独立的数据来表示。
2.1 FLASH的特点 FLASH具有简单易用、高效多能的特点。
概况来说FLASH具有以下一些优点 1 灵活播放的作品 使用FLASH不仅可以制作质量非常出色的网页还可以制作高质量的离线交互作品并且拥护不需要使用网页浏览器就可以浏览这些FLASH作品。
FLASH附带着一个免费发放的离线播放器这个离线播放器的文件非常小因此可以将它和FLASH作品一起放在依仗软盘上从而生成一个不需要单独安装既可独立播放的演示程序。
2 作品的网络传输速度快 FLASH中的动画图形用的是矢量技术而不是在大多传统网页动画图像中所使用的点阵技术因此FLASH动画作品的文件非常小下在一个包含有几个场景的全屏FLASH动画文件只需要几秒钟明显少于下载并播放一个同等大小和复杂程度的点阵组成的网页动画文件的时间。
注矢量技术由数学公式和指令描述的图像被称为矢量图形这些数学公式和指令以纯文本的形式存在所以要描述一个全屏幕动画过程只需要很小的数据量。
点阵技术由具有颜色特征的像素组成的一个矩阵来描述图像每个像素的大小和每个给定图像中的像素的总数是固定不变的。
描述一个像素需要232位数据位。
03网络2 季晓花 11 7 3 可自由缩放的FLASH图像 一般来说在网页所用的图像都要尽可能地小只有这样才能减少传输网页时的传输时间。
所以在网页中使用全屏幕图像相对较少。
否则浏览者为下载图像花费很长的时间以至于在他们还没有看到图像的整个内容时就没有了耐心。
而对于FLASH生成的网页动画不管尺寸如何其文件大小几乎是一样的只是在控制图像放大倍数上有微小区别。
因此对于FLASH网页动画来说不论画面大小其运行过程都是一样的。
4 高质量的文字和图像效果 在FLASH中使用矢量图形最大的好处是总能保证它的线条图形和文字的输出质量是浏览者的计算机所能实现的最高输出质量。
因为矢量图形中的指令可以告诉浏览者的计算机如何去识别这些图形从而保证这台计算机能尽其所能地输出高质量的图形因此在FLASH生成的网页中每一个元素都非常清晰和专业化。
而点阵动画图像经常是通过改变和扭曲被固定了大小的像素矩阵制作出来的在这个过程中一些必要的像素可能被夸大或丢失因此图像的质量受到了明显的影响。
在FLASH中使用矢量图形的另一个好处是FKASH生成的网页中绝不在它的纯色或渐变色色彩区域内找到模糊或游离的像素。
5 多用性 FLASH是一个多能的工具所输出的文件还可以被高档的图形软件所接受。
因此FLASH既可以帮助那些不太精通绘图的人将他们的想法图形化又可以让专业的图像设计师利用它进行构思或设计草稿然后输出到高档的图形软件中以便对其做进一步的加工和完善从而简化操作过程。
6 浏览FLASH作品的障碍正逐渐消除 目前几乎所有先进的和具有图形功能的浏览器都加入了支持FLASH的插件而一些十分流行的多媒体网页浏览器的插件如QuickTime4、Real Audio和Shockwave等都支持FLASH。
另外Macromedia公司已发布了FLASH动画文件格式的源代码可以提供给任何想要使用它的人因此可望看到FLASH技术将被植入到许多新的网页浏览器中包括Netscape。
2.2 FLASH的功能 FLASH功能强大。
就其基本功能来说概括起来有以下几点 03网络2 季晓花 11 8 1 具有较强的矢量绘图和动画制作功能所制作的图象质量高而动画和网页数据量小。
2 具有较强的导入和发布功能不但可以导入点阵图、QUICKTIME格式电影文件和MP3格式音乐文件等还可以发布MP3文件等。
3 采用插件的工作方式只要电脑中的浏览器安装了SHOCKWAVE FLASH插件即可观看FLASH动画。
4 采用“流式技术”播放动画文件没有全部下载完就可观看以下载的内容。
5 FLASH播放器可以直接从网上下载更新版本。
6 可充分调用FLASH文件内部库中的符号重复利用资源。
只要这个库下载后其他的电影都可以不在下载共享的符号直接使用这个库的符号是文件字节数减少。
7 包含许多功能更强大的ActionScript函数、属性和目标对象兼容并支持Flash以前的版本。
8 Apple授权使用Flash的播放器可内置于Apple产品中这样就可以通过QuickTime播放Flash的图片、电影和具有交互能力的图像。
9 采用与JavaSpcript类似的语法结构以及新的文本编辑区和调试区可进一步提高程序的开发能力开发更多的可扩展的工具以便开发Web应用程序。
10ActionScript编辑器允许有普通模式和专家模式两种模式.所有的脚本程序均可从外部脚本文件调入外部的脚本文件可以和任何ASCII码的文本文件。
11支持XML。
03网络2 季晓花 11 9 第三章 元件、实例的使用 3.1关于元件 元件是在FLASH中创建的图形、按钮或影片剪辑而实例是指位于舞台上或嵌套在另一个元件内的元件副本实例可以与它的元件在颜色、大小和功能上有很大区别。
编辑元件会更新它的所有实例但对元件的一个实例应用效果则只更新该实例。
3.1.1 元件和实例 简单地说元件是一个特殊的对象可以是一个形状也可以是一个按钮甚至可以是一段影片剪辑。
它在FLASH中只创建一次然后可以在整部影片中反复使用。
所创建的任何元件都会自动成为当前文档的库的一部分。
例如创建了一个小鸟飞翔的影片剪辑元件后当需要制作一个一群小鸟在空中飞翔的场景时就可以从库中反复拖出小鸟飞翔元件的实例。
这些元件实例的每一个都是对原元件的一次引用而不是重新创建原元件。
原元件只在最终的FLASH影片中存储一次。
不管引用多少次引用元件对文件大小都只有很小的影响。
因此如果最初做成元件的对象使影片总的文件大小增加可25KB那么添加10个、20个甚至更多的元件实例不会造成文件成倍增长且文件大小与元件的大小无关。
元件实例的外观和动作无需与原元件一样。
每个元件实例都可以有其不同的颜色和大小并提供不同的交互作用。
例如可以将按钮元件的多个实例放置在场景上其中每一个实例都有不同颜色和指定动作。
每一个元件都有自己的时间轴、场景及图层也就是说可以将元件实例放置在场景中的动作看成是将一部小的影片元件放置在较大的影片FLASH项目中。
而且可以将元件实例作为一个整体来设置影片效果。
当对元件进行编辑后元件的每个实例都会做相应的更新。
例如如果将已经用其创建过几个实例的矩形元件更改为圆形那么该元件的每一个实例也将变成圆形。
不过元件的改动在其实例中只能从图形的角度反映出来而每个元件 03网络2 季晓花 11 10 实例仍然可以拥有各自的颜色、大小和功能等特定属性。
3.1.2元件的类型 每个元件都有一个唯一的时间轴和舞台及几层。
创建元件时要选择元件类型这取决于文档中如何使用该元件。
FLASH中的元件包括以下4种类型。
1图形元件可用于静态图象并可用来创建连接到主时间轴的可重用的动画片段图形元件与主时间轴同步运行。
交互式控件和声音在图形元件的动画序列中不起作用。
2按钮元件可用于创建响应鼠标点击、滑过或其他动作的交互式按钮。
在制作这种类型的元件时首先要定义与各种按钮状态关联的图形然后将动作指定给按钮实例。
3影片剪辑元件可用于创建可重用的动画片段。
影片剪辑作为FLASH中最具有交互性、用途最多及功能最强的部分基本上是小的独立影片它们可以包含主要影片中的所有组成部分包括声音、影片及按钮。
影片剪辑拥有自己的独立于主时间轴的多帧时间轴所以可以将影片剪辑看作是主时间轴内的嵌套时间轴。
也可以将影片剪辑实例放在按钮元件的时间轴内以创建动画按钮。
4字体元件用于导出字体并在其他FLASH文档中使用它。
3.1.3 元件的优点 使用元件的优点主要有以下4个方面 1 可以简化影片的剪辑。
在应派内剪辑过程红可以把要多次使用的元素做成元件。
当修改了元件以后使用他的所有实例都会随之更新而不必逐一更改。
2由于所有实例在文件中仅保存一个完整描述其余只需保存参考指针因此应用元件可以使影片文件的大小大大缩减。
3制作运动类型的过渡影片时必须使用元件。
4在使用软件时由于一个实例在浏览中仅需要下载一次因此可以加快影片的下载速度。
03网络2 季晓花 11 11 3.2创建按钮 按钮实际上是一个四帧的交互影片剪辑。
当为元件选择按钮行为时FLASH会创建一个四帧的时间轴。
前三帧显示按钮的三种可能状态第四帧则定义按钮的活动区域。
如果要使一个按钮具有交互性可以把该按钮元件的一个实例放在舞台上然后给该实例指定动作。
必须将动作指定给文档总的按钮实例而不是指定给按钮时间轴中的帧。
按钮元件时间轴上的每一帧都表示一种状态这4种状态的功能如下 1第1帧弹起状态表示指针没有经过按钮时该按钮的状态。
2第2帧指针经过状态表示当指针滑过按钮时该按钮的外观。
3第3帧按下状态表示单击按钮时该按钮的外观。
4第4帧点击状态定义响应鼠标单击的区域。
此区域在SWF文件中是不可见的。
如果没有在“点击”帧指定动作则显示“弹起”帧中的对象就作为响应鼠标事件的动作。
创建按钮的操作步骤如下 1确保没有选择舞台上的任何内容。
2选择“插入”“新建元件”命令弹出“创建新元件”对话框在“名称”文本框中键入新按钮元件的名称并在“类型”选项组中单击“按钮”单选按钮。
3单击“确定”按钮切换到元件编辑模式。
同时时间轴的标题会变为显示4个标签分别为“弹起”、“指针经过”、“按下”和“点击”的连续帧。
第1帧“弹起”是空白关键帧。
4创建弹起状态的按钮图像。
可以使用绘画工具、导入一幅图形或在舞台上放置另一个元件的实例。
注可以在按钮中使用图形元件和影片剪辑元件但不能在按钮中使用另一个按钮 5单击标示为“指针经过”的第2帧然后选择“插入”“时间轴”“关键帧”命令使其成为一个关键帧。
6将按钮图象改为“指针经过”状态。
7为“按下”帧和“点击”帧重复步骤5和6。
8完成之后单击编辑栏上的“返回”按钮退出元件编辑模式。
然后从 03网络2 季晓花 11 12 “库”面板中拖出按钮元件即.
上一篇:
论文原创性声明
下一篇:
临床前药物安全性评价中毒性病理学新技术的应用