论文部分内容阅读
摘 要：本文主要介绍基于Flash Professional 8和Camtasia studio 4平台研制多媒体辅助视频教学课件的技巧，其中包括整合文件时路径问题的解决、自定义视频播放器、FLV视频文件添加注释、设置文本显示格式、课件中显示时间等。
关键词：视频播放器；提示点；FLV；Camtasia studio；教学课件
中图分类号：G434 文献标识码：B 文章编号：1673-8454(2008)10-0048-03
一、视频教学课件介绍
1.课件功能
笔者主持的科研项目“多媒体课程辅助教学课件的研制”，其中一个主要的成果是基于PhotoShop实例教程（该教程也是项目的一个成果）开发学习PhotoShop CS 3软件的视频教学课件，包括书中典型实例的课件和基础知识的课件，最终的作品形式是一张DVD光盘。光盘首页文件Index.swf是一个导航，点击导航按钮可以分别进入“实例视频课件”、“基础知识视频课件”、“素材文件夹”、“作品赏析”、“快捷键”页面，如图1所示课件的导航页面。如图2所示“饰品”教学课件的界面，在首页中依次点击“实例课件|色彩模式|饰品”，开始播放制作“饰品”实例的教学课件，图中所示是需要进行解释的部分通过图形进行强调，并在界面的底部进行“配音”。
Camtasia studio4提供了Camtasia MenuMaker及Camtasia Theater工具来制作菜单，以把所有的.swf文件组织起来，但是本项目中使用Flash作为整合平台，以便充分的利用Flash的优点，以更自由的空间来整合.swf文件。以jxshp5-3.camrec源文件为例，介绍整个的整合过程。
1.导出.swf格式文件
在Camtasia编辑环境里，点击“produce video as…”，弹出“Production Wizard”窗口，根据向导进行设置，采用默认生成的文件名为jxshp5-3，保存路径为e:\cam。在这里建议勾选“organize produced files into sub-folder”，这样可以把jxshp5-3.camrec导出时生成的所有文件（包括jxshp5-3.xml、jxshp5-3.js、jxshp5-3.css、jxshp5-3.swf、jxshp5-3_controller.swf等）都包括在jxshp5-3子目录中。Camtasia中导出的.swf文件是带有播放器的。每一个实例教学课件或基础知识教学课件，导出成.swf格式时统一保存在目录cam下的一个子目录里，方便组织和管理。
2.Flash平台整合作品
主文件shilikuangjia14.swf使用Loadmovie函数载入需要的.swf文件到主场景中。假设shilikuangjia14.swf和cam在同一目录里，使用语句“LoadMovie(”cam/jxshp5-3/ jxshp5-3_controller.swf”,this.myclip)”载入教学实例代替主场景中的实例名称myclip的影片剪辑。这时候，测试影片却发现不能如期的调用教学视频文件进行播放，提示找不到jxshp5-3.swf文件。可见整合的关键问题是错误的文件链接。
解决方法是：把jxshp5-2子目录中的jxshp5-2_config.xml文件移动到e盘根目录下，然后用记事本打开jxshp5-2.xml文件，找到“jxshp5-2.swf ”，修改为“cam\jxshp5-2\jxshp5-2.swf ”，然后再进行测试。Camtasia导出文件以后，生成的文件夹里还包括设置样式的FlashTemplate.css文件，这样就可以在导出文件之后继续修改相关的样式而不需要再次在cam中编辑并导出。
三、自制视频播放器
本项目中的另一种解决方法是利用Camtasia Studio 4录制并导出为FLV格式的视频文件，再使用Flash对FLV进行编辑、导出为.swf文件。
录制生成的.avi格式文件可以通过Flash 8 Video Encoder生成FLV格式的文件，但是在Camtasia中可以进行编辑以后再导出，所以本项目采用后一种方法。
1.制作播放器
虽然Camtasia导出的FLV文件可以包含播放器，在Flash中导入视频的时候可以添加预置的播放器，但这里主要介绍如何自制视频播放器。
FLV Playback 是 Flash Professional 8 的新增组件，用于查看视频的显示区域，包括查看 FLV 文件以及对该文件进行操作的控件。
FLV Playback Custom UI组件包括 FLV 回放自定义用户界面组件，提供控制按钮和机制，包括播放、停止、暂停 FLV 文件以及对该文件进行其它控制。FLV Playback 组件和 FLV 回放自定义用户界面控件显示在Flash软件的“组件”面板中。
制作过程如下：
将 FLV Playback 组件拖到舞台上，并为其实例命名为my_FLVPlybk。
选中舞台上的 FLVPlayback 组件，在“组件”检查器的“参数”选项卡上找到 contentPath 参数的 Value 单元格，并输入FLV文件的路径。
在“组件”面板中，将Play PauseButtonForwardButtonBackButton、SeekBar拖到舞台上，然后将它们置于 FLVPlayback 实例上，并水平排列在下面。在“属性”检查器中为每个按钮提供一个实例名称（如myppbutton、myfbutton、mybbutton、mysbar）。
在时间轴第 1 帧的“动作”面板上，为 video 类添加一条 import 语句，并且将按钮和搜索栏名称分配给相应的 FLVPlayback 属性，代码如下：
import mx.video.*;
my_FLVPlybk.playPauseButton = myppbutton;
my_FLVPlybk.forwardButton = myfbutton;
my_FLVPlybk.backButton = mybbutton;
my_FLVPlybk.seekBar = mysbar;
2.添加注释
播放FLV文件的过程中，如果需要在一些特定的时刻（FLV文件的一些关键帧）显示注释信息，需要借助于提示点（cuePoint）来完成。
提示点是一个点，在播放 FLV 文件时，视频播放器在该点处调度一个 cuePoint 事件。有三种类型的提示点：导航、事件和 ActionScript。ActionScript 提示点是一种外部提示点，可以通过组件的“Flash 视频提示点”对话框或通过 FLVPlayback.addASCuePoint() 方法添加。项目中就是使用ActionScript提示点在FLV文件播放到某一个时刻的时候在视频组件外的文本框中显示相应的提示信息，步骤如下：
/** 舞台上的 FLVPlayback 组件具有实例名称 my_FLVPlybk,TextArea 组件具有实例名称 my_ta */
import mx.video.*;
// 创建提示点对象并添加提示点
var cuePt:Object = new Object();
cuePt.time = 2.55;
cuePt.name = "elapsed_time";
cuePt.type = "actionscript";
my_FLVPlybk.addASCuePoint(cuePt);
// 使用 time 和 name 参数添加AS 提示点
my_FLVPlybk.addASCuePoint(7.8, "elapsed_time2");
var listenerObject:Object = new Object();//播放到了提示点，在动态文本框中显示相应的操作提示
listenerObject.cuePoint = function(eventObject:Object) {
switch (eventObject.info.time) {
case 2.55:my_ta.text = "现在播放到了2.55秒 " ;break;
case 7.8:my_ta.text = "现在播放到了7.8秒 " ;break;
default:my_ta.text="此处显示教学视频的提示信息";break;
}}
my_FLVPlybk.addEventListener("cuePoint", listenerObject);
另外，在舞台上可以通过下面的方式设置文本的显示格式，代码如下所示：
var my_ta:mx.controls.TextArea;
_global.styles.TextInput.setStyle("fontWeight", "bold");
_global.styles.TextInput.setStyle("backgroundColor", 0x00004b);
_global.styles.TextInput.setStyle("marginLeft", 15);
_global.styles.TextInput.setStyle("marginRight", 20);
_global.styles.TextInput.setStyle("color", 0x07f1f4);
_global.styles.TextInput.setStyle("fontSize", 18);
_global.styles.TextInput.setStyle("borderStyle", "none");
在课件中显示时间的代码如下，所示：
var dayOfWeek_array:Array = new Array("星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
var today_date:Date = new Date();
var date_str:String =
(
" 北京时间 " dayOfWeek_array[today_date.getDay()] " "
today_date.getHours() ":" today_date.getMinutes()
);
my_ta.text=date_str;
四、结语
Camtasia软件是一个使用起来很方便的视频编辑软件。教学中，在讲授某一个实例或是整个的教学过程需要不断重复讲解的时候，可以使用Camtasia录制下来，制作成视频课件。在播放的同时，老师还可以在学生中间进行辅导讲解，充分的利用课堂时间。
参考文献:
[1]吴有林.计算机辅助教学技术[M].北京：清华大学出版社. 2006.
[2]方其桂.Flash mx课件制作方法与技巧[M].北京：人民邮电出版社.2004.
[3]刘亚平.郝谦.计算机辅助教学与多媒体课件制作[M]. 湖北：华中师范大学出版社，2005.
[4]林筑英.多媒体教学应用原理与开发技术[M].北京：电子工业出版社.2005.
[5]马克·盖勒（著）司大宇.数字图像处理技巧[M].浙江：浙江摄影出版社.2002.
[6] Gary David Bouton（美）.Inside PhotoShop完全攻略[M].北京：海洋出版社.2002.
关键词：视频播放器；提示点；FLV；Camtasia studio；教学课件
中图分类号：G434 文献标识码：B 文章编号：1673-8454(2008)10-0048-03
一、视频教学课件介绍
1.课件功能
笔者主持的科研项目“多媒体课程辅助教学课件的研制”，其中一个主要的成果是基于PhotoShop实例教程（该教程也是项目的一个成果）开发学习PhotoShop CS 3软件的视频教学课件，包括书中典型实例的课件和基础知识的课件，最终的作品形式是一张DVD光盘。光盘首页文件Index.swf是一个导航，点击导航按钮可以分别进入“实例视频课件”、“基础知识视频课件”、“素材文件夹”、“作品赏析”、“快捷键”页面，如图1所示课件的导航页面。如图2所示“饰品”教学课件的界面，在首页中依次点击“实例课件|色彩模式|饰品”，开始播放制作“饰品”实例的教学课件，图中所示是需要进行解释的部分通过图形进行强调，并在界面的底部进行“配音”。
Camtasia studio4提供了Camtasia MenuMaker及Camtasia Theater工具来制作菜单，以把所有的.swf文件组织起来，但是本项目中使用Flash作为整合平台，以便充分的利用Flash的优点，以更自由的空间来整合.swf文件。以jxshp5-3.camrec源文件为例，介绍整个的整合过程。
1.导出.swf格式文件
在Camtasia编辑环境里，点击“produce video as…”，弹出“Production Wizard”窗口，根据向导进行设置，采用默认生成的文件名为jxshp5-3，保存路径为e:\cam。在这里建议勾选“organize produced files into sub-folder”，这样可以把jxshp5-3.camrec导出时生成的所有文件（包括jxshp5-3.xml、jxshp5-3.js、jxshp5-3.css、jxshp5-3.swf、jxshp5-3_controller.swf等）都包括在jxshp5-3子目录中。Camtasia中导出的.swf文件是带有播放器的。每一个实例教学课件或基础知识教学课件，导出成.swf格式时统一保存在目录cam下的一个子目录里，方便组织和管理。
2.Flash平台整合作品
主文件shilikuangjia14.swf使用Loadmovie函数载入需要的.swf文件到主场景中。假设shilikuangjia14.swf和cam在同一目录里，使用语句“LoadMovie(”cam/jxshp5-3/ jxshp5-3_controller.swf”,this.myclip)”载入教学实例代替主场景中的实例名称myclip的影片剪辑。这时候，测试影片却发现不能如期的调用教学视频文件进行播放，提示找不到jxshp5-3.swf文件。可见整合的关键问题是错误的文件链接。
解决方法是：把jxshp5-2子目录中的jxshp5-2_config.xml文件移动到e盘根目录下，然后用记事本打开jxshp5-2.xml文件，找到“
三、自制视频播放器
本项目中的另一种解决方法是利用Camtasia Studio 4录制并导出为FLV格式的视频文件，再使用Flash对FLV进行编辑、导出为.swf文件。
录制生成的.avi格式文件可以通过Flash 8 Video Encoder生成FLV格式的文件，但是在Camtasia中可以进行编辑以后再导出，所以本项目采用后一种方法。
1.制作播放器
虽然Camtasia导出的FLV文件可以包含播放器，在Flash中导入视频的时候可以添加预置的播放器，但这里主要介绍如何自制视频播放器。
FLV Playback 是 Flash Professional 8 的新增组件，用于查看视频的显示区域，包括查看 FLV 文件以及对该文件进行操作的控件。
FLV Playback Custom UI组件包括 FLV 回放自定义用户界面组件，提供控制按钮和机制，包括播放、停止、暂停 FLV 文件以及对该文件进行其它控制。FLV Playback 组件和 FLV 回放自定义用户界面控件显示在Flash软件的“组件”面板中。
制作过程如下：
将 FLV Playback 组件拖到舞台上，并为其实例命名为my_FLVPlybk。
选中舞台上的 FLVPlayback 组件，在“组件”检查器的“参数”选项卡上找到 contentPath 参数的 Value 单元格，并输入FLV文件的路径。
在“组件”面板中，将Play PauseButtonForwardButtonBackButton、SeekBar拖到舞台上，然后将它们置于 FLVPlayback 实例上，并水平排列在下面。在“属性”检查器中为每个按钮提供一个实例名称（如myppbutton、myfbutton、mybbutton、mysbar）。
在时间轴第 1 帧的“动作”面板上，为 video 类添加一条 import 语句，并且将按钮和搜索栏名称分配给相应的 FLVPlayback 属性，代码如下：
import mx.video.*;
my_FLVPlybk.playPauseButton = myppbutton;
my_FLVPlybk.forwardButton = myfbutton;
my_FLVPlybk.backButton = mybbutton;
my_FLVPlybk.seekBar = mysbar;
2.添加注释
播放FLV文件的过程中，如果需要在一些特定的时刻（FLV文件的一些关键帧）显示注释信息，需要借助于提示点（cuePoint）来完成。
提示点是一个点，在播放 FLV 文件时，视频播放器在该点处调度一个 cuePoint 事件。有三种类型的提示点：导航、事件和 ActionScript。ActionScript 提示点是一种外部提示点，可以通过组件的“Flash 视频提示点”对话框或通过 FLVPlayback.addASCuePoint() 方法添加。项目中就是使用ActionScript提示点在FLV文件播放到某一个时刻的时候在视频组件外的文本框中显示相应的提示信息，步骤如下：
/** 舞台上的 FLVPlayback 组件具有实例名称 my_FLVPlybk,TextArea 组件具有实例名称 my_ta */
import mx.video.*;
// 创建提示点对象并添加提示点
var cuePt:Object = new Object();
cuePt.time = 2.55;
cuePt.name = "elapsed_time";
cuePt.type = "actionscript";
my_FLVPlybk.addASCuePoint(cuePt);
// 使用 time 和 name 参数添加AS 提示点
my_FLVPlybk.addASCuePoint(7.8, "elapsed_time2");
var listenerObject:Object = new Object();//播放到了提示点，在动态文本框中显示相应的操作提示
listenerObject.cuePoint = function(eventObject:Object) {
switch (eventObject.info.time) {
case 2.55:my_ta.text = "现在播放到了2.55秒 " ;break;
case 7.8:my_ta.text = "现在播放到了7.8秒 " ;break;
default:my_ta.text="此处显示教学视频的提示信息";break;
}}
my_FLVPlybk.addEventListener("cuePoint", listenerObject);
另外，在舞台上可以通过下面的方式设置文本的显示格式，代码如下所示：
var my_ta:mx.controls.TextArea;
_global.styles.TextInput.setStyle("fontWeight", "bold");
_global.styles.TextInput.setStyle("backgroundColor", 0x00004b);
_global.styles.TextInput.setStyle("marginLeft", 15);
_global.styles.TextInput.setStyle("marginRight", 20);
_global.styles.TextInput.setStyle("color", 0x07f1f4);
_global.styles.TextInput.setStyle("fontSize", 18);
_global.styles.TextInput.setStyle("borderStyle", "none");
在课件中显示时间的代码如下，所示：
var dayOfWeek_array:Array = new Array("星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
var today_date:Date = new Date();
var date_str:String =
(
" 北京时间 " dayOfWeek_array[today_date.getDay()] " "
today_date.getHours() ":" today_date.getMinutes()
);
my_ta.text=date_str;
四、结语
Camtasia软件是一个使用起来很方便的视频编辑软件。教学中，在讲授某一个实例或是整个的教学过程需要不断重复讲解的时候，可以使用Camtasia录制下来，制作成视频课件。在播放的同时，老师还可以在学生中间进行辅导讲解，充分的利用课堂时间。
参考文献:
[1]吴有林.计算机辅助教学技术[M].北京：清华大学出版社. 2006.
[2]方其桂.Flash mx课件制作方法与技巧[M].北京：人民邮电出版社.2004.
[3]刘亚平.郝谦.计算机辅助教学与多媒体课件制作[M]. 湖北：华中师范大学出版社，2005.
[4]林筑英.多媒体教学应用原理与开发技术[M].北京：电子工业出版社.2005.
[5]马克·盖勒（著）司大宇.数字图像处理技巧[M].浙江：浙江摄影出版社.2002.
[6] Gary David Bouton（美）.Inside PhotoShop完全攻略[M].北京：海洋出版社.2002.