本例将要实现
![](/icons/79629de.gif)
是星球大战开场时
![](/icons/79629de.gif)
那种字幕显示效果
![](/icons/79629dou2.gif)
而实时创建影片剪辑
![](/icons/79629dou.gif)
并使用随机
![](/icons/79629hanshu.gif)
和影片剪辑
![](/icons/79629de.gif)
Drawing Method(绘画思路方法)绘制星空背景则是本节
![](/icons/79629de.gif)
重点
![](/icons/79629dou2.gif)
主要
![](/icons/79629de.gif)
影片结构如下图所示
![](http://www.crazycoder.cn/WebFiles/20091/5bf17b7f-3075-4093-ba1f-574f7a0b5825.jpg)
图1 影片结构
从上面这个图片中可以看到
![](/icons/79629dou.gif)
这个例子
![](/icons/79629de.gif)
结构还是比较简单
![](/icons/79629de.gif)
![](/icons/79629dou2.gif)
整个影片除去
![](/icons/79629yi.gif)
个黑色背景的外只需要两个图层——用来放置要显示
![](/icons/79629de.gif)
字幕
![](/icons/79629de.gif)
第1层和用来“铺星星”作背景
![](/icons/79629de.gif)
第2层
![](/icons/79629dou2.gif)
因此
![](/icons/79629dou.gif)
整个制作过程可以大致划分为字幕
![](/icons/79629de.gif)
制作和背景
![](/icons/79629de.gif)
制作两大部分
![](/icons/79629dou2.gif)
字幕
![](/icons/79629de.gif)
制作相对比较简单
![](/icons/79629dou.gif)
所以就不多说了
![](/icons/79629dou.gif)
这里简要提
![](/icons/79629yi.gif)
下“星空”背景
![](/icons/79629de.gif)
制作原理
![](/icons/79629dou2.gif)
在这个例子中
![](/icons/79629dou.gif)
用到
![](/icons/79629de.gif)
星空背景将不是用绘图工具
![](/icons/79629yi.gif)
点点画出来
![](/icons/79629de.gif)
静态背景
![](/icons/79629dou.gif)
而是使用ActionScript动态生成
![](/icons/79629de.gif)
动态背景
![](/icons/79629dou2.gif)
![](/icons/79629yinwei.gif)
每次运行时
![](/icons/79629dou.gif)
对应 N颗星星
![](/icons/79629dou.gif)
![](/icons/79629chengxu.gif)
会随机产生N组横坐标、纵坐标值
![](/icons/79629dou2.gif)
再加上每颗星星
![](/icons/79629de.gif)
大小
![](/icons/79629dou.gif)
亮度也是随机
![](/icons/79629de.gif)
![](/icons/79629dou.gif)
所以每次铺出来
![](/icons/79629de.gif)
背景绝对是不
![](/icons/79629yi.gif)
样
![](/icons/79629de.gif)
![](/icons/79629dou2.gif)
在制作过程中主要使用了Free Transform工具
![](/icons/79629de.gif)
部分功能
![](/icons/79629dou2.gif)
并利用Math.random
![](/icons/79629kh.gif)
![](/icons/79629hanshu.gif)
生指定范围内
![](/icons/79629de.gif)
随机数字
![](/icons/79629de.gif)
公式
![](/icons/79629dou.gif)
实时创建影片剪辑以及部分绘画思路方法
![](/icons/79629de.gif)
使用
![](/icons/79629dou2.gif)
最终播放效果如图2所示
![](/icons/79629dou.gif)
要实现这
![](/icons/79629yi.gif)
效果
![](/icons/79629dou.gif)
具体制作过程如下
![](http://www.crazycoder.cn/WebFiles/20091/c061caa3-a0f3-426f-a247-4ece073e1da2.jpg)
图2 星球大战开场文字最终效果图
![](/icons/79629yi.gif)
.制作字幕效果
1.新建
![](/icons/79629yi.gif)
个电影
![](/icons/79629dou.gif)
在属性面板中设置其尺寸为550pxX400px,选择
![](/icons/79629yi.gif)
种颜色(本例为#000000)作为背景色
![](/icons/79629dou2.gif)
2.双击时间线上
![](/icons/79629de.gif)
“图层1”
![](/icons/79629dou.gif)
并将其改为“caption”
![](/icons/79629dou.gif)
主要用于旋置文字
![](/icons/79629de.gif)
图形元件
![](/icons/79629dou.gif)
在工具箱中选取文本工具
![](/icons/79629dou.gif)
并在属性面板中设置文字
![](/icons/79629de.gif)
颜色、字体和大小
![](/icons/79629dou.gif)
本例设置文本
![](/icons/79629de.gif)
颜色为#CCCC00
![](/icons/79629dou.gif)
大小为40
![](/icons/79629dou.gif)
字体为Times New Roman,当然也可以设置为其它属性
![](/icons/79629dou2.gif)
设定好后
![](/icons/79629dou.gif)
点击舞台并写上字幕文字
![](/icons/79629dou.gif)
如图3所示
![](http://www.crazycoder.cn/WebFiles/20091/7652e001-d002-4cd7-8713-f50f03a9ac21.jpg)
图3 在舞台上输入
![](/icons/79629de.gif)
文字
3.接下来该是给文字添加
![](/icons/79629yi.gif)
点透视效果
![](/icons/79629de.gif)
时候了
![](/icons/79629dou2.gif)
选中写好
![](/icons/79629de.gif)
字幕文字
![](/icons/79629dou.gif)
按两下Ctrl+B将文字分离成为色块
![](/icons/79629dou2.gif)
这是
![](/icons/79629yinwei.gif)
下
![](/icons/79629yi.gif)
步
![](/icons/79629de.gif)
变形要求其对象必须是色块
![](/icons/79629dou2.gif)
从工具箱中选取任意变形工具
![](/icons/79629dou.gif)
然后从选项面板中
![](/icons/79629de.gif)
扭曲按钮
![](/icons/79629dou2.gif)
将分离后
![](/icons/79629de.gif)
文本能过调整 4个角上
![](/icons/79629de.gif)
手柄
![](/icons/79629dou.gif)
使整个变形框成
![](/icons/79629yi.gif)
梯形
![](/icons/79629dou.gif)
效果如图4所示
![](http://www.crazycoder.cn/WebFiles/20091/f05cc2f0-e159-41e4-9bd2-d481c5e7dad0.jpg)
图4 调整手柄
4.变形完毕后选择“插入/转换为元件”菜单命令
![](/icons/79629dou.gif)
将变形后
![](/icons/79629de.gif)
字幕转换为图形元件
![](/icons/79629dou.gif)
并为其命名为“caption”
选中字幕后选择按“Ctrl+T”
![](/icons/79629dou.gif)
打开Transfrom(变形)面板
![](/icons/79629dou2.gif)
调整缩放比例
![](/icons/79629de.gif)
数值
![](/icons/79629dou.gif)
使第
![](/icons/79629yi.gif)
行字
![](/icons/79629de.gif)
大小和未进行透视变形前差不多
![](/icons/79629dou.gif)
如图5所示
![](http://www.crazycoder.cn/WebFiles/20091/a5b162ba-46cb-4197-afc0-f144762644d1.jpg)
图5 变形面板
5.将字幕元件拖动到舞台下方边缘的外
![](/icons/79629dou.gif)
如图6所示:
![](http://www.crazycoder.cn/WebFiles/20091/5000b129-a72c-44c5-8e5b-3d3c2d3cfb82.jpg)
图6 拖动字幕
6.点击时间线上
![](/icons/79629de.gif)
第200帧
![](/icons/79629dou.gif)
按F6插入
![](/icons/79629yi.gif)
个关键帧
![](/icons/79629dou2.gif)
选中第200帧上
![](/icons/79629de.gif)
字幕元件
![](/icons/79629dou.gif)
使用Transform(变形)面板将其缩小后将其拖到舞台中上方
![](/icons/79629dou.gif)
如图7所示
![](http://www.crazycoder.cn/WebFiles/20091/784fd471-8ac5-43b3-9786-3d83eb5d0b89.jpg)
图7 缩小字幕元件
7.右击第1帧
![](/icons/79629dou.gif)
在弹出
![](/icons/79629de.gif)
快捷菜单上选择“创建补间动画”
![](/icons/79629dou.gif)
将第1到第200帧转化为运动中间帧动画
![](/icons/79629dou2.gif)
按Enter键看动画
![](/icons/79629de.gif)
效果
![](/icons/79629de.gif)
时候你会发现
![](/icons/79629dou.gif)
整个字幕运动过程
![](/icons/79629de.gif)
前半部分相对后面结束部分
![](/icons/79629de.gif)
速度要慢
![](/icons/79629yi.gif)
些
![](/icons/79629dou2.gif)
所以
![](/icons/79629dou.gif)
需要对运动
![](/icons/79629de.gif)
速度进行
![](/icons/79629yi.gif)
些调整
![](/icons/79629dou2.gif)
选中第1帧
![](/icons/79629dou.gif)
在属性面板中将其中
![](/icons/79629de.gif)
简易选项设为某个正值
![](/icons/79629dou.gif)
如图8示
![](/icons/79629dou2.gif)
如此
![](/icons/79629dou.gif)
字幕运动
![](/icons/79629de.gif)
后半部分就会放慢速度了
![](http://www.crazycoder.cn/WebFiles/20091/2efe21b1-8f06-4560-b52f-f52f5c0cc6aa.jpg)
图8 属性面板
2.制作背景
1.新建
![](/icons/79629yi.gif)
图层
![](/icons/79629dou.gif)
并为其命名为“stars”
![](/icons/79629dou.gif)
然后将这个图层拖动到字幕层“caption”
![](/icons/79629de.gif)
下面
![](/icons/79629dou.gif)
打开Actions(动作)面板
![](/icons/79629dou2.gif)
选中stars图层
![](/icons/79629de.gif)
第
![](/icons/79629yi.gif)
帧后在Actions面板中输入以下代码(注释号“//”后
![](/icons/79629de.gif)
内容可不输)
iMax = 400;
//星星总数![](/icons/79629dou2.gif)
sClipName = "starbg";
//背景影片剪辑名字
iStarSizeMax = 2;
//星星大小(最大值)
iStarSizeMin = 1;
//星星大小(最小值)
iStarAlphaMax = 100;
//星星透明度(最大值)
iStarAlphaMin = 80;
//星星透明度(最小值)
this.createEmptyMovieClip(sClipName, 0);
//创建
个空白
背景影片剪辑![](/icons/79629dou2.gif)
for (i=1; i<=iMax; i
) {
iStarX = Stage.width*Math.random
;
//星星
X轴坐标
iStarY = Stage.height*Math.random
;
//星星
Y轴坐标
iStarSize = (iStarSizeMax-iStarSizeMin)*Math.random
+iStarSizeMin;
//星星
大小
iStarAlpha = (iStarAlphaMax-iStarAlphaMin)*Math.random
+iStarAlphaMin;
//星星
透明度
iStarColor = 0xffffff;
//星星
颜色
with (this[sClipName]) {
lineStyle(iStarSize, iStarColor, iStarAlpha);
//设定画星星画笔
大小
颜色
透明度
moveTo(iStarX-1, iStarY);
//将画笔移动到要绘制星星
位置
lineTo(iStarX, iStarY);
//绘制
条从点(iStarX-1,iStarY)到点(iStarX,iStarY)的间![](/icons/79629de.gif)
长度为
个像素
直线
}
}
![](/icons/79629chengxu.gif)
详解:
第1行到第12行是
![](/icons/79629yi.gif)
些简单
![](/icons/79629de.gif)
变量声明
![](/icons/79629dou2.gif)
其中
![](/icons/79629dou.gif)
变量iMax
![](/icons/79629de.gif)
值就是背景上将出现
![](/icons/79629de.gif)
星星
![](/icons/79629de.gif)
个数
![](/icons/79629dou2.gif)
sClipName是用来绘制星空背景
![](/icons/79629de.gif)
影片剪辑(也就是图1-93
![](/icons/79629de.gif)
表识为2
![](/icons/79629de.gif)
那
![](/icons/79629yi.gif)
层)
![](/icons/79629de.gif)
名字
![](/icons/79629dou2.gif)
第5到第8行
![](/icons/79629de.gif)
两个变量对应
![](/icons/79629de.gif)
是星星
![](/icons/79629de.gif)
最大尺寸和最小尺寸
![](/icons/79629dou2.gif)
iStarSizeMax最好不要太大
![](/icons/79629dou.gif)
![](/icons/79629yinwei.gif)
这个值越大效果越差
![](/icons/79629dou2.gif)
第9到第12行所确定
![](/icons/79629de.gif)
是星星透明度
![](/icons/79629de.gif)
最大值和最小值
![](/icons/79629dou.gif)
而这个透明度反映出来
![](/icons/79629de.gif)
效果就是星星
![](/icons/79629de.gif)
亮度
![](/icons/79629dou2.gif)
第13行
![](/icons/79629de.gif)
createEmptyMovieClip思路方法是Flash MX中
![](/icons/79629de.gif)
新东西
![](/icons/79629dou2.gif)
具体语法是:
myMovieClip.createEmptyMovieClip (instanceName, depth)
其作用是在myMovieClip中创建
![](/icons/79629yi.gif)
个名为instanceName
![](/icons/79629de.gif)
空白影片剪辑(空白=什么都没有)
![](/icons/79629dou.gif)
它在myMovieClip中
![](/icons/79629de.gif)
深度为depth
![](/icons/79629dou2.gif)
这也就是说
![](/icons/79629dou.gif)
要引用这个新影片剪辑
![](/icons/79629de.gif)
话
![](/icons/79629dou.gif)
可以使用myMovieClip.instanceName或myMovieClip[instanceName]这两种语法
![](/icons/79629dou2.gif)
在本例中
![](/icons/79629dou.gif)
myMovieClip参数
![](/icons/79629de.gif)
位置上写
![](/icons/79629de.gif)
是this对象
![](/icons/79629dou.gif)
即当前影片剪辑
![](/icons/79629dou2.gif)
所以这第13行
![](/icons/79629chengxu.gif)
![](/icons/79629de.gif)
意思就是
![](/icons/79629dou.gif)
在当前影片剪辑中创建
![](/icons/79629yi.gif)
个名字为sClipName(这个变量
![](/icons/79629de.gif)
值是“starbg”)
![](/icons/79629de.gif)
空白影片剪辑
![](/icons/79629dou.gif)
其放置
![](/icons/79629de.gif)
深度为1
![](/icons/79629dou2.gif)
第15行到最后是个for循环
![](/icons/79629dou.gif)
它是绘制星星
![](/icons/79629de.gif)
主要
![](/icons/79629chengxu.gif)
段
![](/icons/79629dou2.gif)
第16到33行是循环
![](/icons/79629de.gif)
主体
![](/icons/79629dou.gif)
其中
![](/icons/79629dou.gif)
第16到23行使用同
![](/icons/79629yi.gif)
条随机数公式来随机设定每颗星星
![](/icons/79629de.gif)
大小、透明度
![](/icons/79629dou.gif)
为下面
![](/icons/79629de.gif)
绘制过程作准备
![](/icons/79629dou2.gif)
这条用来获得给定范围内随机数
![](/icons/79629de.gif)
公式是:(最大值 — 最小值)× 随机数
![](/icons/79629hanshu.gif)
+ 最小值
![](/icons/79629dou2.gif)
注意
![](/icons/79629dou.gif)
这条公式中所使用
![](/icons/79629de.gif)
随机数
![](/icons/79629hanshu.gif)
必须是返回0和1的间(包括0)随机数
![](/icons/79629de.gif)
随机
![](/icons/79629hanshu.gif)
![](/icons/79629dou.gif)
Flash MX中
![](/icons/79629de.gif)
随机
![](/icons/79629hanshu.gif)
Math.random
![](/icons/79629kh.gif)
就符合这个要求
![](/icons/79629dou2.gif)
再回头来看看
![](/icons/79629chengxu.gif)
![](/icons/79629dou2.gif)
这第16和18行
![](/icons/79629de.gif)
![](/icons/79629chengxu.gif)
似乎跟上面
![](/icons/79629de.gif)
公式不
![](/icons/79629yi.gif)
样嘛!乍看的下
![](/icons/79629dou.gif)
![](/icons/79629de.gif)
确
![](/icons/79629dou.gif)
这两行
![](/icons/79629chengxu.gif)
似乎是不
![](/icons/79629yi.gif)
样
![](/icons/79629dou2.gif)
但是
![](/icons/79629dou.gif)
如果当上面那条公式中
![](/icons/79629de.gif)
最小值等于0时
![](/icons/79629dou.gif)
公式会变形为:最大值 × 随机数
![](/icons/79629hanshu.gif)
![](/icons/79629dou2.gif)
这样就和16、18行很符合了
![](/icons/79629dou2.gif)
iStarX和iStarY变量分别代表
![](/icons/79629de.gif)
是星星在舞台上横坐标和纵坐标
![](/icons/79629dou.gif)
所以这里分别用舞台
![](/icons/79629de.gif)
宽(Stage.width)和高(Stage.height)乘以随机
![](/icons/79629hanshu.gif)
来得到舞台的内
![](/icons/79629de.gif)
某组横、纵坐标值
![](/icons/79629dou2.gif)
而iStarSize和iStarAlpha分别表示了星星
![](/icons/79629de.gif)
大小和透明度
![](/icons/79629dou.gif)
这两条使用
![](/icons/79629de.gif)
就是标准
![](/icons/79629de.gif)
随机数公式了
![](/icons/79629dou2.gif)
iStarColor用以表示星星
![](/icons/79629de.gif)
颜色(其实也是可以改用随机公式来确定
![](/icons/79629de.gif)
)
![](/icons/79629dou.gif)
这里使用0xffffff
![](/icons/79629dou.gif)
即纯白色
![](/icons/79629dou2.gif)
第26到33行是真正动笔绘制
![](/icons/79629de.gif)
时候
![](/icons/79629dou2.gif)
首先
![](/icons/79629dou.gif)
第26行用了
![](/icons/79629yi.gif)
个with语句
![](/icons/79629dou.gif)
这条语句始现于Flash 5
![](/icons/79629dou.gif)
具体语法为:
with (object) {
statement(s);
}
使用这条语句可以让你在两个花括号间直接设置对象object
![](/icons/79629de.gif)
属性
![](/icons/79629dou.gif)
而不需要在每个属性前面再加上object
![](/icons/79629de.gif)
引用
![](/icons/79629dou2.gif)
例如
![](/icons/79629dou.gif)
要设置影片剪辑mc
![](/icons/79629de.gif)
_x属性
![](/icons/79629dou.gif)
可以写成:
mc._x=100;
而使用with语句就可以写成:
with (mc) {
_x=100;
}
使用with语句可以将某
![](/icons/79629yi.gif)
对象
![](/icons/79629de.gif)
属性设定或思路方法
![](/icons/79629diaoyong.gif)
都集中在
![](/icons/79629yi.gif)
起
![](/icons/79629dou.gif)
从而使
![](/icons/79629chengxu.gif)
![](/icons/79629de.gif)
实现更加结构化
![](/icons/79629dou.gif)
清晰化
![](/icons/79629dou2.gif)
当然
![](/icons/79629dou.gif)
象上面例子这种
![](/icons/79629dou.gif)
只设置单个或少数属性
![](/icons/79629de.gif)
情况下
![](/icons/79629dou.gif)
with语句
![](/icons/79629de.gif)
好处是比较难体现
![](/icons/79629de.gif)
![](/icons/79629chengxu.gif)
中with语句
![](/icons/79629de.gif)
object参数是this[sClipName]
![](/icons/79629dou.gif)
即第13行
![](/icons/79629chengxu.gif)
创建
![](/icons/79629de.gif)
新影片剪辑starbg
![](/icons/79629dou2.gif)
所以
![](/icons/79629dou.gif)
下面花括号中
![](/icons/79629de.gif)
操作都是针对starbg进行
![](/icons/79629de.gif)
![](/icons/79629dou2.gif)
第27到32行用
![](/icons/79629de.gif)
是Flash MX中新添功能Drawing Method(绘图思路方法)中
![](/icons/79629de.gif)
3条——lineStyle、moveTo和lineTo思路方法
![](/icons/79629dou2.gif)
lineStyle具体语法如下:
myMovieClip.lineStyle ([thickness[,rgb[,alpha]]])
myMovieClip是要进行设置
![](/icons/79629de.gif)
影片剪辑
![](/icons/79629de.gif)
名字
![](/icons/79629dou2.gif)
参数thickness
![](/icons/79629dou.gif)
rgb
![](/icons/79629dou.gif)
alpha分别表示线
![](/icons/79629de.gif)
粗度
![](/icons/79629dou.gif)
16进制形式
![](/icons/79629de.gif)
颜色值和透明度
![](/icons/79629dou2.gif)
如果什么参数也不给
![](/icons/79629de.gif)
话
![](/icons/79629dou.gif)
那么屏幕将画不出任何线
![](/icons/79629dou2.gif)
moveTo具体语法如下:
myMovieClip.moveTo (x,y)
将画笔移动到坐标为(x,y)
![](/icons/79629de.gif)
点上
![](/icons/79629dou2.gif)
这条语句只负责移动画笔并不实际进行任何
![](/icons/79629de.gif)
绘图操作
![](/icons/79629dou2.gif)
lineTo具体语法如下:
myMovieClip.lineTo (x,y)
在画笔当前所在位置和参数所指定
![](/icons/79629de.gif)
坐标(x,y)的间画
![](/icons/79629yi.gif)
条直线
![](/icons/79629dou2.gif)
例如
![](/icons/79629dou.gif)
当前画笔在坐标为(0,0)
![](/icons/79629de.gif)
点上
![](/icons/79629dou.gif)
执行
![](/icons/79629yi.gif)
条lineTo(10,10)的后
![](/icons/79629dou.gif)
就会在(0,0)到(10,10)的间出现
![](/icons/79629yi.gif)
条直线
![](/icons/79629dou2.gif)
注意
![](/icons/79629dou.gif)
在
![](/icons/79629diaoyong.gif)
这个思路方法的前
![](/icons/79629yi.gif)
定要先
![](/icons/79629diaoyong.gif)
lineStyle思路方法设置好线
![](/icons/79629de.gif)
属性
![](/icons/79629dou.gif)
否则你将画不出任何东西
![](/icons/79629dou2.gif)
2.到了这里
![](/icons/79629dou.gif)
整个例子可以说是基本上完成了
![](/icons/79629dou2.gif)
但为了能让字幕有
![](/icons/79629yi.gif)
点点消失在黑色
![](/icons/79629de.gif)
星空的中
![](/icons/79629de.gif)
效果
![](/icons/79629dou.gif)
再给它添加个“帘子”
![](/icons/79629dou2.gif)
新建
![](/icons/79629yi.gif)
图层
![](/icons/79629dou.gif)
并为其命名为“shade”
![](/icons/79629dou.gif)
按Sh
![](/icons/79629if.gif)
t+F9键
![](/icons/79629dou.gif)
打开“混色器”面板
![](/icons/79629dou2.gif)
将填充样式改为“线型渐变”后指定两个黑色指针
![](/icons/79629dou.gif)
并将其中
![](/icons/79629yi.gif)
个
![](/icons/79629de.gif)
Alpha值设定为0%
![](/icons/79629dou.gif)
即完全透明
![](/icons/79629dou.gif)
如图9所示
![](http://www.crazycoder.cn/WebFiles/20091/df361c92-2d0b-4fba-a062-6854738303a9.jpg)
图9 设置“混色器”面板
3.从工具箱中选取“矩形”工具
![](/icons/79629dou2.gif)
在属性面板中设定边框色为无色
![](/icons/79629dou.gif)
填充色为上面设定
![](/icons/79629de.gif)
线性渐变
![](/icons/79629dou2.gif)
点击第200帧
![](/icons/79629dou.gif)
在shade上画
![](/icons/79629yi.gif)
个渐变矩形色块
![](/icons/79629dou.gif)
大小应比下面caption层上字幕
![](/icons/79629de.gif)
尺寸略大
![](/icons/79629dou.gif)
从工具箱中选取“填充变形”工具
![](/icons/79629dou2.gif)
然后点击渐变色块
![](/icons/79629dou.gif)
调整手柄将渐变
![](/icons/79629de.gif)
方向改为透明部分朝下
![](/icons/79629dou.gif)
调整渐变方向
![](/icons/79629dou.gif)
效果如图如图10所示
![](http://www.crazycoder.cn/WebFiles/20091/18c37c47-9313-448f-abf3-c7fa9fa1c6ef.jpg)
图10 调整渐变方向
4.保存影片
![](/icons/79629dou.gif)
按“Ctrl+Enter”预览就可以看到漂亮
![](/icons/79629de.gif)
“星球大战”开场文字