SMIL
应
用教
程
学
习
WEB
多媒体
开发
的注意了
SMIL(Synchronized Multimedia Intergration Language,
同
步
多媒体集成
语
言)是一
种
以
简单
，易于了解的XML
语
言
使各 种 格式的多媒体播放同 步 的 语 言。它可以集成到其它XML 语 言中，其他XML 语 言也能集成到 该语 言中，从而 强 化
XML的"可 扩 展"特征。
如果你使用 过 HTML, 就会 习惯 于 SMIL 语 法，至少一 开 始是 这样 。如果你未使用 过 HTML ，但从本教程了解 XML ，你也会 发
现该词汇 是 较 容易的一 种 。
SMIL 能用于控制从源流 进 的媒体，如RealAudio和RealVideo以及各 种 其他媒体格式，包括 图 像，文本，声音和 视频
使各 种 格式的多媒体播放同 步 的 语 言。它可以集成到其它XML 语 言中，其他XML 语 言也能集成到 该语 言中，从而 强 化
XML的"可 扩 展"特征。
如果你使用 过 HTML, 就会 习惯 于 SMIL 语 法，至少一 开 始是 这样 。如果你未使用 过 HTML ，但从本教程了解 XML ，你也会 发
现该词汇 是 较 容易的一 种 。
SMIL 能用于控制从源流 进 的媒体，如RealAudio和RealVideo以及各 种 其他媒体格式，包括 图 像，文本，声音和 视频
SMIL
语
法
最基本的SMIL表示就像 创 建一个 简单 HTML 页 一 样简 便， 观 察以下代 码 看看我 们 的意 图 是什 么
<smil>
<body>
<audio src="rstp://realserver.javertising.com/jt01.rm"/>
<audio src="rstp://realserver.javertising.com/jt02.rm"/>
<audio src="rstp://realserver.javertising.com/jt03.rm"/>
</body>
</smil>
上述代 码 只不 过 列出下 载 文件 时 将播出的几个多媒体文件
与所有XML文档一 样 ，有一个根元素，在本例中，根元素是smil。 SMIL 文档必 须 遵守所有其他 XML 规则 ，其中一些在 SMIL
规 范中定 义 ，与 XML1.0 规 范一致。所有元素名均小写，自然属性 值 必 须 有引号中， 对 "( 引号 ),&,( 省略号 ),<( 左尖括号 ) 和 >( 右
尖括号 ) 必 须 使用字符引用。
根据SMIL 规 范，SMIL文档的body元素是必不可少的。如果愿意，可以包含一个head元素，但不做要求:
<smil>
<head><!--this is an optional element--></head>
<body><!--this is a required element--></body>
</smil>
创 建你的第一个SMIL作品以后，可以用smi或smil 扩 展名保存 该 文件。
顺 序 标 注 (seq) 用于 标记 你希望 顺 序播出的元素 , 而并行 标 注用于 标记 你希望并 发 播出的元素。考 虑 以下 简单标记 :
<seq>
<audio src="mySong.rm"/>
<audio src="yourSong.rm/>
</seq>
上述代 码 将 强 迫媒体播放机播放列出的第一首歌，在第一首歌播完之后播放下一首歌。
你可能不打算并行地播放音 乐 ，但你可能想在播放音 乐时显 示描述 该 音 乐 作品的文本：
<par>
<audio src="mySong.rm"/>
<textstream src="songDesc.rt"/>
</par>
注意 rt 和 rm 扩 展。 这 些是 RealMedia 格式 .
SMIL 的一个有趣方面是，媒体内容的 类 型不是得自元素名，而是来自服 务 器，操作系 统 或元素的 type 属性，后者定 义
MIME 类 型
如果你希望在文档中引用 SMIL DTD 代 码应 是 这样 的 :
<!DOCTYPE smil PUBLIC "-//W3C//DTD SMIL 1.0//EN"
" http://www.w3.org/TR/REC-smil/SMIL10.dtd ">
不 过 ，注意 SMIL 不允 许 你利用 实 体 说 明 扩 展 DTD 。
以下几 节 介 绍 SMIL 元素，它 们 的属性，它 们 可能的内容及它 们 的父代元素。本教程末尾，你将找到一个完事的 SMIL 文档 .
最基本的SMIL表示就像 创 建一个 简单 HTML 页 一 样简 便， 观 察以下代 码 看看我 们 的意 图 是什 么
<smil>
<body>
<audio src="rstp://realserver.javertising.com/jt01.rm"/>
<audio src="rstp://realserver.javertising.com/jt02.rm"/>
<audio src="rstp://realserver.javertising.com/jt03.rm"/>
</body>
</smil>
上述代 码 只不 过 列出下 载 文件 时 将播出的几个多媒体文件
与所有XML文档一 样 ，有一个根元素，在本例中，根元素是smil。 SMIL 文档必 须 遵守所有其他 XML 规则 ，其中一些在 SMIL
规 范中定 义 ，与 XML1.0 规 范一致。所有元素名均小写，自然属性 值 必 须 有引号中， 对 "( 引号 ),&,( 省略号 ),<( 左尖括号 ) 和 >( 右
尖括号 ) 必 须 使用字符引用。
根据SMIL 规 范，SMIL文档的body元素是必不可少的。如果愿意，可以包含一个head元素，但不做要求:
<smil>
<head><!--this is an optional element--></head>
<body><!--this is a required element--></body>
</smil>
创 建你的第一个SMIL作品以后，可以用smi或smil 扩 展名保存 该 文件。
顺 序 标 注 (seq) 用于 标记 你希望 顺 序播出的元素 , 而并行 标 注用于 标记 你希望并 发 播出的元素。考 虑 以下 简单标记 :
<seq>
<audio src="mySong.rm"/>
<audio src="yourSong.rm/>
</seq>
上述代 码 将 强 迫媒体播放机播放列出的第一首歌，在第一首歌播完之后播放下一首歌。
你可能不打算并行地播放音 乐 ，但你可能想在播放音 乐时显 示描述 该 音 乐 作品的文本：
<par>
<audio src="mySong.rm"/>
<textstream src="songDesc.rt"/>
</par>
注意 rt 和 rm 扩 展。 这 些是 RealMedia 格式 .
SMIL 的一个有趣方面是，媒体内容的 类 型不是得自元素名，而是来自服 务 器，操作系 统 或元素的 type 属性，后者定 义
MIME 类 型
如果你希望在文档中引用 SMIL DTD 代 码应 是 这样 的 :
<!DOCTYPE smil PUBLIC "-//W3C//DTD SMIL 1.0//EN"
" http://www.w3.org/TR/REC-smil/SMIL10.dtd ">
不 过 ，注意 SMIL 不允 许 你利用 实 体 说 明 扩 展 DTD 。
以下几 节 介 绍 SMIL 元素，它 们 的属性，它 们 可能的内容及它 们 的父代元素。本教程末尾，你将找到一个完事的 SMIL 文档 .
a
a 元素是一个 链 接，它 对 同 步 化不起任何作用，只是 链 接其他 资 源的一 种 手段而已。 该 元素就像 HTML a 元素一 样 ，主要是因 为
属性表包含 show 属性，它描述 a 元素所指向 资 源的不同替 换 模式。另一个区 别 是不使用它 链 接文本 ( 因 为 文本是一 种 媒体源 ) 。确
实 ，你把媒体源 隐 藏在 标 注中，如例子所示。
属性
id 惟一地确定文档内的元素。其 值 是XML 标识 符和ID属性 类 型
href 一个包含 链 接目的地URI的必不可少的属性
show 控制 链 接在三 种 可能模式之 间 的 链 接活 动 ：replace(意思是当前表示由被 链 接 对 象替代),new(意思是被 链 接 对 象作 为 新
对 象 开 始)和pause(意思是包含 链 接的表示 暂 停，被 链 接 对 象在一个新 环 境下 开 始被 链 接的表示完成播放后，被 暂 停的表示
重新 开 始)
内容
animation,audio,img,par,ref,seq,switch,text,textstream和video元素
父代元素 body,par,seq和switch元素
例:
在本例中， 链 接作 为 推 进 到文档另一部分的一 种 手段。 关 于 链 接如何在一个完整文档中 动 作的例子， 见 程序清 单 ，在 该 程序清 单 中
a 元素将幻灯片放映从一幡幻灯片推 进 到另一幅。它是 这样实现 的：借助指向文件 (pictures.smi, 在本例中，恰好是包含 链 接的同一文件 ) 的
链 接，然后利用一个 标识 符 (#) 引用 该 文件内的一个特定元素，在本例中，是 id 属性 值为 slide1 的一个 par 元素
<a href="pictures.smil#slide1" show="replace">
<img id="NavRintro" region="RButtonRegion" src="rArrow.jpg" repeat="1" fill="remove"/>
</a>
a 元素是一个 链 接，它 对 同 步 化不起任何作用，只是 链 接其他 资 源的一 种 手段而已。 该 元素就像 HTML a 元素一 样 ，主要是因 为
属性表包含 show 属性，它描述 a 元素所指向 资 源的不同替 换 模式。另一个区 别 是不使用它 链 接文本 ( 因 为 文本是一 种 媒体源 ) 。确
实 ，你把媒体源 隐 藏在 标 注中，如例子所示。
属性
id 惟一地确定文档内的元素。其 值 是XML 标识 符和ID属性 类 型
href 一个包含 链 接目的地URI的必不可少的属性
show 控制 链 接在三 种 可能模式之 间 的 链 接活 动 ：replace(意思是当前表示由被 链 接 对 象替代),new(意思是被 链 接 对 象作 为 新
对 象 开 始)和pause(意思是包含 链 接的表示 暂 停，被 链 接 对 象在一个新 环 境下 开 始被 链 接的表示完成播放后，被 暂 停的表示
重新 开 始)
内容
animation,audio,img,par,ref,seq,switch,text,textstream和video元素
父代元素 body,par,seq和switch元素
例:
在本例中， 链 接作 为 推 进 到文档另一部分的一 种 手段。 关 于 链 接如何在一个完整文档中 动 作的例子， 见 程序清 单 ，在 该 程序清 单 中
a 元素将幻灯片放映从一幡幻灯片推 进 到另一幅。它是 这样实现 的：借助指向文件 (pictures.smi, 在本例中，恰好是包含 链 接的同一文件 ) 的
链 接，然后利用一个 标识 符 (#) 引用 该 文件内的一个特定元素，在本例中，是 id 属性 值为 slide1 的一个 par 元素
<a href="pictures.smil#slide1" show="replace">
<img id="NavRintro" region="RButtonRegion" src="rArrow.jpg" repeat="1" fill="remove"/>
</a>
anchor
此元素使你 链 接一个元素的各部分， 类 似于 HTML 中使用 图 像 变 址 图 的方式。 该 元素的 关键 是 coords 属性，它定 义链 接所指部分的坐 标 集。
属性
begin 指定元素 开 始状 态 的 时间 ，借助两个可能 值 ：delay-value( 该值 度量表示 时间 ) 和event-value( 这 是一个事件触 发 器)
coords 指定一个 对 象 显 示区内的矩形坐 标 集
end 指出元素的明确 结 束(使用与 开 始元素相同的 值 )
id 惟一确定文档内的元素.它的 值 是一个XML 标识 符和一个ID属性 类 型
show 控制 链 接在三 种 可能模式之 间 的 链 接活 动 ：replace(意思是当前表示由被 链 接 对 象替代),new(意思是被 链 接 对 象作 为 新
对 象 开 始)和pause(意思是包含 链 接的表示 暂 停，被 链 接 对 象在一个新 环 境下 开 始被 链 接的表示完成播放后，被 暂 停的表示
重新 开 始)
skip-content 用于管理未来SMIL版本元素，借助两个 值 ：true或false.如果是true, 则 忽略 该 元素.
title 一个属性，用于以某 种 意 义 的方式命名一个元素， 该 元素可能被播放器以某 种 方式 显 示
内容
这 是一个空元素
父代元素
animation,audio,img,ref,text,textstream和video元素周期律
例：
本例 创 建一个 视频 内的 图 像映射 图 。活 动链 接区由coords属性指定的坐 标 定 义
<video src="myVideo.rm" region="RegionId">
<anchor href="http://www.javertising.com" show="pause" coords="10,30,70,100" begin="5s" end="30s"/>
</video>
此元素使你 链 接一个元素的各部分， 类 似于 HTML 中使用 图 像 变 址 图 的方式。 该 元素的 关键 是 coords 属性，它定 义链 接所指部分的坐 标 集。
属性
begin 指定元素 开 始状 态 的 时间 ，借助两个可能 值 ：delay-value( 该值 度量表示 时间 ) 和event-value( 这 是一个事件触 发 器)
coords 指定一个 对 象 显 示区内的矩形坐 标 集
end 指出元素的明确 结 束(使用与 开 始元素相同的 值 )
id 惟一确定文档内的元素.它的 值 是一个XML 标识 符和一个ID属性 类 型
show 控制 链 接在三 种 可能模式之 间 的 链 接活 动 ：replace(意思是当前表示由被 链 接 对 象替代),new(意思是被 链 接 对 象作 为 新
对 象 开 始)和pause(意思是包含 链 接的表示 暂 停，被 链 接 对 象在一个新 环 境下 开 始被 链 接的表示完成播放后，被 暂 停的表示
重新 开 始)
skip-content 用于管理未来SMIL版本元素，借助两个 值 ：true或false.如果是true, 则 忽略 该 元素.
title 一个属性，用于以某 种 意 义 的方式命名一个元素， 该 元素可能被播放器以某 种 方式 显 示
内容
这 是一个空元素
父代元素
animation,audio,img,ref,text,textstream和video元素周期律
例：
本例 创 建一个 视频 内的 图 像映射 图 。活 动链 接区由coords属性指定的坐 标 定 义
<video src="myVideo.rm" region="RegionId">
<anchor href="http://www.javertising.com" show="pause" coords="10,30,70,100" begin="5s" end="30s"/>
</video>
animation
这 是一个定 义动 画的 连续 媒体元素，与其他媒体元素一 样 ，媒体播放器不是通 过 元素名是借助元素的属性 ( 如 type 属性 , 它
给 媒体播放器提供元素的 MIME 类 型 ) 提供的信息来 检 索 关 于元素及如何播放它的信息。
属性
abstract 顾 名思 义 ， 该 属性提供元素内容的 简 要描述
alt 指出媒体播放器存取内容不支持 该 元素 时 的替代文本
author 表示内容的作者名
begin 见 anchor 元素属性表
clip-begin 指出子剪 贴 画的 开 始，利用下述 值 的一个， 这 些 值 均由 这种语 法定 义 :
clip-beign="npt=0.1h", 度量 单 位及其相 关值 是：
smpte="YourTime"或smpte-30-drop="YourTime"或smpte-25="YourTime",其中YourTime等于由 时 ，分和秒表示的 时间
如:clip-begin="smpte=10:12:33:20".SMPTE是 电 影 电视 工程 师协 会 开发 的一 种时间标 准
npt(正常播放 时间 ), 以常 规 SMIL 时钟值 表达的 时间
clip-end 指出子剪 贴 画的 结 束，利用与clip-begin相同的 值 。 如果其 值 超出媒体 对 象的持 续时间 ， 则 忽略 该值
copyright 包含元素内容的版 权 声明
dur 指出一个元素的持 续时间
end 见 anchor 元素属性表
fill 控制子元素的持 续时间 ，借助两个 值 ： remove 和 freeze. 其 细节 取决于在那里使用什 么 元素
id 惟一确定文档内的元素。它的 值 是个 XML 标识 符和一个 ID 属性 类 型
longdesc 包含指向一个媒体 对 象的冗 长 的描述的 URI
src 指定媒体 对 象的 URI
system-bitrate 规 定近似 带宽 ，以 每 秒位 为单 位 ( 例如，如果 预 期用 户 机器上使用 56K MODEM ， 则 属性 值对应 是 :system-birate="56000")
system-cpations 就像 on 或 off 属性 值 指示的那 样 控制字幕 选项
system-language 逗号分界的 语 言列表，由 RFC1766 或代 码 定 义 ( 例如 ,system-language="ja" 表示系 统语 言是日 语 )
system-overdub-or-caption 借助两个 值 overdub 或 caption 中的一个确定使用配音 还 是字幕 .
system-required 指出 扩 展名
system-screen-size 利用如下所示属性 值对 指出屏幕大小:system-screen-size="1024X768"
system-scrren-depth 提供 显 示元素 时 需要的屏幕 调 色板深度的信息，以位 为单 位，一般使用下述 值 之一：1,8,16,24或32，指派32深度
title 提供 为 元素 赋 予有意 义 名字的一条行径
type src属性引用的媒体 对 象的MIME 类 型
这 是一个定 义动 画的 连续 媒体元素，与其他媒体元素一 样 ，媒体播放器不是通 过 元素名是借助元素的属性 ( 如 type 属性 , 它
给 媒体播放器提供元素的 MIME 类 型 ) 提供的信息来 检 索 关 于元素及如何播放它的信息。
属性
abstract 顾 名思 义 ， 该 属性提供元素内容的 简 要描述
alt 指出媒体播放器存取内容不支持 该 元素 时 的替代文本
author 表示内容的作者名
begin 见 anchor 元素属性表
clip-begin 指出子剪 贴 画的 开 始，利用下述 值 的一个， 这 些 值 均由 这种语 法定 义 :
clip-beign="npt=0.1h", 度量 单 位及其相 关值 是：
smpte="YourTime"或smpte-30-drop="YourTime"或smpte-25="YourTime",其中YourTime等于由 时 ，分和秒表示的 时间
如:clip-begin="smpte=10:12:33:20".SMPTE是 电 影 电视 工程 师协 会 开发 的一 种时间标 准
npt(正常播放 时间 ), 以常 规 SMIL 时钟值 表达的 时间
clip-end 指出子剪 贴 画的 结 束，利用与clip-begin相同的 值 。 如果其 值 超出媒体 对 象的持 续时间 ， 则 忽略 该值
copyright 包含元素内容的版 权 声明
dur 指出一个元素的持 续时间
end 见 anchor 元素属性表
fill 控制子元素的持 续时间 ，借助两个 值 ： remove 和 freeze. 其 细节 取决于在那里使用什 么 元素
id 惟一确定文档内的元素。它的 值 是个 XML 标识 符和一个 ID 属性 类 型
longdesc 包含指向一个媒体 对 象的冗 长 的描述的 URI
src 指定媒体 对 象的 URI
system-bitrate 规 定近似 带宽 ，以 每 秒位 为单 位 ( 例如，如果 预 期用 户 机器上使用 56K MODEM ， 则 属性 值对应 是 :system-birate="56000")
system-cpations 就像 on 或 off 属性 值 指示的那 样 控制字幕 选项
system-language 逗号分界的 语 言列表，由 RFC1766 或代 码 定 义 ( 例如 ,system-language="ja" 表示系 统语 言是日 语 )
system-overdub-or-caption 借助两个 值 overdub 或 caption 中的一个确定使用配音 还 是字幕 .
system-required 指出 扩 展名
system-screen-size 利用如下所示属性 值对 指出屏幕大小:system-screen-size="1024X768"
system-scrren-depth 提供 显 示元素 时 需要的屏幕 调 色板深度的信息，以位 为单 位，一般使用下述 值 之一：1,8,16,24或32，指派32深度
title 提供 为 元素 赋 予有意 义 名字的一条行径
type src属性引用的媒体 对 象的MIME 类 型
内容
anchor 元素
父代元素
a,body,par,seq和switch元素(最后一个元素 对 控制屏幕深度和大小特 别 重要)
<smil>
<body>
<par>
<animation src="rstp://realserver.javertising.com:554/media.swf"/>
</par>
</body>
</smil>
anchor 元素
父代元素
a,body,par,seq和switch元素(最后一个元素 对 控制屏幕深度和大小特 别 重要)
<smil>
<body>
<par>
<animation src="rstp://realserver.javertising.com:554/media.swf"/>
</par>
</body>
</smil>
2
、
时间
控制
（ 1 ） dur 属性
请 大家看看下面 这 段代 码 的效果。
< smil>
< head>
< /head>
< body>
< seq>
< img src="image1.jpg" dur="5s"/>
< img src="image2.jpg" dur="10s"/ >
< /seq>
< /body>
< /smil>
相信大家已 经 看出 门 道了！ 对 了，我 们这 里 对 image1.jpg 和image2.jpg的持 续时间 做了 规 定。 其中 image1.jpg 持 续时间 5 秒， image2.jpg 持 续时间 10 秒。
（ 2 ） begin 和 end 属性
上面 规 定的是播放多 长时间 ，我 们 也想 规 定在什 么时 候 开 始播放。 请 看下面的程序。
< smil>
< head>
< /head>
< body>
< img src="image1.jpg" begin="2" dur="5s"/>
< /body>
< /smil>
上面的 这 段程序 规 定就是 图 片 image1.jpg 在整个演示 进 行 2 秒后， 开 始 显 示，持 续 的 时间 是 5 秒。 对 于 图 片的控制是 这样 ，而我 们 常常需要 对视频 / 音 频 的 时间进 行控制。下面 这 个例子来 说 明 这 个 问题 。
< smil>
< head>
< /head>
< body>
< video src="test.rm" begin="5s" end="40s"/>
< /body>
< /smil>
test.rm 这 个 视频 文件（如果大家手 头 上没有 *.rm 格式文件，就用 Realone player 的 firstrun.rm 或者找个 *.avi 的也可以。但是文件名要写 对 ！）在整个演示 开 始 5 秒后 开 始播放，在整个演示播放 40 秒以后，就 结 束播放。 实际 的播放 时间 是： 40-5=35 秒。但是，一般情形下，我 们 的 视频总 在一个 组 中， 这时 候，他就的服从 组 的 时间 了。我 们 那下面的 这 个例子来解 释这问题 。
< smil>
< body>
< seq dur="5">
< img src="image1.jpg" begin="2" dur="10"/>
< /seq>
< /body>
< /smil>
image1.jpg 所在的 组 的持 续时间为 5 秒，而 image1.jpg 自己要求持 续 10 秒， 这 是不行的。 实际 上 image1.jpg 的 显 示 时间 只有 5-2=3 秒！大家在以后写程序的 时 候要注意 这 个 问题 。
（3）clip-begin和clip-end属性
考 虑这样 一 种 效果：
我 们 只要test.rm播放 这 个 视频 / 音 频 的5~10秒 这 个 时间 断，怎 么办 ？？？J有了clip-begin和clip-end， 问题 就很 简单 了！
请 看：
< smil>
< body>
< video src="test.rm" clip-begin="5s" clip-end="10s"/>
< /body>
< /smil>
clip-begin和clip-end属性是用内部 时间 控制的属性。 这 里的内部指的就是多媒体片断自己的 时间线 （ timeline ）。前者 规 定在什 么 地方 开 始播放，后者 规 定放到什 么 地方 结 束播放。 为 了更清楚的理解 这 些 时间 控制，我 们 看下面的 这 个例子：
< smil>
< body>
< par>
< audio src="testone.rm" clip-begin="5" dur="10s"/>
< audio src="testtwo.rm" begin="7s" clip-begin="2s"clip-end="15s"/>
< /par>
< /body>
< /smil>
看看下面 这 个示意 图 ：
显 然，首先是 testone.rm 从自己的 5 秒 处开 始播放，播放 7 秒以后， testtwo.rm 从自己的 2 秒 处开 始与 testone.rm 一起播放， testone.rm 播放到自己得 15 秒 处 停止播放， testone.rm 播放了 15-5=10 秒。 testtwo.rm 播放到自己得 15 秒 处 停止播放， testone.rm 播放了 15-2=13 秒。 图 中灰色（黄色）部分表示播放的部分。
接下来我 们对时间 的表示方法做个 说 明（默 认 的 时间 是秒，所以 "2s" 、 "2.0s" 和 "2" 都是一 样 的 ）：
时间标记 指代 例子 说 明
h 小 时 1.5h 1 小 时 30 分 钟
min 分 钟 4.75min 4 分 45 秒
s 秒 10.45 10 秒 450 毫秒
正确的 时间 写法是： hh:mm:ss.xy 。 hh 表示小 时 ； mm 表示分 钟 ； ss 表示秒； x 表示 1/10 秒； y 表示 1/100 秒。例如： begin="01:40.0" 表示的是 1 分 40 秒 处开 始，而 begin="01:40" 表示的是 1 小 时 40 分 处开 始。真的注意呀 J 。
时间 控制非常重要，它直接影响我 们 演示的效果。而我 们 上面 讲 的 这 部分是最重要的，所以大家一定要理解上面的各个 时间 概念及其含 义 。
（ 4 ） fill 属性
当演示中的某个片断播放完成以后，我 们 可以用 fill 属性来 规 定它的 显 示状 态 。 简单 的 说 就是我 们 是清屏 还 是 冻结 屏幕。看下面 这 个例子：
< smil>
< body>
< video src="test.rm" dur="30s" fill="freeze"/>
< /body>
< /smil>
假 设 test.rm 的 长 度是 20 秒，那 么 我 们这 里 规 定的就是：在 test.rm 播放 终 了以后，屏幕上 显 示的是 test.rm 的最后一 帧 （通俗的 说 就是最后一幅画面）， 显 示的 时间 是 30-20=10 秒；如果是 图 片的 话 ，那 么显 示就是 图 片。
Fill 属性只有 remove 和 freeze 两个，默 认 的 值为 remove 。建 议 大家在演示的最后的一个多媒体片断上用 冻结 （ freeze ），以防止屏幕上空空如也！ J
（ 5 ） repeat 属性
如果我 们 希望我 们 演示中的某个片断或者全部的片断重 复 播放若干次（姑且 设为 2 次）。那 么 我 们 可以后用 repeat 属性来 实现该 效果。分析下面 这 个例子：
< smil>
< body>
< vedio src="test.rm" dur="1min" repeat="2"/>
< /body>
< /smil>
上面 这 个例子就是 让 test.rm 播放两次。如果我 们 想 让 某个片断一直播放下去（网 络 光广告上可以考 虑这 个），那 么 repeat="indefinite" 就可以了。当然，想要它停下来的一 种 方法是按下播放器 stop （停止） 键 （在网 页 插件中就是右 键 菜 单 中的 stop ）；另外的一 种办 法 ( 大家都知道的 ) 是 关闭计 算机！
4 、 链 接制作
传统 的流媒体的最大的一个弊端是没有交互性（ Interaction ）。 现 在如日中天的 flash 本 质 上就是一 种 可交互性的流！由此可 见 可交互性的流的市 场 潜力。而 SMIL 是解决大部分流媒体交互性的最好的工具！ 这 部分要求大家必 须 掌握，如果没有的 话 ，那 么 我 们 学 习 SMIL 就失去了意 义 。因 为这 里是 SMIL 的主要特色（与其他的 视频编辑软 件相比 较 ），就好像指 针 是 C 语 言的特色一 样 。
（1）< a>< /a> 标记
运行下面 这 个程序：
< smil>
< head>
< layout>
< root-layout width="300" height="300"/>
< region id="videoregion" top="0" left="0" width="300" height="300"/>
< layout>
< /head>
< body>
< a href="1.rm">
< video src="videotest.rm" region="videoregion"/>
< /a>
< /body>
< /smil>
正常情况下，我 们 看到播放器播放videotest.rm，如果我 们 把鼠 标 放到正在播放的videotest.rm上面，鼠 标 将有指 针 形状 变为 小手形状。 单击 鼠 标 左 键 ，播放器播放将停止播放 videotest.rm 而播放 1.rm 这 个文件。 这 里我 们 就成功的 创 建了一个很 简单 的 链 接。 <a></a> 属性就是用于 链 接 标记 ， href 表示的是所要 链 接的文件。 这种 方法非常 简单 ，我 们 就不做 过 多的介 绍 。
如果我 们 要 创 建更加 复杂 的 链 接，我 们 就要用到下面的 这 个属性。
（2）< anchor>属性
将上例中的< body>< /body> 换 成下面 这 段代 码 ，看看效果是不是有区 别 ？
< body>
< video src="videotest.rm" region="videoregion">
< anchor href="1.rm"/>
< /video>
< /body>
我 们 看到的效果是完全一 样 的！那 么 <anchor> 属性不就多余了 吗 ？ 那是不会的！JJ 请 看：
a、 分 时 断 链 接
考 虑这样 一个 问题 ：我 们 要在0~10秒 链 到一个文件，10~20秒 链 到另一个文件， 该 怎 么办 ？看我 们 的：
< body>
< video src="1.avi" region="videoregion">
< anchor href="1.jpg" begin="0s" end="10s" >
< anchor href="videotest.rm" begin="10s" end="20s" />
< /video>
大家将看到的效果：播放器播放1.avi，在0~10秒 链 到1.jpg，在10~20秒 链 到videotest.rm。警告：dur、clip-begin和clip-end 这 里不支持！
B、 链 接部分SMIL
我 们 的 链 接可以 链 接的文件很多，几乎所用的多媒体片断都可以。*.smil和*.html也可以。 但是，下面我 们 要 讨论 的是如何 链 接部分 SMIL 。 请 看例子。
第一个 SMIL 文件，取名 test11.smil
< smil>
< head>
< layout>
< root-layout width="400" height="300"/>
< region id="videoregion" top="0" left="0" width="400" height="300" fit="meet"/>
< /layout>
< /head>
< body>
< video src="1.avi" region="videoregion">
< anchor href="test11app.smil#testlink"/>
< /video>
< /body>
< /smil>
第一个 SMIL 文件，取名 test11app.smil
< smil>
< head>
< layout>
< root-layout width="400" height="300"/>
< region id="videoregion" top="0" left="0" width="400" height="300" fit="meet"/>
< /layout>
< /head>
< body>
< video id="testlink" src="1.avi" clip-begin="150" region="videoregion"/>
< /body>
< /smil>
大家一定看出来了！我就是在 test11app.smil 中 为 我 们 要 链 接的那部分内容 设 上 id, 然后在 test11.smil 中的 链 接中用 “#” 来指向 该标记 id 。 应 用的很多的 时 候是 组 内内容。我 们 把 test11app.smil 修改 为 ：
< body>
< par id="testlink">
< video src="1.avi" clip-begin="150" region="videoregion"/>
< /par>
< /body>
到 这 里， 链 接可以 说 已 经 很完美了。但是，如果要 锦 上添花，那 么 下面 这 个属性是必不可少的。
（3）coords属性
将上面的<anchor href="1.rm"/>代 码 修改 为 ：
< anchor href="1.rm" coords="0， 0，150，300"/>
或者：
< anchor href="1.rm" coords="0％， 0％，50％，100％"/>
运行，看看效果。 JJ 我 们 看到左半部分有 链 接效果，而右半部分却没有！ 这 是我 们 采用了坐 标规 定 链 接区的 缘 故。 coords 属性 值 的第一、二个数分 别 表示的是 链 接区的左上角点的水平（ left ）和垂直 (top) 坐 标 ; 第三、四个数分 别 表示的是 链 接区的右下角点的水平（ left ）和垂直 (top) 坐 标 。上面用的是像素点的 绝对 定 义 方法，下面用的是比例的相 对 定 义 方法。喜 欢 哪一个就看你的喜好了。
（ 5 ） 链 接注意
我 们 的演示最后基本上都要放到服 务 器上。因此，文件的位置的 规 定就非常重要，如果文件位置出 错 ，那 么 播放器将找不到文件而不能播放。 这 是我 们 最不希望看到的！下面我 们 就来 讨论这 个 问题 。
A 、 创 建基地址
看下面的代 码 ：
< head>
< meta name="base" content="rtsp://abc.5dmedia.com/"/>
< /head>
上面就是在< head>< /head>中用附加信息的方式 规 定了整个smil文件的基地址 为 rtsp://abc.5dmedia.com/ 。 规 定了基地址以后，我 们 在用 该 地址下的文件的 时 候，就只需要 给 出路径就可以了。例如：
< body>
< video src="video/first.rm"/>
< video src=" video /second.rm"/>
< audio src="rtsp:// abc.mysite.com:554/audio/test.mp3"/>
< img src="http// www.5dmedia.com/image/welcome.jpg"/ >
< /body>
这 个例子中的前面的两个文件用的是基地址服 务 器上的文件，所以，可以之写出相 对 地址。但是，后面的两个文件用的是其他服 务 器上的文件，我 们 必 须给 出 绝对 地址。其中 rtsp 是 实时 流 传输协议 ，它保 证 SMIL 播放器正确地从流服 务 器 abc.mysite.com 上的 audio 文件 夹 下 获 得我的所要的文件 test.mp3 。 554 为 流服 务 器的端口。 http 是超文本 传输协议 。它保 证 SMIL 播放器正确地从 web 服 务 器 www.5dmedia.com 上的 image 文件 夹 下 获 得我的所要的文件 welcome.jpg 。 < audio src="rtsp:// abc.mysite.com:554/audio/test.mp3"/> 说 明的是 该 文件不在上面的基地址下，而在 rtsp:// abc.mysite.com:554/audio/ 这 个地方法，所我 们 必 须 修改地址。
如果我 们 用的是本地机器硬 盘 上的文件就可以用src="file:/c:/audio/first.rm" 进 行 读 取 该 文件。
大家在 调 用文件之前，一定要弄清楚文件的位置！
（ 1 ） dur 属性
请 大家看看下面 这 段代 码 的效果。
< smil>
< head>
< /head>
< body>
< seq>
< img src="image1.jpg" dur="5s"/>
< img src="image2.jpg" dur="10s"/ >
< /seq>
< /body>
< /smil>
相信大家已 经 看出 门 道了！ 对 了，我 们这 里 对 image1.jpg 和image2.jpg的持 续时间 做了 规 定。 其中 image1.jpg 持 续时间 5 秒， image2.jpg 持 续时间 10 秒。
（ 2 ） begin 和 end 属性
上面 规 定的是播放多 长时间 ，我 们 也想 规 定在什 么时 候 开 始播放。 请 看下面的程序。
< smil>
< head>
< /head>
< body>
< img src="image1.jpg" begin="2" dur="5s"/>
< /body>
< /smil>
上面的 这 段程序 规 定就是 图 片 image1.jpg 在整个演示 进 行 2 秒后， 开 始 显 示，持 续 的 时间 是 5 秒。 对 于 图 片的控制是 这样 ，而我 们 常常需要 对视频 / 音 频 的 时间进 行控制。下面 这 个例子来 说 明 这 个 问题 。
< smil>
< head>
< /head>
< body>
< video src="test.rm" begin="5s" end="40s"/>
< /body>
< /smil>
test.rm 这 个 视频 文件（如果大家手 头 上没有 *.rm 格式文件，就用 Realone player 的 firstrun.rm 或者找个 *.avi 的也可以。但是文件名要写 对 ！）在整个演示 开 始 5 秒后 开 始播放，在整个演示播放 40 秒以后，就 结 束播放。 实际 的播放 时间 是： 40-5=35 秒。但是，一般情形下，我 们 的 视频总 在一个 组 中， 这时 候，他就的服从 组 的 时间 了。我 们 那下面的 这 个例子来解 释这问题 。
< smil>
< body>
< seq dur="5">
< img src="image1.jpg" begin="2" dur="10"/>
< /seq>
< /body>
< /smil>
image1.jpg 所在的 组 的持 续时间为 5 秒，而 image1.jpg 自己要求持 续 10 秒， 这 是不行的。 实际 上 image1.jpg 的 显 示 时间 只有 5-2=3 秒！大家在以后写程序的 时 候要注意 这 个 问题 。
（3）clip-begin和clip-end属性
考 虑这样 一 种 效果：
我 们 只要test.rm播放 这 个 视频 / 音 频 的5~10秒 这 个 时间 断，怎 么办 ？？？J有了clip-begin和clip-end， 问题 就很 简单 了！
请 看：
< smil>
< body>
< video src="test.rm" clip-begin="5s" clip-end="10s"/>
< /body>
< /smil>
clip-begin和clip-end属性是用内部 时间 控制的属性。 这 里的内部指的就是多媒体片断自己的 时间线 （ timeline ）。前者 规 定在什 么 地方 开 始播放，后者 规 定放到什 么 地方 结 束播放。 为 了更清楚的理解 这 些 时间 控制，我 们 看下面的 这 个例子：
< smil>
< body>
< par>
< audio src="testone.rm" clip-begin="5" dur="10s"/>
< audio src="testtwo.rm" begin="7s" clip-begin="2s"clip-end="15s"/>
< /par>
< /body>
< /smil>
看看下面 这 个示意 图 ：
显 然，首先是 testone.rm 从自己的 5 秒 处开 始播放，播放 7 秒以后， testtwo.rm 从自己的 2 秒 处开 始与 testone.rm 一起播放， testone.rm 播放到自己得 15 秒 处 停止播放， testone.rm 播放了 15-5=10 秒。 testtwo.rm 播放到自己得 15 秒 处 停止播放， testone.rm 播放了 15-2=13 秒。 图 中灰色（黄色）部分表示播放的部分。
接下来我 们对时间 的表示方法做个 说 明（默 认 的 时间 是秒，所以 "2s" 、 "2.0s" 和 "2" 都是一 样 的 ）：
时间标记 指代 例子 说 明
h 小 时 1.5h 1 小 时 30 分 钟
min 分 钟 4.75min 4 分 45 秒
s 秒 10.45 10 秒 450 毫秒
正确的 时间 写法是： hh:mm:ss.xy 。 hh 表示小 时 ； mm 表示分 钟 ； ss 表示秒； x 表示 1/10 秒； y 表示 1/100 秒。例如： begin="01:40.0" 表示的是 1 分 40 秒 处开 始，而 begin="01:40" 表示的是 1 小 时 40 分 处开 始。真的注意呀 J 。
时间 控制非常重要，它直接影响我 们 演示的效果。而我 们 上面 讲 的 这 部分是最重要的，所以大家一定要理解上面的各个 时间 概念及其含 义 。
（ 4 ） fill 属性
当演示中的某个片断播放完成以后，我 们 可以用 fill 属性来 规 定它的 显 示状 态 。 简单 的 说 就是我 们 是清屏 还 是 冻结 屏幕。看下面 这 个例子：
< smil>
< body>
< video src="test.rm" dur="30s" fill="freeze"/>
< /body>
< /smil>
假 设 test.rm 的 长 度是 20 秒，那 么 我 们这 里 规 定的就是：在 test.rm 播放 终 了以后，屏幕上 显 示的是 test.rm 的最后一 帧 （通俗的 说 就是最后一幅画面）， 显 示的 时间 是 30-20=10 秒；如果是 图 片的 话 ，那 么显 示就是 图 片。
Fill 属性只有 remove 和 freeze 两个，默 认 的 值为 remove 。建 议 大家在演示的最后的一个多媒体片断上用 冻结 （ freeze ），以防止屏幕上空空如也！ J
（ 5 ） repeat 属性
如果我 们 希望我 们 演示中的某个片断或者全部的片断重 复 播放若干次（姑且 设为 2 次）。那 么 我 们 可以后用 repeat 属性来 实现该 效果。分析下面 这 个例子：
< smil>
< body>
< vedio src="test.rm" dur="1min" repeat="2"/>
< /body>
< /smil>
上面 这 个例子就是 让 test.rm 播放两次。如果我 们 想 让 某个片断一直播放下去（网 络 光广告上可以考 虑这 个），那 么 repeat="indefinite" 就可以了。当然，想要它停下来的一 种 方法是按下播放器 stop （停止） 键 （在网 页 插件中就是右 键 菜 单 中的 stop ）；另外的一 种办 法 ( 大家都知道的 ) 是 关闭计 算机！
4 、 链 接制作
传统 的流媒体的最大的一个弊端是没有交互性（ Interaction ）。 现 在如日中天的 flash 本 质 上就是一 种 可交互性的流！由此可 见 可交互性的流的市 场 潜力。而 SMIL 是解决大部分流媒体交互性的最好的工具！ 这 部分要求大家必 须 掌握，如果没有的 话 ，那 么 我 们 学 习 SMIL 就失去了意 义 。因 为这 里是 SMIL 的主要特色（与其他的 视频编辑软 件相比 较 ），就好像指 针 是 C 语 言的特色一 样 。
（1）< a>< /a> 标记
运行下面 这 个程序：
< smil>
< head>
< layout>
< root-layout width="300" height="300"/>
< region id="videoregion" top="0" left="0" width="300" height="300"/>
< layout>
< /head>
< body>
< a href="1.rm">
< video src="videotest.rm" region="videoregion"/>
< /a>
< /body>
< /smil>
正常情况下，我 们 看到播放器播放videotest.rm，如果我 们 把鼠 标 放到正在播放的videotest.rm上面，鼠 标 将有指 针 形状 变为 小手形状。 单击 鼠 标 左 键 ，播放器播放将停止播放 videotest.rm 而播放 1.rm 这 个文件。 这 里我 们 就成功的 创 建了一个很 简单 的 链 接。 <a></a> 属性就是用于 链 接 标记 ， href 表示的是所要 链 接的文件。 这种 方法非常 简单 ，我 们 就不做 过 多的介 绍 。
如果我 们 要 创 建更加 复杂 的 链 接，我 们 就要用到下面的 这 个属性。
（2）< anchor>属性
将上例中的< body>< /body> 换 成下面 这 段代 码 ，看看效果是不是有区 别 ？
< body>
< video src="videotest.rm" region="videoregion">
< anchor href="1.rm"/>
< /video>
< /body>
我 们 看到的效果是完全一 样 的！那 么 <anchor> 属性不就多余了 吗 ？ 那是不会的！JJ 请 看：
a、 分 时 断 链 接
考 虑这样 一个 问题 ：我 们 要在0~10秒 链 到一个文件，10~20秒 链 到另一个文件， 该 怎 么办 ？看我 们 的：
< body>
< video src="1.avi" region="videoregion">
< anchor href="1.jpg" begin="0s" end="10s" >
< anchor href="videotest.rm" begin="10s" end="20s" />
< /video>
大家将看到的效果：播放器播放1.avi，在0~10秒 链 到1.jpg，在10~20秒 链 到videotest.rm。警告：dur、clip-begin和clip-end 这 里不支持！
B、 链 接部分SMIL
我 们 的 链 接可以 链 接的文件很多，几乎所用的多媒体片断都可以。*.smil和*.html也可以。 但是，下面我 们 要 讨论 的是如何 链 接部分 SMIL 。 请 看例子。
第一个 SMIL 文件，取名 test11.smil
< smil>
< head>
< layout>
< root-layout width="400" height="300"/>
< region id="videoregion" top="0" left="0" width="400" height="300" fit="meet"/>
< /layout>
< /head>
< body>
< video src="1.avi" region="videoregion">
< anchor href="test11app.smil#testlink"/>
< /video>
< /body>
< /smil>
第一个 SMIL 文件，取名 test11app.smil
< smil>
< head>
< layout>
< root-layout width="400" height="300"/>
< region id="videoregion" top="0" left="0" width="400" height="300" fit="meet"/>
< /layout>
< /head>
< body>
< video id="testlink" src="1.avi" clip-begin="150" region="videoregion"/>
< /body>
< /smil>
大家一定看出来了！我就是在 test11app.smil 中 为 我 们 要 链 接的那部分内容 设 上 id, 然后在 test11.smil 中的 链 接中用 “#” 来指向 该标记 id 。 应 用的很多的 时 候是 组 内内容。我 们 把 test11app.smil 修改 为 ：
< body>
< par id="testlink">
< video src="1.avi" clip-begin="150" region="videoregion"/>
< /par>
< /body>
到 这 里， 链 接可以 说 已 经 很完美了。但是，如果要 锦 上添花，那 么 下面 这 个属性是必不可少的。
（3）coords属性
将上面的<anchor href="1.rm"/>代 码 修改 为 ：
< anchor href="1.rm" coords="0， 0，150，300"/>
或者：
< anchor href="1.rm" coords="0％， 0％，50％，100％"/>
运行，看看效果。 JJ 我 们 看到左半部分有 链 接效果，而右半部分却没有！ 这 是我 们 采用了坐 标规 定 链 接区的 缘 故。 coords 属性 值 的第一、二个数分 别 表示的是 链 接区的左上角点的水平（ left ）和垂直 (top) 坐 标 ; 第三、四个数分 别 表示的是 链 接区的右下角点的水平（ left ）和垂直 (top) 坐 标 。上面用的是像素点的 绝对 定 义 方法，下面用的是比例的相 对 定 义 方法。喜 欢 哪一个就看你的喜好了。
（ 5 ） 链 接注意
我 们 的演示最后基本上都要放到服 务 器上。因此，文件的位置的 规 定就非常重要，如果文件位置出 错 ，那 么 播放器将找不到文件而不能播放。 这 是我 们 最不希望看到的！下面我 们 就来 讨论这 个 问题 。
A 、 创 建基地址
看下面的代 码 ：
< head>
< meta name="base" content="rtsp://abc.5dmedia.com/"/>
< /head>
上面就是在< head>< /head>中用附加信息的方式 规 定了整个smil文件的基地址 为 rtsp://abc.5dmedia.com/ 。 规 定了基地址以后，我 们 在用 该 地址下的文件的 时 候，就只需要 给 出路径就可以了。例如：
< body>
< video src="video/first.rm"/>
< video src=" video /second.rm"/>
< audio src="rtsp:// abc.mysite.com:554/audio/test.mp3"/>
< img src="http// www.5dmedia.com/image/welcome.jpg"/ >
< /body>
这 个例子中的前面的两个文件用的是基地址服 务 器上的文件，所以，可以之写出相 对 地址。但是，后面的两个文件用的是其他服 务 器上的文件，我 们 必 须给 出 绝对 地址。其中 rtsp 是 实时 流 传输协议 ，它保 证 SMIL 播放器正确地从流服 务 器 abc.mysite.com 上的 audio 文件 夹 下 获 得我的所要的文件 test.mp3 。 554 为 流服 务 器的端口。 http 是超文本 传输协议 。它保 证 SMIL 播放器正确地从 web 服 务 器 www.5dmedia.com 上的 image 文件 夹 下 获 得我的所要的文件 welcome.jpg 。 < audio src="rtsp:// abc.mysite.com:554/audio/test.mp3"/> 说 明的是 该 文件不在上面的基地址下，而在 rtsp:// abc.mysite.com:554/audio/ 这 个地方法，所我 们 必 须 修改地址。
如果我 们 用的是本地机器硬 盘 上的文件就可以用src="file:/c:/audio/first.rm" 进 行 读 取 该 文件。
大家在 调 用文件之前，一定要弄清楚文件的位置！
7
、
转场
效果
首先解
释
一下什
么
是
转场
效果。我
们
的演示中多媒体片断是很多的，不可避免的会有两个片断之
间
的切
换
。例如：一个
图
片演示完了，
该
接着演示下一个
图
片，两
图
片中
间
是有一个
过
渡的。
这
个
过
渡我
们
就称
谓转场
效果。如果我
们
不
设
置
转场
效果，那
么
，
过
渡的效果肯定不好。
LSMIL
中的
转场
效果大致分
为
wipe
和
fade
两
类
。
（１） fade 类 型
从名字就可以看出， 这 个是淡入淡出的效果。先睹 为 快！ J 请 看例子！
< smil xmlns=" http://www.w3.org/2001/SMIL20/Language ">
< head>
< transition id="fade1" type="fade" subtype="fadeToColor" dur="4s" />
< transition id="fade2" type="fade" subtype="fadeFromColor" dur="4s" />
< /head>
< body>
< img src="g04.jpg" dur="10s" transIn="fade2" transOut="fade1"/>
< /body>
</smil>
解 释 ： a 、 transition 声明我 们 要 设 置 转场 效果。 id="fade1" 设 置了 该转场 效果的 id 号。 id 号必 须设 置。 type="fade" 设 置了 转场 效果的基本 类 型 为 fade 。 subtype="fadeToColor" 设 置了 转场 效果的具体 类 型（子 类 型） 为 fadeToColor （注意 这 里又是我 们 提到的 骆驼 写法！）。 dur="4s" 设 置了 该场 效果完成的 时间 。
b 、transIn="fade2" 设 置了 图 片g04.jpg 显 示 时 采用 转场 效果fade2； transOut="fade1" 规 定 图 片g04.jpg完成 显 示 时 采用 转场 效果fade１。
c、fade只有三个子 类 型。 上面我 们 用了２个。 还 有一个是 crossfade ， 这 个也是缺省 设 置。
（２） wipe 类 型
wipe 为 擦去 类 型。 该类 型的效果很多很多。我 们这 里所 说 的 wipe 只是他 们 的 总 称（注意 wipe 不能作 为 type 的属性 值 ，而是它的子 类 作 为 type 的属性 值 ，子 类 的子 类 作 为 subtype 的属性 值 ！ J 谁让 它的属性 值这么 多！！！）。具体的有 barWipe 、 boxWipe 、 fourBoxWipe 等 36 大 类 !!! 不管它有多少 类 ，先看看怎 么 弄。 请 看例子：
< smil xmlns=" http://www.w3.org/2001/SMIL20/Language ">
< head>
< transition id="wipe1" type="slideWipe" subtype="fromTop"/>
< transition id="wipe2" type="waterfallWipe"/>
< /head>
< body>
< img src="g03.jpg" transIn="wipe1" transOut="wipe2" dur="5s"/>
< /body>
< /smil>
解 释 ： a 、 JJJ 和上面的写法基本上是一致的！
b 、 type="waterfallWipe" 后面没有子 类 型表示使用的是 waterfallWipe 类 型的默 认 子 类 型。
（３） 综 合 应 用
我 们 上面都只是用在 单 个多媒体片断上的 转场 效果。下面看看在多个多媒体片断上怎 样设 置 转场 效果。 还 得看例子： J
< smil xmlns=" http://www.w3.org/2001/SMIL20/Language ">
< head>
< layout>
< root-layout width="400" height="300"/>
< /layout>
< transition id="fade" type="fade" subtype="fadeToColor" fadeColor="green" dur="4s"/>
< transition id="fade1" type="fade" subtype="fadeFromColor" fadeColor="red" dur="4s"/>
< transition id="fade2" type="fade" subtype="crossfade" dur="2s"/>
< transition id="push" type="snakeWipe" dur="4" />
< /head>
< body>
< seq>
< img dur="5s" src="g06.jpg" transIn="fade1" fill="transition"/>
< img dur="4s" src="g05.jpg" transIn="fade2" fill="transition"/>
< img dur="4s" src="g06.jpg" transIn="fade2" fill="transition"/>
< img dur="4s" src="g05.jpg" transIn="push" transOut="fade"/>
< /seq>
< /body>
< /smil>
解 释 ： a 、 fadeColor="green" 设 置了 谈 出 谈 入色 为绿 色（ green ）。在 这 里表示的就是从当前的多媒体片断 渐变为绿 色。下面的 fadeColor="red" 则 表示从 红 色 渐变为 当前的多媒体片断（如果是 图 片 则变为图 片，如是 视频则变为 第一 帧 ）。
b 、fill="transition"表示的是最后的完成效果有下面的 转场 效果来决定。
c、最后一个就不能用fill="transition"了。想想，它就是最后一个了，上哪里去找下面的 转场 效果呢？
（１） fade 类 型
从名字就可以看出， 这 个是淡入淡出的效果。先睹 为 快！ J 请 看例子！
< smil xmlns=" http://www.w3.org/2001/SMIL20/Language ">
< head>
< transition id="fade1" type="fade" subtype="fadeToColor" dur="4s" />
< transition id="fade2" type="fade" subtype="fadeFromColor" dur="4s" />
< /head>
< body>
< img src="g04.jpg" dur="10s" transIn="fade2" transOut="fade1"/>
< /body>
</smil>
解 释 ： a 、 transition 声明我 们 要 设 置 转场 效果。 id="fade1" 设 置了 该转场 效果的 id 号。 id 号必 须设 置。 type="fade" 设 置了 转场 效果的基本 类 型 为 fade 。 subtype="fadeToColor" 设 置了 转场 效果的具体 类 型（子 类 型） 为 fadeToColor （注意 这 里又是我 们 提到的 骆驼 写法！）。 dur="4s" 设 置了 该场 效果完成的 时间 。
b 、transIn="fade2" 设 置了 图 片g04.jpg 显 示 时 采用 转场 效果fade2； transOut="fade1" 规 定 图 片g04.jpg完成 显 示 时 采用 转场 效果fade１。
c、fade只有三个子 类 型。 上面我 们 用了２个。 还 有一个是 crossfade ， 这 个也是缺省 设 置。
（２） wipe 类 型
wipe 为 擦去 类 型。 该类 型的效果很多很多。我 们这 里所 说 的 wipe 只是他 们 的 总 称（注意 wipe 不能作 为 type 的属性 值 ，而是它的子 类 作 为 type 的属性 值 ，子 类 的子 类 作 为 subtype 的属性 值 ！ J 谁让 它的属性 值这么 多！！！）。具体的有 barWipe 、 boxWipe 、 fourBoxWipe 等 36 大 类 !!! 不管它有多少 类 ，先看看怎 么 弄。 请 看例子：
< smil xmlns=" http://www.w3.org/2001/SMIL20/Language ">
< head>
< transition id="wipe1" type="slideWipe" subtype="fromTop"/>
< transition id="wipe2" type="waterfallWipe"/>
< /head>
< body>
< img src="g03.jpg" transIn="wipe1" transOut="wipe2" dur="5s"/>
< /body>
< /smil>
解 释 ： a 、 JJJ 和上面的写法基本上是一致的！
b 、 type="waterfallWipe" 后面没有子 类 型表示使用的是 waterfallWipe 类 型的默 认 子 类 型。
（３） 综 合 应 用
我 们 上面都只是用在 单 个多媒体片断上的 转场 效果。下面看看在多个多媒体片断上怎 样设 置 转场 效果。 还 得看例子： J
< smil xmlns=" http://www.w3.org/2001/SMIL20/Language ">
< head>
< layout>
< root-layout width="400" height="300"/>
< /layout>
< transition id="fade" type="fade" subtype="fadeToColor" fadeColor="green" dur="4s"/>
< transition id="fade1" type="fade" subtype="fadeFromColor" fadeColor="red" dur="4s"/>
< transition id="fade2" type="fade" subtype="crossfade" dur="2s"/>
< transition id="push" type="snakeWipe" dur="4" />
< /head>
< body>
< seq>
< img dur="5s" src="g06.jpg" transIn="fade1" fill="transition"/>
< img dur="4s" src="g05.jpg" transIn="fade2" fill="transition"/>
< img dur="4s" src="g06.jpg" transIn="fade2" fill="transition"/>
< img dur="4s" src="g05.jpg" transIn="push" transOut="fade"/>
< /seq>
< /body>
< /smil>
解 释 ： a 、 fadeColor="green" 设 置了 谈 出 谈 入色 为绿 色（ green ）。在 这 里表示的就是从当前的多媒体片断 渐变为绿 色。下面的 fadeColor="red" 则 表示从 红 色 渐变为 当前的多媒体片断（如果是 图 片 则变为图 片，如是 视频则变为 第一 帧 ）。
b 、fill="transition"表示的是最后的完成效果有下面的 转场 效果来决定。
c、最后一个就不能用fill="transition"了。想想，它就是最后一个了，上哪里去找下面的 转场 效果呢？
1201
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
