Director笔记课件制作详细总结

Director笔记课件制作详细总结2010-08-06 11:20:35| 分类：默认分类| 标签：|字号大中小订阅Director制作多媒体教学课件（总结）一、规划课件框架一般的多媒体教学课件所需辅助教学功能无非加入一些文字、图片、视频、动画、交互来起到辅助文字阐述内容的作用。

在这里简单以一个以文字（名词解释）、图片、视频为辅助的多媒体教材的制作为例，说明如何使用director制作一个简单的多媒体课件，也作为对前一段所做工作的一个简单总结。

首先要规划课件的框架结构。

在这里我用到的稿本是一个比较规矩的三级目录结构的文字稿本，简单描述一下：稿本共三章，每章分三节，每节有三讲内容，每讲内容对应一篇文字，其中包含超链接，跳转到名词解释、图片、视频等内容辅助说明对应本讲的具体内容。

二、准备相应素材依据稿本内容，搜集所需的名词解释、图片、视频等素材。

我用到的是jpg格式图片和mpeg格式的视频。

在素材准备阶段还要准备好界面所需的图片，要保留设计界面所用的psd文件，保存分层信息，以备在界面改动时所用。

有些界面上的元素还需要分层输出，如按钮等。

三、制作程序框架建立工程文件，并进行设置。

新建一个director工程文件，设置窗口大小为800*600（我做的课件参照的制作标准要求为800*600），背景色设置为适当颜色，尽量和自己设计的程序的背景图片的主色调一致，Movie面板中设置stage size为800X600，channels为150，color为#000000。

设置程序窗口居中显示，无边框，无标题栏，通过将属性面板中display template的location 选项中centered勾选，取消resizable勾选，设置titlebar options下的四个多选项全都取消选取可实现。

在这里还可以设置打包输出后可执行程序的图标。

这样就设置好了一个全屏为黑色背景，窗口无边框，大小为800*600的舞台。

导入事先制作好的背景和按钮等图片。

将事先设计好的程序背景和按钮图片导入，注意若有图片包含白色区域时，要将trim white space选项取消勾选，否则会将图中白色区域作为透明处理，除非你想要这种效果。

我在设计背景时将背景和上面的文字按钮分别输出，也就是说背景上不含有文字，这样可以实现背景图片的重复使用，减少主程序体积，同时，也利于日后的内容修改，我可以单独修改任何一个文字按钮或其它内容而尽可能减少对其它内容的影响。

由于director中的文字无法做出阴影等效果，我在PS中制作它们，并以png格式输出为图片，并导入到DR中使用，这样可以带有阴影或描边等效果，同时也可以保留透明度等信息，实现和背景的完美融合。

由于在各个章节目录页面上，章节标题的文字要做为按钮使用，所以在从设计的psd文件输出png文件时，每个文字标题需要输出两个文件，分别表示按钮的正常和高亮状态。

要保持图片大小相同，文字位置一致，只有效果不同，这样才可以避免出现mouseover时文字高亮出现错位的情况。

输出这些按钮的过程是个重复而枯燥的过程。

在这里就涉及到了一个文件命名的问题，为了统一，同时为了便于将来编写代码时便于引用spirte的名称进行批量操作或循环操作，作为标题按钮用的图片要按照一定规范进行命名。

因为我的稿本是三级目录结构，我就使用三位数字分别表示三级层次，文件名统一以tt开始，表示这些是标题文字，如第一章标题使用“tt100”表示，第一章第一节“tt110”，第一章第一节第一讲“tt111”对应的高亮图片在后面加一个a进行区分，如“tt100a”、“tt110a”、“tt111a”，这样导入后就不需再改cast member名称，可以直接放到舞台上用，并通过变量引用sprite名称进行编程。

界面图片导入后，需要把每章的具体内容的文字拷贝到cast中，作为一个个单独的cast member ，命名时与对应的那一讲的标题文字的数字一致，在前面再加上字母txt来区分，如“txt111”。

在时间线上将演员按照稿本的框架结构进行布局。

在每个界面最后一祯的script层加入一个hold on current frame的behavior，使程序能停在每一级界面上。

在每个界面第一祯处添加一个marker，命名与标题文字的命名保持一致，为“t100”等。

第一级界面标记为“start”。

四、进行程序功能设计为文字按钮添加behavior添加鼠标效果：先写一个名为Cursor Change的behavior如下：on mouseenter mecursor 280endon mouseleave mecursor 0endon mousedown mecursor 0end实现鼠标经过按钮上方时变为手形，离开按钮恢复原状。

再写一个控制程序跳转位置的behavior名为title forward如下：global gDestinationglobal prePageglobal gUpPageglobal gIndexon mouseUp megDestination=chars(sprite(_player.currentspritenum).mem ,2,5)gIndex=gIndex+1gUpPage[gIndex]=gDestinationgo to gDestinationprePage=gDestinationend实现根据文字按钮演员名称跳转到对应的页面的功能。

这里用到了几个全局变量gDestination/ prePage/ gUpPage/ gIndex，在程序初始化的behavior中进行声明，该behavior名为init。

在init中所有变量声明、全局函数都写在on startmovie me这个方法中，现在我要声明用到的四个全局变量，应写为：on startmovie meglobal gDestinationgDestination="start"global prePageprePage="start"gUpPage=[]global gIndexgIndex=1gUpPage[gIndex]="start"end其中gDestination用于获取跳转的目标位置，prePage用于保存在内容页面中向名词解释、图片、视频等辅助页面跳转前的位置，给返回按钮用,gUpPage作为一个数组，用于记录跳转路径，给返回按钮引用，gIndex用于gUpPage数组的下标值。

从behavior库中调入一个Push Button的behavior。

选中所有文字按钮，赋予Cursor Change 、Title Forward、Push Button三个属性，在赋予Push Button属性的时候需要指定按钮各个状态的cast member，可以各个单独拖动Push Button到每个按钮上，也可以全选所有的按钮，先进行相同的设置，然后再从属性面板一个个调整按钮的设置，这样可以省去每次都要拖动一个Push Button到sprite上。

这样就实现了将章节标题制作成带有文字特效的按钮的功能。

文本框及滑动杆的制作。

有很多具体内容是大篇幅的文字，无法在一屏内显示，分成多屏显示会显得结构混乱，于是可以给文字加入类似word 等软件右侧的滑动条，实现文字滚动的效果。

首先要自己制作滚动条按钮的图片，在PS中涉及一套滚动控制杆的外观，包括向上、向下按钮，滑动杆，滑动杆下面的背景滑动条。

可以根据自己做的课件的性质制作成个性化的界面，可以做成类似winXP风格的，也可以做成水晶的效果，不规则的图形等，还可以完成后在DR中设置为半透明的效果（调整ink属性的透明度即可）。

将制作好的滑动条图片导入后放置在舞台上，从library->text 中拖动一个Custom Scrollbar的behavior到cast中，再将其赋予滑动条的各个控件，设置好各个参数。

现在运行程序会发现滑动条和文本演员一样长，而且文本演员还是100%显示，并无滑动效果，所以还需要对需要进行滚屏的文本演员进行设置，在属性text面板中的framing设置为fixed，再在舞台上将文本演员放置在合适的位置，此时就可以自己调整文本演员的大小了，再次运行程序，会发现可以实现滚屏效果了。

比较奇怪的是其它控件可以自动对齐到文本演员的旁边，而向下箭头偏偏不会自动调整，每次都要自己手动对位，不知道是不是我的软件版本或是系统的问题（郁闷……）。

现在感觉文本背景是黑乎乎的很难看，好，将文本sprite的ink属性设置为background transparent，好，现在文字下方可以透出下面的背景图了，效果很好！其它文本页面和名词解释的页面也作相同设置。

如果精巧设计背景图，为文本区域设计一个漂亮的边框，会是很好的效果。

（在总结的工程文件中名词解释部分我用了一个自己设计的比较满意的背景和文字融合得比较好）制作图片和视频播放器出于简单起见，图片浏览器和视频播放器我把quicktime的播放器界面PS了一下用于这两个界面。

将设计好的播放器背景和按钮导入cast中，再摆放到舞台上对应页面的合适位置。

完成图片浏览器按钮功能由于一个内容配以多幅图片来辅助说明，我把它做成一个简单的图片浏览器的形式，在时间线上每幅图占一祯的位置。

使用Go Next Button和Go Previous Button两个按钮来实现前后图片的翻页，由于这两个按钮实现的是向前后marker 位置的跳转，所以要在每一个有图片的祯上标记一个marker，注意：第一幅图的向前按钮和最后一幅图的向后按钮不添加按钮的behavior，考虑到将来在进入图片浏览器时要加转场效果，而又不想在每次由第二幅图翻回第一幅图时都出现转场，所以要把第一幅图的长度向前延长一祯，转场放在最前面的祯上。

具体实现为：在第二祯处切断fbw按钮，向后一部分添加Go Next Button的behavior；在最后一祯处切断ffw按钮，向前一部分添加Go Previous Button的behavior。

按钮需要鼠标变形，现在给图片浏览器和视频播放器所有功能按钮添加Cursor Change和Push Button的behavior。

第一幅图的fbw和最后一幅图的ffw就不必了。

完成视频播放器的按钮功能首先，我用的是mpeg格式的视频文件，由于DR不支持mpeg文件，所以在这里要用到一个插件，方法为：应先将DirectorMediaXtras.x32文件放到DR的安装目录下的插件目录中。

（Program Files-）Macromedia-）Director mx2004-）Configuration-）Xtras-）Media Element）在DR 菜单Insert-〉Tabuleiro Xtras->DirectorMediaXtra中，可以打开DirectorMediaXtra的设置菜单，在此选择所要导入的mpeg文件，确定即可，在确定左边“注册”按钮可输入注册码“dmx0000000”。