您的当前位置:首页Flash as入门

Flash as入门

2021-11-07 来源:乌哈旅游
本例我们将开始学习AS的相关知识,不要被这个题目吓倒哦,AS的确是一种程序语言,我们编写AS代码就叫做编程,我们学习AS首先应该克服对编程的恐惧,所以在开始学习前,我们先廷着胸大声地说:\"编程其实很容易\"。

ActionScript是针对Flash Player的编程语言,它在flash内容和应用程序中实现了交互性、数据管理以及其它许多功能.那么我们将程序写在什么地方呢?在flash创作环境中,我们的程序写在\"动作\"面板中

而动作面板,又是与舞台上可以添加动作的对象相关联的.在ActionScript2.0中可以添加动作的对象有三种:关键帧、影片剪辑元件、按钮元件.

编程实际就是向计算机下达指令,让计算机按我们的指令去完成一些任务.这就要求我们用计算机能看得懂的语言,这就是编程语言.ActionScript则是其中的一种.即然是语言,就同我们人类的语言一样它就有它自己的语法、语句、词汇等,这些东西就是我们要学习的内容.为了以后学习方便我们首先来学习一个语句: trace()这个语句的作用是,flash在运行时,将括号中的内容显示出来.

上面我们提到,ActionScript2.0中可以添加动作的对象有三种:关键帧、影片剪辑元件、按钮元件.也就是说,我们可以在这三个对象的动作面板中编写程序.具体怎样作呢?我们来试试.新建一flash文档,如果你的flash版本是CS3,那么请选择ActionScript2.0文档,因为本教程介绍的是ActionScript2.0.为什么不介绍3.0?因为sanbos发现很多人用的都是flash8.好,现在点击\"插入\"菜单,一\"新建元件,建一个影片剪辑元件,随便画一个什么图形吧,将元件拖到舞台上;然后点击\"窗口\"一\"公用库\"一\"按钮\然后随便选一个按钮拖到舞台上.这样,关健帧、影片剪辑、按钮都齐了.现在我们来看看怎样打开动作面板.在影片剪辑上点鼠标右键,然后在弹出菜单中点\"动作\那么现在我们看到的就是动作面板了. 图1:动作面板

我们在按钮元件上执行相同的操作,可以得到相同的结果

现在在时间轴的第1 帧上,执行相同的操作,一样地打开了动作面板.动作面板的右边留出了一大片空白,等着你去编写程序,鼠标指针在那儿闪着,便勾起了我们编程的冲动.于是你说:\"我要编程了\".上面我们不是介绍了一句,trace()吗?我们何不偷偷地在这里输上一句,也好过把编程的隐.于是你在这里输上: trace(\"我会编程了\");

注意大小写,括号后面跟着分号.测试影片.你会看到一个输出窗口,里面有\"我会编程了\"几个字

是的,你已经会编程了.虽然只有一句,但它是一个ActionScript程序却是千真万确的.因此,这的确是一件值得祝贺的事情.来吧,让我们再说一次:\"编程其实很容易\".

欣赏够以后,请关闭输出窗口,关闭播放窗口,回到几分钟之前,令我们自豪了一把的动作面板,我们来对它进行更进一步的认识.我们看到trace是蓝色的

是的,ActionScript内部的词汇在编程环境中都会以蓝色表示.那么这就是一个技巧, 当你在输入程序时,如果输入ActionScript内部词汇时不是蓝色的,那么说明你输错了,那么你应该马上检查,是否有哪个字母输错了.现在问题出现了,你说我记不到那些词汇.在中学时英语考不出好成绩主要就是因为记不住单词.现在学习编程也记不住那些指令、语句,所以觉得编程好难.首先我还是说一句,你可能不太乐意听的话:多练自然就记住了.你说:我就是记不住,我是不是就不宜学习ActionScript编程呢?NO,你看说英语并不难,我张口就来.我们将标淮降低,只要你看到这些指令,能够认识它就行.相比之下,知道有些什么指令比记住那些指令的拼写要重要得多.回到动作面板,你就会明白这个道理.看看动作面板的左半部分,这里几乎将所有的指令列了出来,你可以分门别类地去找到相关指令,如影片剪辑控制、时间轴控制、常用语句等,找到相应语句,双击它,于是它便自动写到右边的编程窗口中了.

是不是不用精确记住指令的拼写也能编程呢.在右边的编程窗口上面的工具栏最左边有一个加号,它具有与左边窗口相同的功能,不信你点它试试

通常在ActionScript编程时,我们可能会习惯将代码写在影片剪辑、按钮元件上,这就必须要事件驱动,它的格式是: on(事件名称){ 要执行的语句

}

现在我们来试一试,在动作面板中输入

on(

这时你会发现弹出了一个窗口,将所有事件列了出来,你只需用鼠标选用所需要的事件双击它或回车,事件就会自动写到屏幕上.是不是很方便?

很多ActionScript程序都是对影片剪辑、按钮元件、文本框等对象进行操作,这需要在属性面板中为它们命名.良好的命名习惯,对我们编写程序会有很大的帮助.按照约定,影片剪辑元件的命名以_mc结尾,如my_mc,按钮元件则是以_btn结尾,文本框则是以_txt结尾.当然你完全可以不理采这些约定,随心所欲地为他们命名.我们说遵守这些约定,会对我们编程有所帮助.还是来试一试吧.建一影片剪辑元件,然后将它拖到舞台上,打开属性面板,为它取名为:mymc_mc,在第一帧打开动作面板,输入:mymc_mc.这时会弹出一个窗口,需要哪个指令选就是了.这些指令是按拼音顺序排列的.如果你能记住所需指令的前几个字母,你不妨直接输入,这时你会发现,很快就定位到了你所需要的指令.现在,我们把元件的名称改为mymc,不以_mc结尾,再到动作面板

中输入,mymc.结果什么也没有发生,后面的指令只有自己输了,或者到左边窗口中去选.按钮元件和文本框也是相同的.你可以试一下.

这一课我们认识了动作窗口,这是我们ActionScript编程的地方,通过对智能化的编窗口的认识,应该消除了我们对编程的恐惧,让我们树立了学好ActionScript编程的信心

Flash as入门(2):面向对象编程基础

日期:2009-02-19 16

作者:

来源:

本例继续讲解AS的基础知识,今天讲解的是AS入门第二课:面向对象编程基础,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

上一课:Flash新手入门教程:AS入门第一课_认识编程环境 面向对象编程基础

ActionScript是一种面向对象的编程语言.通常我们会认为编程就是连续地写一系列指令,计算机按顺序地执行它.而面向对象编程则是将程序分成各个块,分散到对象上.什么是对象?对象就是我们在flash中能看到的一切东西.舞台是一个对象,时间轴、影片剪辑、按钮、文本、位图都是对象.在第一课中我们己说过:在ActionScript2.0中我们可以将程序写在关键帧、影片剪辑、按钮元件上.即便是将程序完全写在关键帧上,它也必须要对象的事件驱动才能执行.

在理解了面向对象编程后,我们必需要对一些概念有所了解.事实上我们在上面对对象己经有了一定的了解.就如同我们的家中,所有的东西都可以叫做对象.比如,电视机,电冰箱,书桌,衣柜等等.很容易发现,这些东西,总有那么几个都有相似之处.比如,电视机、电冰箱都需要用电;书桌、衣柜都是用木头做成的. 我们便把家里的东西分成了几类,并为每一类东西取上一个名字,比如,电器类、木器类等.这样我们就理解了另一个重要的概念一\"类\".

类是某一类型对象的概括或者说是模板,在ActionScript中,所有对象都是由类定义的.每个类都包括了三个重要的元素:事件、属性、方法,这是我们必须要了解的三个重要概念.

事件:在面向对象的编程中,并不是将程序按顺序交给计算机去执行,上面己经谈到了,程序被分散到了对象上.那么要计算机执行这些程序就需要事件来触发.通俗地讲就是:当某件事情发生时就去做一些事情.这个某件发生的事情就是事件.在flash中,常常会放上一个按钮,比如\"开始\"按钮.程序设计者可能是这样的思路:

当按钮按下时就播放动画.那么\"当按钮按下时\"就是按钮对象的事件.在ActionScript2.O中,程序可以写在关键帧和元件上,事件在关健帧中和原件中的输写方法是不一样的. 事件在关健帧中的写法:

元件名称.事件名称 = function(){ 要执行的语句 .... }

事件在元件上的写法: on(事件名称){ 要执行的语句 ..... }

我们来做一个练习,在舞台上有一名为play_btn的按钮,现在要实现点击按钮动画就播放.新建flash文档,用椭园工具画一个园,然后,在40帧插入关健帧,将园移到另一位置,建立补间动画.新建一图层,从内部库中拖一个按钮到舞台上.打开属性面板,为按钮命名为play_btn.这里先介绍一个最常用的事件:release,这是当放开鼠标按键时触发.实际也就是完成了一个点击动作时发生. 首先,在幀动作面板上写程序的方式完成练习:

新建图层,命名为action,当这不是必须的,你完全可以给它取个其它名字. 打开幀动作面板,输入: stop();

//这是让动画停止播放,以便让我们点击按钮时才播放. play_btn.onRelease = function(){

play();

//让动画开始播放 }

测试影片,当点击按钮后,园形开始移动.

回到场景中,可以看到,在action图层时间轴的第1幀上,有一个a字,这说明在这一幀上有程序. 下面用在元件上写程序的方式来完成练习:

将幀动作除第一行的stop();外其它的程序全部删除.然后,在按钮元件上点右键,点击"动作",打开动作面板,输入如下代码: On(replease){

Play();

}

测试影片,得到相同的效果.

注意:在幀动作面板中同元件动作面板中事件的名称不一样,如上例,在幀动作中是:onRelease,而在元件上则是:release

属性:对象的属性可以理解为对象的特性,比如,大小,位置,颜色等.属性的输写规则是: 对象名称.属性名称 = 值; 下面介绍几个最常用的属性:

_x,_y:分别是对象在舞上台的x,y坐标,这两个属性可以确定对象在舞台上的位置.

_xscale,_yscale:分别是对象在舞台上沿x,y轴方向的缩放比例,实际上就是宽和高的缩放比例,以百分比表示,例如:

my_mc._xscale = 50;

这表示,元件my_mc的宽度缩小到原来的50%. _alpha:这是对象的透明度,取值为0-100.

_rotation:这是对象的旋转度,以角度为单位.

_visible:为是对象是否可见,可设置两个值,true(或1)和false(或0).比如要设置元件my_mc在舞台上不可见,可用:

my_mc._visible = false; 或 my_mc._visible = 0; 相反要设置它在舞台上可见则用:

my_mc._visible = true; 或 my_mc._visible = 1;

函数:你可能要问,属性介绍完了该介绍方法了,你怎么介绍起函数来了?原因很简单,方法也是函数.将函数附加到对象时,它就被称为方法.什么是函数呢?将完成一个任务的若干语句封装起来,就叫函数.也许用例子来说明会好理解一些.比如,要完成一个开电视的任务,可能需要很多步骤,插上电源,开机,选频道,设置音量.我们将这些步骤封装起来,并给它取个名字\"开电视\"这就创建了一个开电视的函数.在ActionScript2.O中创建函数的格式是: function 函数名称(){ 要执行的语句; .....

}

比如要创建上面开电视函数,就这样写: function 开电视(){ 插电源;

开机; 选频道; 设音量;

}

函数创建以后,要调用这个函数只需:函数名()即可,比如我们要执行开电视的任务,只需输入: 开电视();

练习一下,我们来创建一个函数,然后调用它.打开第一帧的动作面板,输入: function test(){ trace(\"我会写函数了\"); }

test();

测试影片,在输出面板中,会出现\"我会写函数了\"几个字.这个练习我们首先创建了一个叫test的函数,然后用test();调用了它.

有时会有这样的情况,在函数内的语句中要用到数据,在创建函数的时候,却不能确定这些数据,比如每次调用会用不同的数据.这时就会用到参数,调用时,通过参数将数据传递给函数.格式如下: 创建函数的格式:

function 函数名称(参数1,参数2,…){ 要执行的语句 }

调用函数的格式: 函数名称(值1,值2,…); 还是以开电视为例: 创建开电视函数:

function 开电视(频道,音量){ 插电源; 开机; 选频道=频道; 设音量=音量;

}

调用函数: 开电视(12,28);

调用后,电视打开,并将频道设为12,音量设为28. 练习:在帧动作面板中输入: function test(a,b){ c=a+b; trace(c); }

test(3,5);

测试影片,输出面板中应显示 8 .

了解了函数后,再来说方法就简单多了.上面已经说过,将函数附加到对象,就称为方法.AS中内置了很多方法,对于这些方法,我们不需要去了解它执行了些什么语句,只需要知道它可以完成的任务就行了.我们可以用: 对象名称.方法名称();

的格式来调用这些方法.比如有一个my_mc的影片剪辑元件,我们可以调用它的一些方法: my_mc.stop(); my_mc.startDrag();

按钮:在交互式的动画制作中, 经常会用到按钮,比如我们会放上一个\"播放\"、\"停止\"、\"重放\"等按钮.有两种方式可以将按钮添加到舞台上,一种是从内部库中拖一个按钮到舞台上;另一种方法是自己创建一个按钮,这里主要介绍一下自己创建按钮的方法,因为常常有人会问:为什么我创建的按钮点击它时不起作用?这可能就是创建按钮时出了问题.现在点击\"插入\"菜单-\"创建新元件\选择按钮,这时就进入按钮编辑窗口,可以看到,时间轴上只有4帧,分别是:弹起,指针经过,按下,点击.特别要注意的是,点击那一帧,这一帧是点击的范围,因此这一帧是必须的,而且要注意的是,如果你的按钮是纯文字的,如Play,那么在这一幀应该画一个矩型,作为点击范围,不然,用户就只有点击到文字的笔划上才能触发按钮事件.在按钮编辑窗口中同样可以有很多层,比如第一层为图形,第二层为文字等.下面来制作一个按钮:

点击“插入”-“新建元件”,选择按钮,确定,这样就进入元件编辑窗口。

在弹起那一幀画一矩形,按钮大小吧。黑色笔触,灰色填充。在指针经过那一幀、按下幀幀、点击幀,插入关键幀。在指针经过幀将矩形填充色变为深灰色。在按下那幀,将边框线条粗细调为2。新插入图层,建一静态文本框,输入“Play”.这样按钮就做好了。

现在可以将这个按钮从库中拖到舞台上,测试影片,看一下,当鼠标移到按钮上,点下按钮时的效果。

练习:按钮的应用。点击一下按钮,影片剪辑元件就向右移动一点。新建一影片剪辑元件,就画一个园就行了。将这个mc拖入舞台上,放到稍左一点的位置,打开属性面板,为其取名为:my_mc。新建一个按钮,然后拖入舞台,为其取名为:yy_btn.新插入一层,命名为:action,打开动作面板,输入: yy_btn.onRelease = function(){ my_mc._x = my_mc._x + 10;

}

测试影片,点击一次按钮,园就会向右移动一点。

Flash as入门(3):AS基本语法

--------------------------------------------------------------------------------

日期:2009-02-19 16 作者: 来源:

一、ActionScript语句是区分大小写的:在ActionScript中英语字母的大小写具有不同的意义的.我们来看一个例子:打开时间轴第一帧的动作面板,输入:

Name=\"Sanbos\";

name=\"假博士\";

trace(Name);

测试影片,输出窗口将出现Sanbos,ActionScript区分开了Name和name.现在将代码改为:

Name=\"Sanbos\";

Name=\"假博士\";

trace(name);

测试影片,输出窗口将出现:undefined,没有输出内容

二、ActionScript语句以分号作为每句的结束符号,以上面的代码为例,把它写成一行:

Name=\"Sanbos\";name=\"假博士\";

trace(Name);

这时ActionScript将这一行看成三句指令,每句中间用分号分开.测试影片,输出窗口将出现Sanbos.那么将三句指令中间的分号去掉,那么,输出窗口会出现语法错误的提示.所以我们应该养成,每一个语句结束时,输入一个分号的习惯 三、关于点语法

在ActionScript中,应使用点(.)来访问对象的属性和方法.比如在舞台上有一个叫mymc_mc的影片剪辑元件,我们要访问它的属性和方法,就需要使用点,比如:

mymc_mc._x

在对象的名称后面输入一个\".\然后输入其属性和方法的名称.

点的另一个作用是相当于路径,就相当于文件系统如:c:/windows/„中的\"/\".比如我们一个动画,主时间轴或者说舞台,在ActionScript2.O中被写为_root,舞台上有一影片剪辑元件my_mc,如果要写my_mc的_x属性,就应该这样写:

_root.my_mc._x

你可能会说,我常看到只写了my_mc._x,没有_root.这种情况在主时间轴的帧动作上的,程序本来就在_root上,就可以省略.如果在舞台上加一个按钮用来设置舞台上mc的_x属性,用_root.对象的层次更清楚一些。如果代码是写在mc内部,就要加上_root或_parent了。如在按钮上就要这样写:

on(release){

_root.my_mc._x=200;

}

又比如,做一个mc动画,在mc的第一帧写上stop();放在舞台上,然后在舞台上放一按钮来控制mc播放,那么在按钮上的程序就应该这样写:

on(release){

_root.my_mc.play(); }

四.注释

ActionScript中注释用来解释和说明语句的作用.而注释本身是不被执行的.注释有两种,一种是单行注释,一种是多行注释.单行注释是以//开始到本行未尾.如: trace(\"单行注释\");//这是单行注释丨

测试影片时从双斜杠开始以后的都不会执行.

另一种注释方式是多行注释,它是以/*开头,以*/结束的.如:

/*这是多行注释

在这个注释范围内的语句

都不会被执行*/

trace(\"多行注释\");

数据类型:计算机执行程序时处理的数据,与我们数学中的数字是不同的.数字只是数据的一种,在ActionScript中有很多种不同类型的数据,下面介绍一下几种主要的数据类型.

Number:数字数据类型

uint:正整数

int:整数

String:字符或者叫文本,String数据类型常常用引号括起来,如:

Mystring=\"abc\"

Boolean:布尔值,它只有两个值:true、false,分别是真和假的意思.也就是\"是\"和\"不是\"的意思

Object:可以里解为对象

数据类型的转换:虽然数据有不同的类型,但各种类型之间是可以转换的.就象现在流行的变性手术一样,做了一二十年的男人,突然想做女人了,做个变性手术就行了.在ActionScript中就简单多了,下面来看看怎样转换

将数据转换为数值类型:

数值类型有三种,用下面三个函数可以将真它数据类型转换为数值:

Number() int()

uint()

对于不能被转换为数值的数据如英文字母,汉字等,int(),uint()则返回0,而Number()则返回NaN.

练习:在帧动作面板中输入:

a=\"123\";

b=\"abc\";

c=int(a);

d=int(b);

e=Number(b);

trace(\"c=\"+c+newline+\"d=\"+d+newline+\"e=\"+e); 测试影片,在输出窗口会出现: c= 123 d= 0

e=NaN

来看看这几句代码:

a=\"123\";这个\"123\"是用引号括起来的,那么它就是字符(String),它不是一个数值,而是由三个字符组成的字符串,它被读为:一二三.

b=\"abc\"更不用说是字符串了.

c=int(a);将a从字符串转换为数值了,那么c就为123,被读为:一百二十三.

d=int(b);很显然abc是不能被转换为数值的,当不能被转换为数值时,int()返回0,所以d为0.

e=Number(b);当不能被转换为数值时,Number()返回NaN,所以e为NaN.

如果要将布尔值转换为数值,那么ture将被转换成1,false则被转换为0. 如: a=ture;

b=false;

c=int(ture);//c为1

d=int(false);//d为0

另外int和uint类型都是整数,如果被转换的数据为小数点的,那么它们会只返回整数部分,如:

a=\"3.5\";

b=int(a);//b为3

c=Number(a)//c为3.5

这时我们立即就会想到可以用int(),uint()来取整,是的可以,不过需要注意的是它们是将小数点及后面的省略,而不是四舍五入

将数据转换为字符串:

用String()可以将数据转换为字符串.如: a=5;

b =8;

c =String(b);//c为\"8\"

d=a+c;

trace(d);

测试影片输出为58(读作:五八),这是因为c是字符,不能进行数学计算,只能是两个字符连接.如果将d=a+c;改为:d=a+b;测试时就输出13.

将数据转换为布尔值:

只介绍一种情况,将数值转换为布尔值.如果数值为0,则被转换为false,否则转换为true.仅管有Boolean()函数来转换,但我们应该不会用它,但这并不意味着我们不会用到这种转换,来看个例子:

My_mc._visible=0;

这句让元件不可见的代码,我们经常用到,mc的_visible属性是是否可见的意思.设置这个属性只能用布尔值,即true(是)和false(不是).但上一句我们确用的0,那么在执行这句代码时,ActionScript会将0转换为false,然再执行.所以上句代码实际执行的是:

my_mc._visiblc=false;

这里可以看出,如果我们直接写成: my_mc._visiblc=false;

计算机执行速度要快些,因为它不需要转换,当然你说,我写0要快些,那就随你高兴罗.

数据被存放在计算机内存之中,内存被分成很多个小房间,每个房间里存放一个或多个数据,为了便于使用这些数据,我们给这些房间取上一个名字,这就是我们要介绍的另一个重要概念:

变量:变量用来存放数据,它是一小块内存的代号,如上所说,它就是内存中存放数据的小房间的名称,要创建一个变量,它的语法是:

var 变量名称:数据类型 比如:

var a:Number

这就声明了一个变量a,它的数据类型是数值.运行下面的代码:

var a:Number;

a= 10;

trace(a);

输出面板将显示10.

var a:Number; a= b;

trace(a);

输出面板将显示:undefined,这是不知道的类型.因为声明的变量a是数值类型,而给它赋值却是b,b不是数值,所以输出结果就只好说:不知道你在说什么?

上面a=10中的\"=\"号是赋值,即将10放到变量a中.在声明变量的同时就可以给它赋值,如:

var a:Number=10;

你可能要说,前面你怎么就写的:

a=10;

是的,在ActionScript2.0中我们还可以直接写:a=10,它实际上就是:var a=10,但这是最后的晚餐了,在ActionScript3.0中就必须写var了.

上面介绍过,变量就象是内存中的一个房间,里面存放着数据.那个这个房间就是一人一间制.比如原来a房间中住着10,现在将15放进去,15进去后,一脚就将10踢出去了.运行下面代码看看:

var a:Number; a=10;

a=15;

trace(a);

结果显示为:15

Flash as入门(4):AS常用语句

--------------------------------------------------------------------------------

日期:2009-02-19 16 作者: 来源: AS常用语句

一.运算符

1. = 赋值运算符,它不是数学中的等于,而是将=号右边的值赋给左边的变量.

2. 使用于字符串的运算符:

比较:== 等于. 用于比较两个字符串是否相等,如果相等则返回\"true\否则返回false. 如: a=\"abc\";

b=\"abc\";

c=\"bcd\";

d=(a==b);//d为true

f=(a==c);//f为false

〉大于 .

〉= 大于等于

〈 小于

〈= 小于等于

字符串的大小比较由小到大的顺序是:A一Z一a一z. +:连接运算:

如:a=\"abc\";

b=\"def\";

c=a+b;//c为:\"abcdef\"

trace(c);

可以把上述代码复制到帧动作面板中,测试影片,试试.

又如:a=\"123\";

b=456;

c=a+b;//c为:\"123456\"

trace(c);

而:a=123; b=456;

c=a+b;//c为:579

trace(c);

上面两个代码出现了不同的结果,这是因为第一段代码a被赋的值是被引号括起来的,那么它就是字符串,在字符串中+号是连接符号,不是数学中的加号.第二段代码,a、b被赋的值都没引号,AS就将它看着数字,在数字类型中+号就是数学中的加号.

+= 这也是连接符号,这是将+=符号左边的字符串与右边的字符串连接,如:

a=\"abc\";

b=\"def\";

a+=b;//这时a为abcdef

3.对数字使用运算符:

+、-、*、/:这就是数学中的加减乘除.

%:求模运算符,即求余数,如: a=7;

b=2;

c=a%b;//c为a除以b的余数1

+=、-=:分别是符号左边的数字加上或减去右边的数字,并将结果赋值给左边的变量.如:

a=7;

b=2;

a+=b;//这时a为9

a-=b;//这时a为7

*=、/=:同理

++、--:递增递减运算符,即+或减1.如:

a=7;

a++;//这时a为8

a--;//这时a为7 比效:==:等于

!=:不等于

〉:大于

〉=:大于等于

〈:小于

<=:小于等于

二、条件语句

if 语句:如果怎么样,就做些什么事.可以把if理解为如果.

格式:

if(条件表达式){

要执行的语句 } 例: a=7; b=2;

if (a==b){

trace(\"是的\");

}

这个条件语句的意思是,如果a等于b,那么就输出\"是的\".将上面代码写到帧动作面板中,测试影片,发现并没有输出面板弹出.因为上面的语句是a等于b时才执行 trace(\"是的\");,事实上现在a不等于b而是大于b,那么trace(\"是的\");就不会执行.把代码改一下: a=7;

b=2;

if (a〉b){

trace(\"是的\");

}

测试影片,那就会看到输出窗口中的\"是的\".

if„else语句:这句是如果怎样就执行if后面的语句,如果不是这样就执行else后面的语句.

格式:

if(条件表达式){

要执行的语句

} else {

要执行的语句 } 例: a=7;

b=2;

if(a〈=b){

trace(\"a比b小或一样大\"); } else {

trace(\"a比b大\");

}

看看这个代码,如果a小于等于b那么就输出:\"a比b小或一样大\".否则,就输出:\"a比b大\".测试影片,我们可以看到:\"a比b大\".

if„else if:这个语句可以测试多个条件.这样理解这个语句,如果怎样就干点什么,又如果怎样,又干点什么,再如果怎样„. 还是这个例子:

a =7; b=2;

if(atrace(\"a比b小\"); }

else if(\"a==b\"){

trace(\"a和b一样大\");

} else if(a〉b){

trace(\"a比b大\");

}

这段代码意思是:如果a小于b那么输出:\"a比b小\";如果a等于b那么输出:\"a和b一样大\";如果a大于b那么输出:\"a比b大\".测试影片,输出是:\"a比b大\".

switch语句:上面提到有要检测多个条件的情况,可以用多个else if,用switch语句也可以实现这个目的.

格式:

switch(表达式){

case 表达式的值:

要执行的语句

break;

case 表达式的值:

要执行的语句 break; „

default:

要执行的语句

}

上面括号中的表达式也可以是一个变量,下面的大括号中可以有多个 case 表达式的值:,程序执行时会从第一个case开始检查,如果第一个case后的值是括号中表达式的值,那么就执行它后面的语句,如果不是括号中表达式的值,那么,程序就跳到第二个case检查,以此类推,直到找到与括号中表达式的值相等的case语句为止,并执行该case后面的语句.你可能会注意到每一句case后面都有一句breake;这是跳出switch语句的意思,即当找到相符的case,并执行相应的语句后,程序跳出switch语句,不再往下检测.以免发生落空的错误.可能会有这样的情况,所有的case语句后的值都与表达式的值不相符,那么就应该用default: 语句,这时程序就会执行default:

后的语句.如果你确定不会出现这种情况,那么可以不要default: 语句.

例1: a=7;

b=2;

c=a+b;

switch(c){

case 5:

trace(\"小了\"); breake; case 12:

trace(\"大了\"); breake;

case 9:

trace(\"对了\"); breake;

}

测试影片,输出句\"对了\". 例2. a=7; b=2;

switch(a+b){ case 5:

trace(\"小了\");

breake;

case 12:

trace(\"大了\");

breake;

case 8:

trace(\"还是小了\"); breake; default:

trace(\"都没算对\");

}

测试影片输出为:\"都没算对\".

逻辑运算符:逻辑运算符在运算符那一节没有介绍,是因为它多半用在条件语句中,所以我们在这一节介绍.在上面的条件表达式中,都是单一的条件,比如是否大于是否小于等,实际上我们经常都可能用到复合条件,

比如大小多少并且小于多少,大于多少或者小于多少等.在这样的复合条件语句中,有两个词:并且、或者,它们的符号: && 并且

丨丨 或者

并且是指两个条件都成立时为真,或者是指只要有一个条件成立时为真.

例1:

a=7;

if((a〉5)&&(a<10)){

trace(\"正确\");

}

测试影片,将输出\"正确\".因为a=7的确即大于5又小于10,条件为真.

例2:

a=7;

if((a〉5)&&(a〉10)){

trace(\"正确\");

}

测试影片,没有输出.说明 trace(\"正确\");这句没执行.因为a〉5成立,而a〉10不成立,两个条件只有一个为真,整个条件则为假.

例3.

a=7;

if((a〉5)||(a〉10)){

trace(\"正确\");

}

这个例子用的是\"||\"或者语句,只要有一个条件为真,整个条件表达式为真,测试影片,将输出\"正确\".

练习:猜数游戏

下面我们来做一个练习,猜数游戏,将上一节运算符及本节条件语句进行综合应用.游戏是由程序产生一个0-100的随机数,然后由用户来猜,程序根据用户猜的数与所产生的随机数进行比较,根据比较结果,给用户提示,直到用户猜中为止,并记录用户所猜次数.

为完成这个练习,我们先介绍一个函数:random(),这个函数将产生一个由0到括号中的数减1的整数.如: a=random(50),那么a的值为0到49之间的一个整数.

现在来做这个练习:新建一flash文件,用文本工具在舞台的上半部居中画一个文本框,在里面输入:”请猜一个0-100之间的数字:”;打开属性面板,设置文本框为静态文本,设置好文本字体的大小和颜色.

在这个文本框的下边,再画一个文本框,打开属性面板,设置文本框为动态文本,在变量框中输入c,这样变量c就代表这个文本框的内容,我们就可以用c来读取和设置这个动态文本框的内容.动态文框是在运行时可以给文本设置值的文本框.关于文本框的的知识,在后面将有专门的课程介绍,这里了解这么多就行了.

在动态文本框的下面,再画一个文本框,打开属性面板,设置文本框为输入文本.将在文本框周围显示边框按钮点下.在变量框中输入s.输入文本框是在运行时,用户可以在其中输入内容人.

下面新建两个按钮,一个标签为”确定”,一个标签为”重猜”.按钮的做法请参阅第二课.将两个按钮放到舞台上,最下面.打开属性面板,”确定”按钮命名为”qd_btn”,”重猜”按钮”命名为”cc_btn”.

新建一层,命名为”action”用来写代码.点中第一帧,点右键,打开动作面板,开始写代码:

首先声明一个变量,用来存放0-100间的随机数,所以第一行代码为:

var a = random(101);

然后声明一个变量,用来存放猜的次数,现在还没猜,所以给它赋值为0,第二行代码为:

var cs:Number = 0;

下面使用条件语句,来比较用户输入的数的产生的随机数:

qd_btn.onRelease = function(){ //当点击确定按钮时,执行下面的语句. cs++; //猜的次数增加1

if (s>a){ //如果猜的数大于随机数.

c = \"大了点\"; //动态文本框提示”大了点”.

} else if (s==a){ //如果猜对了,根据猜的次数给出相应结果.

if(cs<=5){ //如果猜的次数在5次以内

c = \"哇,你只猜了\" + cs + \"次就猜对了,真历害!\"; //给出表扬,注意这里用到了,字符串的连接.

} else { // 如果不只猜5次.

c=\"猜对了!你猜了\"+cs+\"次\"; //提示猜对了,并给出猜的次数.

}

} else if (sc=\"小了点\";//提示”小了点” }

}

最后,来写重猜的代码:

cc_btn.onRelease = function () { //当点击重猜按钮时执行以下语句

a = random(101);//重新产生随机数

cs = 0;//将猜的次数设为0

s=\"\";清空输入文本框

c=\"\";清空提示文本 }

作业:制作猜数游戏 for循环:格式:

for(初值;条件表达式;增值){

要执行的语句

}

这个语句,首先给一个变量设定一个初始值,然后将这个初始值带入条件表达式,如果条件表达式为真,则执行大括号中的语句,并且按括号中增值表达式对变量的值进行增减;然后再次带入条件表达式,如果为真则再次执行大括号中的语句.„,这样直到条件表达式为假为止.

例:var a=0;

for(var i=0;i〈10;i++){

a += i; }

trace(a);

我们来看看最后输出的a是多少.程序开始时,a等于0,然后进入for循环,循环开始i等于0,条件表达式i<10成立,那么执行a+=i,此时a、 i均为0,那么a为0,然后执行增值i++,则i为1,再检测条件表达式i〈10仍成立,执行a+=i,则a为1;执行i++,i为2„„,这样反复循环,直到i为10时,条件表达式i〈10不成立,停止循环.明显可以看出循环进行了10次,这时a是多少呢?测试影片时输出为45

for„in循环:这是遍历或者叫循环访问一个组对象中的成员.比如影片剪辑的子级、对象的属性、数组等.由于数组等在前面还没有介绍,因此我们将for„in循环放到下一课介绍数组时再祥细介绍 while循环:有点类似if语句,只要条件成立就执行相应语句.

格式:

while(条件表达式){

要执行的语句

计数语句

}

当条件表达式为真时,执行大括号中的语句,执行计数语句,然后用计数语句的结果再次检测条件表达式,如此反复循环.直到条件表达式为假为止.这里需要注意的是,如果没有计数语句,或者计数语句的结果永远不能使条件表达式为假,那么循环将水远无休止地反复,这就形成了一个死循环,我们在编程的过程中一定要避免这种情况.

例1:下面的代码是一个死循环,请不要测试.

var a=0;

while(a<10){ trace(a);

}

看看这段代码,程序执行时a等于0,然后进入循环,条件表达式a〈10成立,执行trace(a),输出0,然后再检查条件表达式,因为没有计数语句,a没发生变化,条件表达式仍成立,于是又输出一个0,然后又反复,一直不停地输出0,无休无止,直到天荒地老.

例2:下面的代码是一个死循环,请不要测试. var a=0;

while(a<10){

trace(a); a--;

}

这一例加上了计数语句a--,但a的初始值为0,每一个循环它减1,这样条件表达式a<10也是永远为真,因此循环也是永不停息,直到地老天荒. 例3: var a=0;

while(a<10){ trace(a);

a++;

}

这一例将计数语句改为a++,这样每一循环,a加1,当10个循环后,a为10,条件表达式a<10为假,循环停止.测试本例我们会在输出面板中看到: 0 1 2 „ 9

do„while循环:这个循环实际和while循环是一样的,只是它先执行一次语句,然后再检测条件语句,而while循环是先检测条件语句再执行大括号内的语句.

do„while循环的格式为:

do{

要执行的语句

计数语句

}while(条件表达式);

Flash as入门(5):学习AS数组

--------------------------------------------------------------------------------

日期:2009-02-19 16 作者: 来源:

本例继续讲解AS的基础知识,今天讲解的是AS入门第五课:数组。

在前面介绍变量时,我们说将内存分成无数个房间,用来存放数据.每个房间中只能住一个数据,比如房间中原来住着5,后来8又住进这个房间,于是一脚将5踢了出去.现在可能有这种情况,就是8住进来后,不把5踢出去,两个合租.事实上这也是允许的,这种情况就被称为数组.在房间中的各个成员被称为元素, 这一些元素的数据类型不一定是相同的.也就是说在现在开放的年代,男女合租是允许的.比如在房间中又住进去a,它是字符与前面的5、8数字的数据类型就不相同.房间中每个元素都有一个编号,我们在引用这些元素时,只需用编号就行.就如在监狱中的囚犯一样,你叫道:3365出来.于是号数为3365的囚犯出来了.咋一不小心就将数组中的元素整进监狱了呢?需要注意的是,数组中的元素编号是从0开始的.比如上面我们建的数组,5是0号、8是1号、a是2号.

创建数组:可以用下列格式创建数组

格式一:

var

数组名:Array=new Array(元素1,元素2,„„)

格式二: var

数组名:Array=new Array();

数组名[0]=值;

数组名[1]=值; „

例:我们上面建的数组,这样写

var myarray:Array=new Array(5,8,a); 或:

var myarray:Array=new Array();

myarray[0]=5;

myarray[1]=8;

myarray[2]=\"a\";

数组元素的引用 创建数组后,就可以引用其元素了,格式为:

数组名称[元素编号];

比如要引用上述数组第一个元素的值就可以这样写: myarray[0]

可以测试一下下面这段代码:

var myarray:Array=new Array(5,8,a);

var b=myarray[0];

trace(b);

输出应该是5.

数组是对象,即是对象,那么就有它自已的属性和方法,下面我们就来认识一下:

数组的属性:只介绍一个属性, length:这是指组数的元素的数量.如上面的数组,myarray一共有三个元素5,8,a,那么这个数组的length属性为3

例1: var myarray:Array=new Array(5,8,a);

b = myarray.length;

trace(b);

输出结果为3. For....in循环:在上一课介绍循环语句时,说过for....in循环留到这一课来介绍.这个循环是遍历一个集合的所

有对象的循环,比如遍历数组元素.就是说一个一个地方问每一个元素.数组中有几个元素它就循环几次

例2: var myarray:Array=new Array(5,8,\"a\");

for (var i in myarray){

b = myarray; trace(b); }

输出结果为:a 8

5

例3:用for循环和length属性也可以实现遍历数组:

var myarray:Array=new Array(5,8,\"a\")

for(var i=0;ib = myarray;

trace(b); }

输出结果为:5,8,a

可以看出,这两个循环都是将数组中的循环方问了一遍,只是结果的顺序不同.例2中应用了数组的length属性,这个属性最常用的就是用在for循环中,在以后的课程中会经常用到.

数组的方法:

concat( ):

将参数中指定的元素与数组中的元素连接,并创建新的数组。如果 value 参数指定的是数组,则连接该数组的元素而不是数组本身。

例4: var myarray:Array=new Array(5,8,\"a\") myarray1 = myarray.concat(\"b\");

for(var i in myarray1){

c = myarray1;

trace(c);

}

输出为:b a 8

5

用myarray1 = myarray.concat(\"b\");将b连接到myarray数组中并创建新数组myarray1. 例5: var myarray:Array=new Array(5,8,\"a\")

myarray1 = myarray.concat(\"b\");

myarray2 = myarray.concat(myarray1);

for(var i in myarray2){

c = myarray1;

trace(c);

}

这时myarray2应该是:myarray2[5,8,a,5,8,a,b],这是用concat()方法将两个数组连接起来了.

join( ): 将数组中的元素转换为字符串、在元素间插入括号中指定的分隔符、连接这些元素然后返回结果字符串。如果括号中没有指定分隔符,那么分隔符将用逗号. 例6: var myarray:Array=new Array(5,8,\"a\");

c = myarray.join(“-“);

trace(c);

输出为:5-8-a

例7:在括号中不设分隔符则将用逗号作分隔符

var myarray:Array=new Array(5,8,\"a\");

c = myarray.join( );

trace(c); 输出为:5,8,a

pop():删除数组中最后一个元素,并返回该元素的值。 例7: var myarray:Array=new Array(5,8,\"a\");

var c = myarray.pop();

trace(“被删的是:” + c);

trace(“被删后的数组:” + myarray); 输出结果是: 被删的是:a 被删后的数组:5,8

push():将一个或多个元素添加到数组的结尾,并返回该数组的新长度。 例8: var myarray:Array=new Array(5,8,\"a\");

var c = myarray.push(“b”,”c”);

trace(“添加元素后数组的长度是:”+c);

trace(“添加元素后的数组:”+myarray); 输出结果是:

添加元素后数组的长度是:5 添加元素后的数组:5,8,a,b,c

reverse():就地倒转数组。

例9: var myarray:Array=new Array(5,8,\"a\");

trace(原数组是:+myarray);

myarray.reverse();

trace(被倒转后的数组是:+myarray); 输出结果是: 原数组是:5,8,a

被倒转后的数组是:a,8,5

shift():删除数组中第一个元素,并返回该元素。

参见pop()方法

slice(startIndex, endIndex):

返回由原始数组中某一范围的元素构成的新数组,而不修改原始数组。返回的数组包括 startIndex 元素以及从其开始到 endIndex

元素(但不包括该元素)的所有元素。例10: var myarray:Array=new Array(1,2,3,4,5); var myarray1:Array = myarray.slice(0,3); trace(myarray1);输出结果是:1,2,3sort():

对数组中的元素进行排序。Flash 根据 Unicode 值排序。(ASCII 是 Unicode 的一个子集。) 默认情况下,Array. sort()

按下面的列表中的说明进行排序:

* 排序区分大小写(Z 优先于 a)。

* 按升序排序(a

优先于 b)。

* 修改该数组以反映排序顺序;在排序后的数组中不按任何特定顺序连续放置具有相同排序字段的多个元素。

* 数值字段按字符串方式进行排序,因此 100 优先于 99,因为 \"1\" 的字符串值比 \"9\" 的低。

例11: var myarray:Array=new Array(3,4,1,2,5);

myarray.sort();

trace(myarray);输出为:1,2,3,4,5 对数组进行了重新排序. splice(startIndex, [deleteCount], [value]):

给数组添加元素以及从数组中删除元素。此方法会修改数组但不制作副本。

参数startIndex:― 一个整数,它指定插入或删除动作开始处的数组中元素的索引。您可以指定一个负整数来指定相对于数组结尾的位置(例如,-1 是数组的最后一个元素)。

deleteCount: [可选] ― 一个整数,它指定要删除的元素数量。该数量包括 startIndex 参数中指定的元素。如果没有为 deleteCount

参数指定值,则该方法将删除从 startIndex

元素到数组中最后一个元素之间的所有值。如果该参数的值为 0,则不删除任何元素。

value: [可选] ― 指定要在 startIndex 参数中指定的插入点处插入到数组中的值。

例12:var myarray:Array=new Array(1,2,3,4,5);

myarray.splice(1);

trace(myarray);

输出结果为:1.本例在splice()方法中只用了一个参数1,这是指在插入或删除的位置,数组编号从0开始,那么1的位置是第2个元素.第二参数未设置则将删除从第2个元素开始的所有元素.第三个参数未设置则不插入新元素.所以执行后数组中就只剩下第0号元素了. 例13: var myarray:Array=new Array(1,2,3,4,5);

myarray.splice(1,2);

trace(myarray); 输出结果是:1,4,5

本例用了两个参数,第2个参数是2,就是说将删除2个元素. 例14: var myarray:Array=new Array(1,2,3,4,5);

myarray.splice(5,0,6);

trace(myarray);

输出结果是:1,2,3,4,5,6

本例用了三个参数,第一个参数为5,则是在数组的第6个位置上执行操作,第二个参数是是0,是不删除任何元素.第三个参数是6,是插入一个新元素6.

unshift():将一个或多个元素添加到数组的开头,并返回该数组的新长度 参见push()方法

Flash as入门(6):文本与字符串

--------------------------------------------------------------------------------

日期:2009-02-20 16 作者: 来源:

本例继续讲解AS的基础知识,今天讲解的是AS入门第六课文本与字符。

文本与字符串

在制作flash动画时,常常会用到文本和字符串,首先来看看文本.

一 创建文本框

在创作环境中创建文本框

在创作环境中创建文本框很简单,新建一flash文件,用文本工具在舞台上画一个文本框,这样文本框就建好了.文本框建好后,需要进行设置.现在打开属性面板.首先要确定文本框的类型,点开类型下拉列表可以看到共有三种文本框类型可供选择:静态文本、动态文本、输入文本.静态文本相当于标签,在AS中不能进行操作,本课程不介绍.以下文本框均是指动态文本和输入文本.动态文本和输入文本可在运行时进行操作.动态文本是运行时动态改变文本问容;输入文本是在运行时可由用户输入文本内容.为了在AS中对其进行操作应在属性面板中为其命名.有两种方法可以读取和设置文本框的内容,一种方法是设置或读取文本框的text属性.text属性代表文本框的内容.

例:在舞台上画一文本框,设置其类型为动态文本,为其取名为mytext1_txt.然后在帧动作面板中输入:

mytext1_txt.text=\"动态文本框\"

测试影片,文本框中将显示\"动态文本框\".

在属性面板中,还可以设置大小、位置、字体、字体大小、颜色、边框等属性.

设置和读取文本内容的另一个方法是给文本框设置变量.这种方法现在不推荐使用,而主张使用text属性.在属性面板的右下部有一\"变量\"文本框,在这里可以为文本框设一变量,那么这一变量就代表文本框的内容.例我们在这里输入a,然后将帧动作中的代码改为:

a=\"动态文本框\"

测试影片,文本框中同样显示\"动态文本框\". 运行时创建文本框

运用TextField类的createTextField()方法可以在运行时创建文本框.格式为:

createTextField(名称,深度,x坐标,y坐标,宽度,高度)

深度:相当于层的概念,深度数字越大就越在上面.同一深度只能包含一个对象,如果在同一深度添加新的对象,那么新的对象会覆盖同一深度上原来的对象.关于深度的详细内容将在影片剪辑课程中介绍. x、y:创建的文本框的注册点,注册点位于文本框的左上角. 例:新建一flash文件,打开帧动作面板,输入:

This.createTextField(\"my_txt\

my_txt.border=true;

my_txt.text=\"动态创建的文本框\";

测试影片,将看到一个文本框,文本内容是:\"动态创建的文本框\". 本例动态创建了一个文本框,然后设置了文本框的两个属性: border:设置文本框是否有边框 text:设置文本框的内容.

文本框还有很多属性,将在后续章节介绍. 删除文本框:

对于用createTextField()创建的文本框可以用removeTextField()方法来删除.

例:在舞台上放一按钮,并为其命名为:del_btn. 然后在帧动作面板中输入:

This.createTextField(\"my_txt\ my_txt.border=true;

my_txt.text=\"动态创建的文本框\"; del_btn.onRelease=function(){

my_txt.removeTextField();

}

测试影片,将看到一个文本框,文本内容是:\"动态创建的文本框\".点击按钮时,文本框被删除

练习:算术练习器

本练习由程序出100以内的加减乘除题,由用户计算,再由程序判定计算是否正确.通过本练习可以实践各种文本框的应用,同时也可对前面各课介绍的基础知识进行综合应用,如函数,条件语句,数组,运算符等.下面来制作这个练习器:

新建一flash文档:

1.用文本工具在舞台上方居中画一文本框,打开属性面板,选择静态文本,设置好字体、大小、颜色等属性.在文本框中输入:\"算术练习器\".

2.在稍下面一点再画一个文本框,类型为动态文本,设置其它属性.不要边框.该文本框用于显示算术题目,文字较多,且要显示两行,所以请选择\"多行\".将该文本框命名为:tm_txt.

3.在下面再画一文本框,类型为输入文本.命名为da_txt.该文本用于用户输入答案.设置其它属性.点下边框按钮.需要注意的是,在属性面板右下角,有一\"自动调整字距\"选项框,切莫打钩.因为该文本框中输入的内容为数字,此项打钩后文本内容将变为字符,那么将会导至后续程序失败.所以请记住凡是需要参加计算的数字文

本不能选择此项.

4.新建两个按钮元件,标签分别为:\"确定\"、\"下一题\将两个按钮放到舞台下方,注意应与第三个文本框之间间隔一定距离,因为我们还要在运行时创建一个文本框用于显示答题的结果.打开属性面板,将两个按钮分别命名为:qd_btn、xyt_btn.

5.好了现在开始写代码:新建一层,命名为:action,打开帧动作面板 首先声明三个变量用来存放两个参与计算的数字及答案.

var a:Number;

var b:Number;

var jg:Number;

下面开始出题,程序刚打开时首先应出好题目,做完一道题点击下一题时又要出一次题目,这就是说出题的代码将重复使用,请养成良好的习惯,将要重复使用的代码做成函数,以免重复输代码.我们也借此练习一下函数的声明及调用.接着写代码:

function ct(){ //声明了一个叫ct的函数

a=random(99)+1;//加1就避免了算数出现0的情况.

b=random(99)+1;

var ysfz:Array=new Array(\"+\声明了一个数组用于存放运算符.

var ysfs =random(4);//产生一个0一3的随机数用于提取数组ysfz中的运算符.

var ysf=ysfz[ysfs];//提取了运算符.

tm_txt.text=\"请计算:\"+a+ysf+b+newline+\"除法请去掉余数\";//通过动态文本框将题目显示出来

switch(ysfs){ //用一个条件语句计算结果 case 0: jg=a+b; break;

case 1:

jg=a-b;

break;

case 2:

jg=a*b;

break;

case 3:

jg=int(a/b); break; } }

ct();//调用ct()函数,题就出好了.

接下来是点击”确定”按钮时,判断用户是否回答正确,并给出结论:

qd_btn.onRelease = function(){

createTextField(\"jg_txt\在运行时创建了一个文本框,这里文本框的坐标就根据实际位置确定.

if(da_txt.text ==jg){ //如果用户在输入文本中输入的数字等于题的结果

jg_txt.text = \"回答正确\";//创建的文本框显示”回答正确”

} else { //否则

jg_txt.text = \"回答不正确\";//创建的文本框显示”回答不正确” }

}

最后是点击”下一题”按钮时,重新出题,输入文本框清空,删除运行时创建的文本: xyt_btn.onRelease=function(){

da_txt.text=\"\";//清空输入文本

jg_txt.removeTextField();//删除运行时创建的文本

ct();//调用ct()函数重新出题. }

作业:制作算术练习器

文本框与字符

二. 文本框的属性

上一节我们介绍了创建文本框,文本框创建后我们通过其属性和方法可以对文本框进行操作,本节将介绍文本框的属性设置

属性:

antiAliasType:用于此 TextField

实例的消除锯齿类型。它有两个值:

\"normal\":应用常规文本消除锯齿。

\"advanced\":应用高级消除锯齿将增加文本的可读性。(此功能从 Flash Player 8 起可用)。高级消除锯齿可以高品质地呈现小尺寸的字体。它最适合具有大量小字号文本的应用程序。建议不要对大于 48 磅的字体使用高级消除锯齿。

设置本属将使用消除锯齿的文本,它将使文本字段有更好的更清晰的显示效果,但所产生的swf文件较大。使用设备字体是指使用用户计算机上已安装的字体,它产生的swf文件最小,而将此属性设为:\"advanced\"时,产生的swf文件最大。如果制作有大量文本字的swf文件时,要控制文件的大小,请考量此项如何设置更好。

例:this. createTextField(\"mytext_txt\ mytext_txt.text = \"这是消除锯齿的文本\";

mytext_txt.antiAliasType = \"advanced\"

this. createTextField(\"mytext1_txt\ mytext1_txt.text = \"这是没有消除锯齿的文本\";

测试影片,两个文本效果差不多哈

autoSize:文本的自动大小缩放和对齐方式,可设为以下几个值:

\"none\"或false:不自动缩放.

\"left\"

或 true,左边固定向右边缩放.

\"right\",右边固定向左边缩放.

\"center\",中间固定向两边缩放

Background:

指定文本字段是否具有背景填充。如果为 true,则文本字段具有背景填充。如果为 false,则文本字段没有背景填充。

backgroundColor:

文本字段背景的颜色。默认值是 0xFFFFFF(白色)。只有当文本字段有边框时,背景颜色才可见。

border:

指定文本字段是否具有边框。如果为 true,则文本字段具有边框。如果为 false,则文本字段没有边框。

borderColor:

文本字段边框的颜色。默认值是 0x000000(黑色)。

例:

this. createTextField(\"mytext_txt\

mytext_txt.text = \"本例创建了一个文本框:\"+\"r\"+\"运用上面个绍的属性,对文本框外观进行设置\"; mytext_txt.autoSize = \"center\" //文本框中间固定,向两边缩放. mytext_txt.background = true;//文本框有背景

mytext_txt.backgroundColor=0xff0000;//文本框背景为红色 mytext_txt.border = true;//文本框有边框

mytext_txt.borderColor=0x1111d5;//文本框边框为蓝色

测试影片,结果为:

注:文本中”r”为换行的意思

embedFonts:

指定是否使用嵌入字体轮廓进行呈现。一个布尔值,当它为 true

时,使用嵌入字体轮廓呈现文本字段。如果为 false,则使用设备字体呈现文本字段。 如果将文本字段的 embedFonts

设置为 true,则必须通过应用于该文本字段的 TextFormat

对象的 font

属性,指定该文本的字体。如果库中不存在指定的字体(具有对应的链接实例名称),则将不显示文本。

注:TextFormat对象将在后面介绍

_height:文本框的高度

_width:文本框的宽度

multiline:

表示文本字段是否为多行文本字段。如果值为 true,则文本字段为多行文本字段;如果值为 false,则文本字段为单行文本字段。

_name:文本字段的实例名称。

length:表示文本字段中的字符数

password:

指定文本字段是否是密码文本字段。如果 password 的值为 true,则文本字段为密码文本字段,并使用星号替代实际字符来隐藏输入的字符。如果为 false,则文本字段不是密码文本字段。启用密码模式时,剪切和复制命令及其相应的键盘快捷方式不起作用。此安全机制可防止不良用户使用快捷键在无人看管的计算机上破译密码。

例:

this. createTextField(\"mytext_txt\ mytext_txt.text = \"12345\"; mytext_txt.border = true; mytext_txt.password = true; 测试影片,结果为:

文本框中只有星号,无法看到文本内容

_rotation:

文本字段距其原始方向的旋转程度. 使用设备字体的文本字段不支持旋转值。您必须使用嵌入字体才能对文本字段使用 _rotation

selectable:

一个布尔值,表示文本字段是否可选。值 true 表示文本可选。selectable

属性控制文本字段是否可选,而不控制文本字段是否可编辑。动态文本字段即使不可编辑,它也可能是可选的。如果动态文本字段是不可选的,则您不能选择其中的文本。

如果 selectable 设置为 false,则文本字段中的文本不响应来自鼠标或键盘的\"选择\"命令,并且不能使用\"复制\"命令复制文本。如果 selectable 设置为 true,则可以使用鼠标或键盘选择该文本字段中的文本。即使文本字段是动态文本字段而不是输入文本字段,您也可以用这种方式选择文本。可以使用\"复制\"命令复制文本。

例:

this.createTextField(\"mytext_txt\ this.createTextField(\"mytext1_txt\ mytext_txt.border = true;

mytext1_txt.border = true; mytext1_txt.selectable=false;

mytext_txt.text=\"这个文本内容可选\"; mytext1_txt.text = \"这个文本内容不可选\"

测试影片,出现两个文本框,一个文本框的内容可以拉黑(可选),点右键有复制菜单项.而另一个则不能被拉黑,没有右键菜单项

text:

表示文本字段中的当前文本。行用回车符(\"r\",即 ASCII 13)分隔。

textColor:

表示文本字段中文本的颜色。

例:

this.createTextField(\"mytext_txt\ mytext_txt.border = true;

mytext_txt.textColor=0xff0000;

mytext_txt.text=\"这个文本是红色的\";

textHeight:

指示文本的高度,以像素为单位

textWidth:

指示文本的宽度,以像素为单位

type:

指定文本字段的类型。共有两个值:\"dynamic\"(指定用户无法编辑的动态文本字段)和 \"input\"(指定输入文本字段)。

_visible:

一个布尔值,表示文本字段是否可见。禁用不可见的文本字段(_visible 属性设置为 false)。

wordWrap:

一个布尔值,表示文本字段是否自动换行。如果 wordWrap 的值为 true,则该文本字段自动换行;如果值为 false,则该文本字段不自动换行

_x:

一个整数,用来设置文本字段相对于父级影片剪辑的本地坐标的 x 坐标.注册点在左上角

_y:

文本字段相对于父级影片剪辑的本地坐标的 y 坐标。注册点在左上角

_xscale:

确定从文本字段注册点开始应用的文本字段的水平缩放比例,以百分比表示

_yscale:

从文本字段的注册点开始应用的文本字段的垂直缩放比例,以百分比表示

关于文本滚动的属性设置:

hscroll:表示当前水平滚动位置。如果 hscroll

属性为 0,则不能水平滚动文本

水平滚动的单位是像素,而垂直滚动的单位是行。水平滚动以像素计量是因为您通常使用的多数字体都是按比例隔开的;这意味着字符可以有不同的宽度。Flash 按行执行垂直滚动是因为用户通常希望看到一整行文本,而不是一行的局部。即使一行上有多种字体,行的高度也会调整到与使用的最大字体相适合。

maxhscroll:表示 TextField.hscroll 的最大值

例:

this.createTextField(\"mytext_txt\ mytext_txt.autoSize=false;

mytext_txt.text=\"这是一个滚动文本的效果,我们可以看到文本在滚动.\"; onEnterFrame = function() {

if(mytext_txt.hscroll < mytext_txt.maxhscroll){

mytext_txt.hscroll ++;

}else {

mytext_txt.hscroll =1;

} }

测试影片,你将看到一个滚动文本。代码中用了一个onEnterFrame事件,这是每运行一帧就执行一次,这样就形成了一个无限的循环。

scroll:

文本在文本字段中的垂直位置。scroll 属性可用于将用户定向到长篇文章的特定段落,还可用于创建滚动文本字段。可以检索和修改此属性。水平滚动的单位是像素,而垂直滚动的单位是行。

maxscroll:

表示 TextField.scroll 的最大值。

参考上例可以做出垂直方向滚动的文本。但却不能用onEnterFrame事件,为什么呢?因为scroll属性是以行为单位,如果每帧跳一行的话,那就太快了。你可以放一个按钮,让每点一次按钮,文本向上滚动行。这个留给大家自已练习吧。可以实现自动滚动吗?当然可以,留到本节课后练习来说。

TextFormat类:

上面主要介绍了文本框的的一些属性,而文本内容的属性比如字体,颜色,对齐方式等就要借助TextFormat类来实现。使用 TextFormat 类可以为文本字段创建特定的文本格式。您可以将文本格式应用于静态文本字段和动态文本字段。必须使用构造函数 new TextFormat()

创建 TextFormat 对象,然后设置其属性,再用文本框的setTextFormat()方法来使用这些属性。

1.创建TextFormat对象:

var myformat:TextFormat = new TextFormat();这就创建了一个叫myformat的TextFormat对象。

2.设置TextFormat对象的属性:

myformat.bold = true;设置了myformat的bold(粗体字)属性.

3.文本框调用setTextFormat()方法:

mytext_txt. setTextFormat(myformat);这样文本框就调用了myformat中的属性设置,即文本框的内容将以粗体字显示。

例:

var myformat:TextFormat = new TextFormat();

myyformat.bold=true;this.createTextField\"mytext_txt\ mytext_txt.autoSize=true;mytext_txt.text=\"设置了粗体\"; mytext_txt.setTextFormat(myformat);

测试影片,可以看到文本框中的文字是粗体的。 TextFormat对象的属性:

align:指示段落的对齐方式的字符串。您可以将此属性应用于静态文本和动态文本。下面的列表显示此属性的可能值:

* \"left\" -- 段落为左对齐。 * \"center\" -- 段落居中。 * \"right\" -- 段落为右对齐。

* \"justify\" -- 段落为两端对齐。(Flash Player 8 中添加了此值。)

默认值是 null,它指示该属性未定义。

blockIndent:

以磅为单位指示块缩进的数字。块缩进应用于整个文本块,即文本的所有行。而普通缩进 (TextFormat.indent) 只影响各段的第一行。如果此属性为 null,则 TextFormat 对象不指定块缩进。

bold:

一个布尔值,指示文本是否为粗体字。默认值是 null,它指示该属性未定义。如果值为 true,则文本为粗体字。

color:指示文本的颜色。

font:

使用此文本格式的文本的字体名称,以字符串形式表示。

indent:

指示从左边距到段落中第一个字符的缩进的整数。正值指示普通缩进。您可以使用负值,但只可在左边距大于 0 时进行负缩进。若要将边距设置为大于 0,请使用 indent 属性或 TextFormat 对象的 blockIndent 属性。默认值是 null,它指示该属性未定义。

italic一个布尔值,指示使用此文本格式的文本是否为斜体

leading:一个整数,表示以像素为单位的行间垂直距离(称为\"行距\")。

leftMargin:段落的左边距,以磅为单位

letterSpacing:字间距

rightMargin:段落的右边距,以磅为单位。

size:文字的大小

underline:一个布尔值,指示使用此文本格式的文本有下划线 (true) 还是没有下划线 (false)

下面我们来做个练习:滚动文本的制作

新建一flash文档,导入一图片,用为背影,居中放好

新插入一层,命名为action.开始写代码:

1、横向滚动:

首先创建一个TextFormat对象,然后设置文本框要用到的属性.

创建文本框,并设置其autoSize属性为false,不让其缩放大小.设置文本框的text属性,前后输入一定数量空格,以避免滚动时出现不连惯.

用onEnterFrame事件实现滚动,方法参见上面例句

2、纵向滚动:

首先创建一个TextFormat对象,然后设置文本框要用到的属性.

创建文本框,并设置其autoSize属性为false,不让其缩放大小.设置文本框的text属性,第一行前和最后一行后,插入一定数量”r”,以避免滚动时出现不连惯.

创建一函数,使文本滚动,方法参考横向滚动

用:

var 随便取个变量名 = setInterval(刚建的函数名,1000);

实现滚动.这一句的意思是每隔1000毫秒调用一次函数,后面课程将详细介绍

3、3D字效果

原理是创建两个文本框,内容相同,字的颜色不同,文本框的位置略微错开2个象素左右.

作业:制作滚动文本

附完整代码:

建议大家自已完成本练习,不要看这个代码,实在有困难时,只可参考这个代码.坚决反对直接复制本代码,那样就没意思了,对你学习AS一点好处都没有. var myformat:TextFormat = new TextFormat(); myformat.bold = true; myformat.size = 30;

myformat.color = 0xff0000;

this.createTextField(\"mytext_txt\ mytext_txt.autoSize=false; mytext_txt.text=\"

在花好月圆之夜,祝各位坛友中秋快乐! \";

mytext_txt.setTextFormat(myformat); onEnterFrame = function(){

if(mytext_txt.hscrollmytext_txt.hscroll ++; } else {

mytext_txt.hscroll =1;

} }

var myformat1:TextFormat = new TextFormat(); myformat1.size = 18;

myformat1.color = 0xf4f44f;

this.createTextField(\"mytext1_txt\ mytext1_txt.autoSize=false;

mytext1_txt.text=\"r\"+\"r\"+\"r\"+\"r\"+\"r\"+\"r\"+\"明月几时有?\"+\"r\"+\"把酒问青天\"+\"r\"+\"不知天上宫阙,\"+\"r\"+\"今昔是何年\";

mytext1_txt.text +=\"r\"+\"我欲乘风归去,\"+\"r\"+\"又恐琼楼玉宇,\"+\"r\"+\"高处不胜寒。\"+\"r\"+\"起舞弄清影,\"+\"r\"+\"何似在人间.\";

mytext1_txt.text +=\"r\"+\"r\"+\"转诸阁,\"+\"r\"+\"低倚户,\"+\"r\"+\"照无眠.\"+\"r\"+\"不应有恨,\"+\"r\"+\"何事长向别时圆.\";

mytext1_txt.text +=\"r\"+\"人生悲欢离合,\"+\"r\"+\"月有阴晴圆缺,\"+\"r\"+\"此事古难全.\"+\"r\"+\"但愿人长久,\"+\"r\"+\"千里共婵娟.\"

mytext1_txt.text +=\"r\"+\"r\"+\"r\"+\"r\"+\"r\"+\"r\"+\"r\"+\"r\" mytext1_txt.setTextFormat(myformat1); function gd(){

if(mytext1_txt.scrollmytext1_txt.scroll ++; } else {

mytext1_txt.scroll =1; } }

var ksgd = setInterval(gd,1000);

var myformat2:TextFormat = new TextFormat(); myformat2.bold = true;

myformat2.size = 30;

myformat2.color = 0x988E81;

this.createTextField(\"mytext2_txt\3,200,300,200,50); mytext2_txt.autoSize=\"center\";

mytext2_txt.text=\"花好月圆贺中秋\"; mytext2_txt.setTextFormat(myformat2);

var myformat3:TextFormat = new TextFormat(); myformat3.bold = true; myformat3.size = 30;

myformat3.color = 0x430FBD;

this.createTextField(\"mytext3_txt\ mytext3_txt.autoSize=\"center\";

mytext3_txt.text=\"花好月圆贺中秋\"; mytext3_txt.setTextFormat(myformat3); 文本框的事件

onChanged事件:在文本字段的内容发生更改时调用。在文本框中的内容发生改变时就会触发。比如在输入文本中输入或删除一个字符时都会触发这个事件。

例:this.createTextField(\"mytext_txt\ this.createTextField(\"myinputtext_txt\ myinputtext_txt.autoSize = false; myinputtext_txt.border = true;

myinputtext_txt.type = \"input\";

var myformat:TextFormat = new TextFormat(); myformat.bold=true; myformat.color=0xff0000; myformat.size=26; mytext_txt.autoSize=true; mytext_txt.wordWrap=true;

myinputtext_txt.onChanged = function(){

mytext_txt.text = myinputtext_txt.text;

mytext_txt.setTextFormat(myformat);

}

这个例子,创建了两个文本框,其中一个是输入文本。分别设置了属性。然后用onChanged事件,在输入框中输入文本的同时,文本显示在别一文本框中。每输入一个字,输入文本内容就发生了改变,从而触发了onChanged事件,而执行将文本显示在另一文本框中的任务。

onKillFocus 事件:在文本字段失去键盘焦点时调用。文本框的焦点,就是说光标。当文本框失去光标时,就会触发onKillFocus事件。

例:this.createTextField(\"mytext_txt\ this.createTextField(\"myinputtext_txt\ myinputtext_txt.autoSize = false; myinputtext_txt.border = true; myinputtext_txt.type = \"input\";

var myformat:TextFormat = new TextFormat(); myformat.bold=true; myformat.color=0xff0000; myformat.size=26;

mytext_txt.autoSize=true; mytext_txt.wordWrap=true;

myinputtext_txt.onChanged = function(){

mytext_txt.text = myinputtext_txt.text;

mytext_txt.setTextFormat(myformat); }

myinputtext_txt.onKillFocus = function(){

trace(\"输入框已失去光标,无法继续输入.\");

}

本例还是上例的代码只是在后加了一个onKillFocus事件函数。运行时在输入框中输几个字后,点击显示文本的的文本框,这时输入文本将失去焦点,从而解发onKillFocus事件。出现失去光标的提示。

onScroller 事件:在某一个文本字段的 scroll 属性发生更改时调用。TextField.onScroller事件处理函数通常用于实现滚动条。滚动条通常有一个缩略图或其它指示器,显示文本字段中的当前水平或垂直滚动位置。使用鼠标和键盘可以浏览文本字段,这会导致滚动位置发生更改。如果由于用户交互而导致滚动条位置发生更改,滚动条代码需要获得通知,这就是使用 TextField.onScroller的目的。

onSetFocus 事件:在文本字段接收键盘焦点时调用。 文本框的方法

getFontList() 方法:以数组的形式返回播放器的主机系统上的字体名称。(此方法不返回当前加载的 SWF 文件中所有字体的名称。)这些名称的类型为 String。此方法是全局 TextField 类的静态方法。在调用此方法时,不能指定文本字段实例。

var font:Array = new Array(); font = TextField.getFontList();

trace(font);

测试影片,你将看到,你的windows目录下fonts文件夹中的文件名称给列出来了。

getDepth() 方法:返回文本字段的深度。

getNewTextFormat()方法:返回一个 TextFormat 对象,该对象包含文本字段的文本格式对象的一个副本。

getTextFormat()方法:返回一个字符、一段字符或整个 TextField 对象的 TextFormat 对象。

用法:my_textField.getTextFormat():返回一个 TextFormat 对象,该对象包含文本字段中所有文本的格式设置信息。

my_textField.getTextFormat(开始处):返回一个 TextFormat 对象,该对象包含 开始处到结束时文本字段的文本格式的一个副本。

my_textField.getTextFormat(开始处,结束处):返回一个TextFormat对象,该对象包含从 开始处 到 结束处 范围内文本的格式设置信息。

removeTextField()方法:删除文本字段。只能对使用createTextField() 创建的文本字段执行此操作。

replaceSel()方法:使用新的字符替换当前所选内容。使用当前默认字符格式和默认段落格式,在当前所选内容的所在位置插入文本。

用法:my_textField.replaceSel(新字符);

可以使用 replaceSel()

方法插入和删除文本,而不破坏其余文本的字符和段落格式。 必须使用 Selection.setFocus() 将焦点放置在字段上才能发布此命令。

replaceText()方法:在指定的文本字段中,用新字符替换由 开始处 和 结束处 参数所指定的一段字符。

用法:my_textField.replaceSel(开始处,结束处,新字符);

setTextFormat()方法:将 textFormat 参数指定的文本格式应用于文本字段中的某些文本或全部文本。textFormat

必须是一个指定需要的文本格式更改的 TextFormat 对象

用法:setTextFormat(开始处,结束处,textFormat对象);如果没有开始处和结束处,格式将运用于整个文本。

Flash as入门(6):文本与字符串⒒

--------------------------------------------------------------------------------

日期:2009-02-21 14 作者:sanbos 来源:中国教程网

本例继续讲解AS的基础知识,今天讲解的是AS入门第六课文本与字符第四节之字符串,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

字符串是String类的一个实例。它用于操作基元字符串值类型的方法和属性。

创建字符串:在AS中可以用new来创建字符串对象:

var mystring:String = new String();

mystring = \"我创建了一个字符串\";

创建字符串后,就可以操作其方法和属性了。

length属性:字符串的字符数。因为所有字符串索引都是从零开始的,所以任何字符串 x 的最后一个字符的索引都是 x.length – 1。

例:var mystring:String = new String();

mystring = \"我创建了一个字符串\";

trace(mystring.length);

测试时,我们可以看到输出是:9。

方法:

charAt() 方法:返回字符串中括号中指定的字符。 例:var mystring:String = new String();

mystring = \"我创建了一个字符串\";

a = mystring.charAt(8);

trace(a); 输出结果为:“串”。这里可以看出,字符串中最后一个字符的索引是字符串的长度(字符数)-1。 concat()方法:这个方法可以连接两个字符串,产生一个新字符串,而原字符串不发生变化。 例:var mystring:String = new String();

mystring = \"我创建了一个字符串\";

var newstring:String = mystring.concat(\又连接了一段字符\");

trace(newstring);

输出结果:\"我创建了一个字符串,又连接了一段字符\"。 indexOf()方法:这个方法可实现一个查找功能。

indexOf(要查找的值,位置)它将从位置处搜索字符串,并返回找到的字符的位置。如果没有找到,则返回-1.如果没有指定位置,那么将从字符串开头开始查找。 例:var mystring:String = new String();

mystring = \"我创建了一个字符串\";

var a = mystring.indexOf(\"个\");

trace(a);

输出结果:5。即在字符串中找到了“个”这个字符,并返回了它的位置5,即第6个字符。

lastIndexOf()方法:这也是查找功能,但它是从右向左查找,即从后面开始向前面查找。

slice()方法:该方法将从字符串中返回一个子字符串。

slice(起始处,结束处)它将返回从起始处到结束处(但不包括该字符)的字符串。 例:var mystring:String = new String();

mystring = \"我创建了一个字符串\";

var a:String = mystring.slice(2,6);

trace(a); 测试结果:“建了一个”

split()方法:在指定的字符或字符串出现的所有位置断开 String 对象,将其拆分为子字符串,然后以数组形式返回子字符串。如果使用空字符串 (\"\") 作为分隔符,则该字符串中的每个字符都将作为一个元素放入到数组中。

格式:split(分隔符,[个数]).个数是可选的,指返回的元素的个数。 例:var mystring:String = new String();

mystring = \"我创建了一个字符串\";

var a:Array= mystring.split(\"一\");

trace(a);

测试结果:我创建了,个字符串 例:var mystring:String = new String();

mystring = \"我创建了一个字符串\";

var a:Array= mystring.split(\"\");

trace(a);

测试结果:我,创,建,了,一,个,字,符,串

substr()方法:这也是返回子字符串的方法,与slice()方法相似,但它的第2个参数不是结束处而是字符个数。

格式:substr(开始处,个数),从开始处返回个数那么多个字符的字符串。

substring()方法:返回一个字符串,该字符串由 开始处 和 结束处 参数指定的两点之间的字符组成。如果未指定结束处 参数,则子字符串的结尾就是该字符串的结尾。如果 开始处 的值等于结束处 的值,则该方法返回一个空字符串。如果 开始处 的值大于 结束处 的值,则在函数执行前两个参数将自动互换,且原始值不变。

toLowerCase()方法:返回此字符串的一个副本,其中所有大写的字符均转换为小写字符。原始字符串保持不变。

toString()方法:将字对象转换为字符串。

toUpperCase()方法:返回此字符串的一个副本,其中所有小写的字符均转换为大写字符。原始字符串保持不变。

Flash as入门(6):文本与字符串游戏实例

--------------------------------------------------------------------------------

日期:2009-02-21 14 作者:sanbos 来源:中国教程网论坛

本例继续讲解AS的基础知识,前几节课我们学习了AS中的文本与符的理论知识,今天来实际操作一下,制作一个打字游戏,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

现在开始制作:

新建一flash文档。

1.新建一个影片剪辑元件,命名为“爆炸”。这需要一个爆炸的效果,你可以找一个爆炸图片,也可以画一个,我这个是用PS做的。进入元件编辑窗口,将爆炸图片拖入,打散,居中放好。在第5帧插入关键帧。回到第一帧将图片缩到5象素。然后建立形状补间。打开库面板,在爆炸元件上,点右键,点击“连接”,为该元件输入标识符“bz”.

导入一个爆炸声的音乐文件,在库中音乐文件上点右键-属性。取掉“使用导入品质”上的钩。压缩选择mp3.在库中右击该音乐元件,点连接,为该元件输入标识符“pzs”.

回到爆炸元件编辑窗口,新建一层,在第3帧插入关键帧(这里是要导入爆炸声,在第几帧插入根据声音的长短来定,如果声音长那么就在第1帧就导入。)点右键,打开帧动作面板,输入:

var bd:Sound = new Sound(); bd.attachSound(\"pds\");

bd.start();

第一句声音了一个声音对;第二句将库中的爆炸声音导入。第三句声音开始播放。 在第5帧插入关键帧,在帧动作面板中输入: this.removeMovieClip(this); 将爆炸元件移除。

图:我用PS做的爆炸效果

2.再建一个影片剪辑元件,取名为“大炮”.同样你可以找一张大炮的图片,也可以自已画一个,我这个是自已画的。注意将图形放到中心点(十字)稍上方,即十字点在大炮的后半部位。

图:我画的大炮,不太好哈。注意十字的位置,大炮将以这一点作为旋转的基点。

3.新建7个按钮,标签分别为:“设置”,“重玩”,“字母”,“中文”,“慢速”,“中速”,“快速”。

4.可以选一个背景画片,同样可以找一个风景图(应有天空和地面),也可以画一个,我画了一个,又找了一张风景照片,结果还是认为风景照片好看些。当然你也可以不要背景图片。

5.演员准备齐了,现在开始布置舞台。

回到主场景。第一层“背景”在第2帧插入关键帧,将“设置”,“重玩”按钮从库中拖入,放到左上部。打开属性面板,分别将两个按钮命名为:“sz_btn”,”cw_btn”.在左边稍下边一点入一静态文本,内容为“命中率”,在它的下边放一动态文本,在属性面板中命名为“mzl_txt”;在它的下面放一静态文本,内容为“得分”,在它的下面,放一动态文本,在属性面板中命名为“df_txt”.在右半部画一矩形,然后在这个矩形上放一个静态文本,内容为“当前设置”。然后放两个动态文本,内容分别为:“字母”,“中速”。打开属性面板,将两个动态文本分别命名为:“yysz_txt”,”sdsz_txt”.将“字母”“中文”,“慢速”,“中速”,“快速”按钮拖入,放到矩形的右半部。在属性面板中分别命名为:“zm_btn”,”zw_btn”,”ms_btn”,”zs_btn”,”ks_btn”.如下图:

在第3帧插入帧。

新建一层:在第2帧插入关键帧,将风景图片拖入,调整大小,盖住右边的矩型鄣分: 将“大炮”元件从库中拖入,放到右边风景图的下方中间。在属性面板中命名为:”dp_mc”.

6.好了,布置好了。现在来写代码。新建一层,命名为“action”,打开帧动作面板。

首选准备好文字,将出现的文字有字母和中文两种,我们建两个字符串来存放文字。字母比较简单只有26个,所以第一句:

var zm:String = “abcdefghijklmnopqrstuvwxyz”;

第二句放中文,我找了一篇散文,将它存在字符串中,在散后最后加上0~9,这样也可以让用练习一下数字键。

var zw:String = \"这几天心里颇不宁静。„„.”;

zw+=\"0123456789\";

声明几变量,后面有用: var zs=0; //下落文字的总数

var df=0; //击中文字的数量

var lg = 1;//语言,用于后面由用户选择练习字母还是练习中文。 var sd = 500;//速度,用于设置文字出现的速度。

var wbformat:TextFormat=new TextFormat();//创建一个文本格式,用于设置下落的文本 wbformat.bold=true;

wbformat.size=22;

在第二帧插入关键帧:这一帧将实现文字下落,击中和得分计数生等功能。 stop();

//首先创建一个输入文本用来接受用户输入文字: this.createTextField(\"sr_txt\ sr_txt.type=\"input\";

sr_txt.border=true; sr_txt.text=\"开始\";

//创建文本位置坐标要根据实际的位置来确定,使文本出现在大炮的下方。 下面用一个函数来实现出现字母的功能:

var i=0;

function cwb(wbl){//注意这里声明的函数带了一个参数wbl,这个参数用于文本是字母还是中文。 if(i<10){ //这一句就让屏幕上出现的文字只有10个。

var wbx = 150+random(370); //产生一个150到520的随机数,用于设置文字的x属性。

createTextField(\"wb_txt\"+i,i,200,20,30,30); wb = eval(\"wb_txt\"+i);

var zmwz = random(wbl.length);//产生一个从0~文本字符串(第1帧创建那两个)的长度之间的随机数,用于从字符串中随机抽取字符。

wb.text = wbl.charAt(zmwz);//设置文本的内容为字符串中的随机字符 wb._x=wbx;

wb.setTextFormat(wbformat);//将第1帧创建的文本格式应用于该文本。 zs++;//文本出现后,文字总数加1 }else { i=0; }

i++; }

//下面通过onEnterFrame事件,让出现的文本不断往下落: onEnterFrame = function() { for (k=0;k<10;k++){ wb= eval(\"wb_txt\"+k); wb._y += 2;

} };

//接下来就是启动游戏了,我们将启动按钮设在输入文本的onSetFocus事件上,也就是说,当我们一点击“开始”(输入文本获得焦点),游戏启动。

var szm;//这变量用来调用上面的出现字的函数。

sr_txt.onSetFocus = function(){

var jsid = setTimeout(js,60000);//首先设置一个时间限制,就是说60000毫秒(1分钟)调用函数js,这个函数将停止游戏并统计得分。

if(lg==1){//如果变量lg等于1

szm = setInterval(cwb,sd,zm); //那么每隔变量sd那么长的时间,调用一次出文字的函数cwb,并且使用字母(zm)字符串) }else {//否则

szm = setInterval(cwb,sd,zw);//那么每隔变量sd那么长的时间,调用一次出文字的函数cwb,并且使用中文(zw)字符串).所以我们只虽改变变量lg的值,就可以选择出字母还是出中文了。 }

sr_txt.text=\"\";//将输入文本框清空,准备输入。 }

function js(){//这是声明了一个用于结束游戏的函数。

clearInterval(szm);//清除setInterval的调用,文字不再出现。

mzl_txt.text = int((df/zs)*100)+\"%\";//计算命中率,并显示。 }

//下面通过输入文本的onChanged事件,实现炮轰文字的效果。

sr_txt.onChanged = function(){//当输入文本内容发生变化时,即我们每输入一个文字时

for(var j=0;j<10;j++){

cxdwb =eval(\"wb_txt\"+j);

if(sr_txt.text == cxdwb.text){//如果输入的文字和出现的文字之一一样。

attachMovie(\"bz\那么从库中加载爆炸元件,这里的深度我用了21,是为了避免与出现的文字文本冲突,当然11也就行了,因为文字文本只有10个。

bz_mc._x=cxdwb._x;

bz_mc._y=cxdwb._y+10;//两句设置爆炸元的位置和文字文本的位置一样,使其在文字处爆炸。

dx = cxdwb._x - dp_mc._x;

dy = cxdwb._y - dp_mc._y;

dz = Math.atan2(dy,dx)*180/Math.PI;

dp_mc._rotation = dz+90;//上面是通过三角函数使大炮的方向转为文字文本的方向。

cxdwb.removeTextField();//爆炸后将文字文本删除,即炸掉了。

df++;//击中后得分加1

df_txt.text=df;//显示得分 }

}

sr_txt.text=\"\";//清空输入文本,准备下一次输入。

}

//游戏的功能就完成了,现在应提供一个重玩按钮,让用户可以重新开始游戏。 cw_btn.onRelease= function(){//当重玩按钮被点击时

if(lg==1){

szm = setInterval(cwb,sd,zm); }else {

szm = setInterval(cwb,sd,zw); }

sr_txt.text=\"\";

setTimeout(js,60000); df=0; zs=0;

mzl_txt.text=\"\"; }

//下面是设置按钮,进入设置页面。 sz_btn.onRelease =function(){

gotoAndStop(3); }

在第3帧插入关键帧,将在这一帧设置文字语言,速度等。 进入设置页面后,首先停止游戏: clearInterval(szm); zs=0;

df=0;

//下面是几个设置按钮上的代码: zm_btn.onRelease = function(){

lg=1;//让娈量lg等于1,这样文字将会是字母

yysz_txt.text=\"字母\";

}

zw_btn.onRelease = function(){

lg=2;//让娈量lg不等于1,这样文字将会是中文

yysz_txt.text=\"中文\"; }

ms_btn.onRelease= function(){

sd = 1000;//设置sd为1000毫秒,即每1000毫秒出一个文字,下同

sdsz_txt.text=\"慢速\"; }

zs_btn.onRelease=function(){

sd = 500;

sdsz_txt.text=\"中速\"; }

ks_btn.onRelease=function(){

sd =200;

sdsz_txt.text=\"快速\";

}

qd_btn.onRelease=function(){//这是确定按钮上的代码,点击确定按钮后,退出设置窗口,返回游戏窗口,继续游戏。

gotoAndStop(2); }

好,完工,祝你成功!

Flash as入门(7):创建影片剪辑

--------------------------------------------------------------------------------

日期:2009-02-21 14 作者:sanbos 来源:中国教程网论坛

本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课:影片剪辑第一节创建影片剪辑,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

上一篇FLASH AS教程:文本与字符串游戏实例

影片剪辑

影片剪辑就象一个独立的swf一样,运行时不受主时间轴的限制,它有它自已的时间轴。在AS中影片剪辑为 MovieClip 类类型的一个对象。您可以使用 MovieClip 类的属性和方法控制影片剪辑运行时的外观和行为。因此,在下文中将影片剪辑简称为:mc

第一节 创建MC

一.在创作环境中创建MC:

在创作环境中创建MC的方法是:点击“插入”菜单-“新建元件”,在弹出的对话框中为该MC命名,在下面的类型选择中选“影片剪辑”,确定。现在就进入了MC的编辑环境,在这里制作你的MC。制作完成后,点击场景选项卡,则完成了MC的创建。打开库面板,可以看到刚刚创建的MC已在库中。为了能在AS中操作该MC,那么可有两种方式将MC加载到舞台上:一是用鼠标从库中将MC拖到舞台上,然后打开属性面板,为该MC实例命名,比如:mymc_mc。另一种方法是:

在运行中从库中加载MC:

要在运行中从库中加载MC,首先要设置MC的连接标识:在库中右击MC,点击连接,在弹出的对话框中,在“为ActionSprit导出“前的方框中打钩,然后在上面标识符栏内取一个名字,比如:mymc.

attachMovie()方法

有标识符后就可以在运行时用MC的attachMovie()方法加载MC。

格式:MC. attachMovie(“标识符”,“新名称”,深度);

这里MC是指要加载MC的MC,一个MC中是可以加载另一个MC的,当然也可以是主时间轴,如果代码是写在帧上,则常用this或_root来代表主时间轴,推荐使用this,也可以省略不写。如果代码是写在元件上,要主场景加载mc就必须用:_root或this.perent.

getNextHighestDepth() 方法:

深度相当于层的概念,深度的数字越大,则越在上面。如果深度相同,那新加载的对象就会覆盖原来相同深度上的对象,在后面我们会发现这是一个十分有用的东西。在用attachMovie()方法加载MC时,怎样却定深度呢?深度一般可以从0开始,从上加。也有问题,你说我记不住现在深度是多少了,万一用重了,不是就将原来那个对象删了吗?于是getNextHighestDepth() 方法运应而生。

getNextHighestDepth() 方法确定传递给attachMovie()方法的深度值,以确保 Flash 将该影片剪辑呈现在当前影片剪辑中同一级和同一层上所有其它对象的前面。于是我们上面已在库中设好标识符的MC就可以这样加载到场景中:

this. attachMovie(“mymc”,”mymc_mc”,this.getNextHighestDepth());

用attachMovie()方法加载的MC,会被加载到舞台上(0,0)的位置,很显然这不是我们想要的结果,所以加载后往往要设置MC的_x,_y属性,以使它呆在我们希望它呆的地方。 下面来做一个练习:

新建一个MC,居中画一个圆,在第50帧插入关键帧,将圆向右移500象素,创建补间动画。在库中右击圆元件,点击“连接”,在弹出的对话框中,在“为ActionSprit导出“前的方框中打钩,然后在上面标识符栏内取一个名字:mymc.现在回到主场景,右击第一帧,点“动作”,在动作面板中输入: this. attachMovie(“mymc”,”mymc_mc”,this.getNextHighestDepth()); mymc_mc._x=50;

mymc_mc._y=200;

测试影片,会看到库中的MC被加载到舞台上,一个圆从屏幕的左边向右边移动。

二.在运行时创建MC

createEmptyMovieClip()方法

在运行时可用:createEmptyMovieClip()方法创建一个空的MC,这常常用于需用AS绘图的代码中。

格式:MC. createEmptyMovieClip(”名称“,深度);

例:this.createEmptyMovieCli(”mymc_mc”,this. getNextHighestDepth());

三.复制MC

duplicateMovieClip()方法:

在运行时复制一个MC。

格式:MC.duplicateMovieClip(“新名称“,深度)

比如上面我们已建好的一个MC,mymc_mc,现在要复制它,这样写:

Mymc_mc.duplicateMovieClip(“mymc1_mc”,this.getNextHighestDepth());

duplicateMovieClip()全局函数:

这是一个全局函数而不是MC的方法,虽然它们的作用是一样的,但格式有所不同。 格式:duplicateMovieClip(“要复制的MC的名称”,“新名称”,深度); 仍然以mymc_mc为例,要复制它,这样写:

duplicateMovieClip(“mymc_mc”,“mymc1_mc”,this.getNextHighestDepth()) 中的荧火虫的制作,作为本节内容的综合练习。

首先新建一flash文档,新建一MC,取名为“荧光”。 用椭圆工具,禁止笔触,绿色填充,居中画一个小圆,2个像素大小就行。居中对齐。点击“修改”-“形状”-“柔化填充边缘“,距离10,步骤5,方向扩展。在第10帧插入关键帧,将圆向下离一段距离。创建补间动画。在库中右击荧光元件,设置标识符为:mymc.

回到主场景,打开帧动作面板输入: i=0;

onEnterFrame = function() {

if(i<50){

this. attachMovie(\"mymc\

mymc_mc = eval(\"mymc\"+i);

mymc_mc._x=random(450)+50;

mymc_mc._y=50+random(300);

mymc_mc._rotation = random(360); i++; }else {

i=0;

} }

OK,测试影片。

上面代码通过onEnterFrame事件,使每一过帧从库中加载一次荧光元件,并用一个i变量计数,使荧光数量不超过50。this. attachMovie(\"mymc\这一句加载语句中的深度用了变量i,而i将会是从0到49,然后回到0,周而复始,这样第二轮的0-49将的深度就与第一轮的相同,上面我们说到了,这时新加载的就会覆盖原来的,这就实现了荧光的更新,同时也保证了荧光的总数量为50个。前面我们说深度的这一特性将会很有用,在这里就用上了。荧光的位置和旋转角度都采用random()来随机产生,这样就实现了,荧光随机出现的舞台上,运动方向也是随机的。

大家可以扩展一下,将加载的荧光元件的_x属性设为:_xmouse+random(50),将_y属性设为:_ymouse+random(50),测试看一看,一个鼠标跟随效果就出来了。

上面练习是用attachMovie()从库中加载元件的方式实现的,用duplicateMovieClip()复制的方法也是可以实现的,方法略有不同:

将库中的灾光元件拖到舞台上,任一位置,打开属性面板,将实例名称设为:mymc_mc.帧动作上的代码为:

mymc_mc._visible = false; //首先将舞台上的荧光元件隐藏。 i=0;

onEnterFrame = function() {

if(i<50){

duplicateMovieClip (“mymc_mc”,\"mymc\"+i,i);

mymc_mc = eval(\"mymc\"+i);

mymc_mc._x=random(450)+50;

mymc_mc._y=50+random(300);

mymc_mc._rotation = random(360);

i++;

}else { i=0; } }

作业:

1.夜色下的荧火虫的制作

2.用本节所讲内容制作一下雨或下雪效果。

Flash as入门(8):加载和卸载swf文件

--------------------------------------------------------------------------------

日期:2009-02-23 15 作者:sanbos 来源:中国教程网

本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课:影片剪辑第二节加载swf文件,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

第二节 加载和卸载swf文件

上一节中,我们已经能创建MC,本节我们将介绍加载外部swf文件的方法。

loadMovie函数及MC的loadMovie()方法:

使用 loadMovie() 函数可以在播放原始 SWF 文件时,将 SWF、JPEG、GIF 或 PNG 文件加载到 Flash Player 中的影片剪辑中。加载的图像或 SWF 文件的左上角与目标影片剪辑的注册点对齐。 格式:loadMovie(“要加载的swf文件或图片“,目标影片剪辑); 要加载的swf文件或图片可以来源于网络,书写格式为:http://.... 可以来源于本地硬盘上的文件系统,书写格式为:file:///.......

如果要加载的swf文件或图片与fla文件在同一目录下,则直接写文件名。

目标影片剪辑可以是任何影片剪辑,也可以是主场景,加载后,目标影片剪辑将被替换成加载的文件。 例1:加载一个网络上的swf文件sub.swf到创建的MC中:

this.createEmptyMovieClip(\"logo_mc\

loadMovie(\"http://www.jcwcn.com/sub.swf\

例2:加载一个本地的swf文件sub.swf到主舞台:

loadMovie(\"file:///d:/myflash/sub.swf\

例3:加载一个相同目录下的图片picture.jpg到创建的MC中:

this.createEmptyMovieClip(\"picture_mc\ loadMovie(\"picture.jpg\

MovieClipLoader类

此类用于实现在 SWF、JPEG、GIF 和 PNG 文件正被加载到影片剪辑中时提供状态信息的侦听器回调。也就是说用这类加载swf文件,可以在加载过程中进行控制,如观察加载进度等。要使用MovieClipLoader类就应首先用构造函数创建一个MovieClipLoader类的实例才能操作其方法,事件,实现加载功能。如: var mcLoader:MovieClipLoader = new MovieClipLoader();

loadClip方法:该方法的作用和用法与loadMovie()是一样的。如:

this.createEmptyMovieClip(\"picture_mc\

var mcLoader:MovieClipLoader = new MovieClipLoader(); mcLoader.loadClip(\"picture.jpg\);

上面说到,用本类加载外部swf文件或图片可以在加载过程中加以操作,主要是通过几个事件的调用来实现:onLoadStart事件:在下载的文件的第一个字节写入硬盘后,调用。 格式: onLoadStart = function([target_mc: MovieClip]) {} 其中的target_mc为要加载外部影片的目标MC。

onLoadComplete事件:当加载的文件完全下载时调用。 格式:onLoadComplete = function([target_mc: MovieClip]) {}

onLoadInit事件:当执行加载的剪辑的第一帧上的动作时调用。

在调用此侦听器后,您可以设置属性、使用方法,还可以与加载的影片交互。

格式:onLoadInit = function([target_mc: MovieClip]) {}了解 MovieClipLoader.onLoadComplete和 MovieClipLoader.onLoadInit之间的差异非常重要。onLoadComplete事件在加载 SWF、JPEG、GIF 或 PNG 文件之后但在应用程序初始化之前被调用。此时,无法访问已加载的影片剪辑的方法和属性,因此您无法调用函数、移动到特定帧,等等。在多数情况下,最好改为使用 onLoadInit事件,它在内容已加载并完全初始化后被调用。

onLoadProgress事件:在加载过程中(即在 MovieClipLoader.onLoadStart 和 MovieClipLoader.onLoadComplete 之间时),每当正加载的内容写入硬盘时调用。

格式:onLoadProgress = function([target_mc: MovieClip], loadedBytes: Number, totalBytes: Number) {}

loadedBytes为已经加载的字节数。totalBytes为要加载的swf的总的字节数。如果在测试模式中,您试图对驻留在硬盘上的本地文件使用 onLoadProgress,则它将不能正常工作,这是因为在测试模式中,Flash Player 会将本地文件作为一个整体加载。

onLoadError事件:加载的文件未能加载时调用。出于各种原因,会调用此侦听器;例如服务器关闭、找不到文件或发生安全侵犯。

上述事件的调用方法我给你整成一个公式的模式,直接套用就行了。 MovieClipLoader类事件调用公式: //首先创建一个MovieClipLoader对象

var mcLoader:MovieClipLoader = new MovieClipLoader();//mcLoader为自已取的名称 //然后创建一个侦听对象

var listener:Object = new Object();//listener为自已取的名称 //调用下列事件之一或多个

listener.onLoadStart = function(target_mc:MovieClip) {} listener.onLoadComplete = function([target_mc: MovieClip]) {} listener.onLoadInit = function([target_mc: MovieClip]) {} listener.onLoadProgress = function([target_mc: MovieClip], loadedBytes: Number, totalBytes: Number) {} //MovieClipLoader对象调用侦听对象 mcLoader.addListener(listener);

//MovieClipLoader对象加载外部swf或图片

mcLoader.loadClip(“外部文件地址”,目标影片剪辑);

下面介绍MovieClipLoader类的几个方法

loadClip方法:在播放原始影片时,将 SWF、JPEG、渐进式 JPEG、非动画 GIF 或 PNG 文件加载到 Flash Player 中的影片剪辑中。

addListener(侦听对象)方法:注册一个对象,以便在调用 MovieClipLoader 事件处理函数时接收通知。

getProgress(target: Object)方法:返回正在通过使用 MovieClipLoader.loadClip()

加载的文件的已加载字节数和总字节数;返回一个具有以下两个整数属性的对象:bytesLoaded 和 bytesTotal。

removeListener(侦听对象)方法:删除在调用 MovieClipLoader 事件处理函数时用来接收通知的侦听器。

unloadClip(target: Object)方法:删除通过使用 MovieClipLoader.loadClip() 加载的影片剪辑。

下面通过一个练习来加深理解本节课所介绍的内容,主要运用MovieClipLoader类来加载外部文件加载过程中,用进度条来显示加载进度。本节的练习请保存原文件,待下一节控制时间轴后,将在本练习的基础上,完成一个播放器。

一、新建flash文档,然后在第一层画一个播放器的外形,这个我不作介绍,我画的如下图,你完全可以画得更好看一些。这里要说一说中间的播放屏幕(黑的那块)的大小问题。Flash文档默认的大小是550x400,那么这个播放屏幕也应按这个比例来画,它的大小是文档大小的80%,因此,宽为:550x0.8=440,高为400x0.8=320.将这个播入屏幕水平居中,尽量往上放,将下面多留一些地盘,以后有用。然后用变形工具点中它,将注册点移到左上角,打开属性面板,记录下它的x,y坐标备用。图层上锁。

二、新插入一图层,按下图位置放一个静态文本,内容为:“文件地址:”;再放一个输入文本,在属性面板实例名称为:url_txt.新建一按钮元件,标签为:“打开”,属性面板实例名称为:load_btn.将按钮放输入文本右边。

三、新建一MC,取名loading,用矩形工具,禁止笔触,绿色填充,画一个300x5的矩形。然后转换成MC。双击它进新的MC编辑窗口,将矩形条垂直居中,左对齐。打开属性面板,为实例名称取名为:“loadt_mc”.回到loading元件编辑窗口,将矩形元件垂直居中,左对齐。在矩形元件的上面放一静态文本,内容为:“正在加载文件,请稍候„”.在库中右击loading元件,点连接,在“为ActionScript导出“前打钩。在标识标中输入:loading,实际上那里本来就有了,不用输哈,确定。

四、好了,接下来写代码。新建一层,取名为“action”.

打开帧到作面板,输入如下语句:

load_btn.onRelease =function(){

attachMovie(\"loading\

loading_mc._x=80;

loading_mc._y=215;

loading_mc.loadt_mc._xscale=0; var swfurl = url_txt.text;

var type = swfurl.substr(-3,3); createEmptyMovieClip(\"swf_mc\

var mcLoader:MovieClipLoader = new MovieClipLoader(); var listener:Object = new Object();

listener.onLoadProgress = function(target:MovieClip, bytesLoaded:Number, bytesTotal:Number):Void { loading_mc.loadt_mc._xscale=Math.floor((bytesLoaded/bytesTotal)*100); }

listener.onLoadInit = function(swf_mc){

loading_mc.removeMovieClip();

swf_mc._x=60;

swf_mc._y=8;

if(type == \"swf\"){

swf_mc._xscale=swf_mc._yscale=80;

} else {

while((swf_mc._width>440) Flash as入门(9):控制时间轴

--------------------------------------------------------------------------------

日期:2009-02-23 15 作者:sanbos 来源:中国教程网

本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课:影片剪辑第三节控制时间轴,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

第三节 控制时间轴

MC实际上相当于一个独立的swf文件,它具有它自已的时间轴。反过来说,我们也可以把一个swf文件看成一个MC。所以本节所介绍的控制时间轴的方法同样适用于主时间轴。

在做好一个动画后,如果没有添加任何AS代码,那么动画就会按帧开始播放。本节的题目叫,控制时间轴就是由用户来控制动画的播放。为了实现这个目的,首先应叫动画不要自动播放,所以第一个语句:

stop():时间轴停止播放。

播入停止了,那么肯定就要一个让动画播放的命令:

Play() 时间轴开始播放

下面来做个练习:

新建一个flash文件,在舞台左边上画一个园,在100帧插入关键帧,将园拖到舞台右边。创建补间动画。接下来新建两个按钮,标签分别为:播放,停止。新建一层,将两按钮拖入舞台,打开属性面板,将播放按钮实例命名为:ply_btn,停止按钮实例命名为stop_btn. 新插入一层,命名为:action.打开动作面板,输入: stop();这样运行时,时间轴将停在第一帧,不播放。 接下来是点击播放按钮的动作: ply_btn.onRelease = function(){ play(); }

点击停止按钮上的动作: stop_btn. onRelease = function(){

stop(); }

测试影片,园停在那儿不动,点击播放,园开始运动,点击停止,园停止运动。 这样我们就实现了控制动画播放的功能。

上面是控制主时间轴的播放,那么要控制MC的播放怎做呢?现在新建一个mc,按上面的方法做一个补间动画,在MC的第一帧输入:stop();将MC拖入舞台,在属性面板中实例命名为:mymc_mc. 在主时间轴的第一帧,输入: ply_btn.onRelease = function(){ mymc_mc.play();

}

stop_btn. onRelease = function(){

mymc_mc.stop();

}

测试影片,那么我们就已能控制MC的播放了。

接下来,进行更进一步的控制。

gotoAndPlay(n):将时间轴转到n所在的帧处,开始始播放。 比如:gotoAndPlay(5); 从第5帧开始播放。

gotoAndStop(n):将时间轴转到n所在的帧处并停止。 比如:gotoAndStop(5);跳到第5帧并停止。

nextFrame()方法:将时间轴移到下一帧并停止。 比如:MC的控制:mymc_mc.nextFrame();

主时间轴的控制:this.nextFrame();

prevFrame()方法:将时间轴移到上一帧并停止。 用法同nextFrame()。

停止与暂停按钮:

stop()命令使时间轴停止播放,但它是停在当前帧处,很显然,这是暂停的效果,当我们再次点击播放按钮时,时间轴从当前开始播放。所以在暂停按钮上的命令是:stop();停止的效果是回到第1帧,所以在停止按钮上的命令是:gotoAndStop(1);

控制影片的播放,应该有快进快退的功能才算完整,要快进快退,那就应该要知道现在时间轴在什么位置,然后,在当前的位置加上或减去一个帧数,比如5帧或10帧来实现。

_currentframe属性:播放头当前在时间轴中的位置。有了这个属性就可实现快进快退的效果了。

练习:在上面的练习中增加两个按钮,标签分别为:快进,快退,将其拖入舞台,实例名称分别为:kj_btn,kt_btn.在actin图层的帧动作面板中,添加如下代码:

kj_btn.onRelease = function(){ gotoAndPlay( _currentframe+5); }

kt_btn. onRelease = function(){

gotoAndPlay(_currentframe-5); }

测试影片,现在点快进,则播放头则向前5帧,开始播放。点快退播放头则向后退5帧开始播放。

可能我们还想整得更完美点,在播放时能够有一个播放进度条才好。分析一下,当前帧现在已有了,如果能有一个动画的总帧数,不就行了,是的有总帧数这个属性的。

_totalframes属性:MC的总的帧数。 用当前帧去除以总的帧数,这不就是MC的播放进度吗。然后用一个矩形条来显示进度,采用矩形条有_xscal属性等于当前帧与总帧数的比例来实现。

播放进度条的制作:

练习:接到上面的,插入新的MC,画一细的矩形长条,垂直居中,左对齐。回到主场景,将MC拖入放好,取实例名为bft_mc.打开action层帧动作面板,找到 ply_btn.onRelease = function(){ play(); }

在play()下面插入: onEnterFrame = function() {

if(_currentframe<_totalframes){

bl = Math.round(_currentframe/_totalframes*100);

bft_mc._xscale=bl;

} else {

delete onEnterFrame //删除每一帧的调用 }

}

测试影片,点击播放按钮时,动画开始播放,同时有一进度条随同展开。

加载进度条的制作:

一些稍大一点的动画,打开比较慢,尤其是在网络上更是如此。有人建议,你的动画如果超过100k,要把它放到网络上,最好做一个加载进度条。加载进度条的制作与播放进度条的制作原理差不多,只是获取的是加载的字节数而不是播放的帧数。先看看MC的两个方法:

getBytesLoaded()方法:返回已加载的字节数。

getBytesTotal()方法:返回动画的总的字节数。注意与上面的_totalframes属性相区别,_totalframes属性是动画的总的帧数,getBytesTotal()方法:返回的是动画的总的字节数。

了解了这两个方法后,制作就与播放进度条一样了。加载进度条常常会放到新的场景中,接上面的练习,点击 窗口>其它面板>场景打开场景面板,点右下角的加号,新增一个场景,并将这个场景拖到原场景1之上。回到场景2,新建一静态文本,内容为:“正在加载请稍候„„”,在它下面放一个动态文本,实例名称为:load_txt.新建一影片剪辑元件,画一个细长的矩形,左对齐。回到场景2,将元件拖入放到动态文本下面。实例名称为:load_mc.新插入一层,打开帧动作面板,输入: load_mc._xscale = 0;

onEnterFrame = function() {

if(getBytesLoaded()loadjd = Math.round(getBytesLoaded()/getBytesTotal()*100);

load_mc._xscale = loadjd;

load_txt.text = loadjd +\"%\"; } else {

delete onEnterFrame; }

}

点击舞台上的场景按钮,点场景1,这回到了场景1,在action的第100帧(最后一帧)插入关键帧,打开动作面板,输入:

gotoAndStop(1);

为什么要加这句?因为在场景1的前面,我们放了一个加载条的场景,当场景1 播放完后,播放头将回到加载场景,而这时动画已加载,是不需要再播放加载场景的。所以用这一句将播放头回到场景1的第一帧,从而避开了加载场景。

测试影片,结果直接进入了场景1,没看到加载进度条。为什么呢?这是因为在本地影片加载速度太快,没法显示加载进度。没关系,不要关闭flash player,点 视图>下载设置,因为我们的动画太简单,所以选最上面的速度最慢的那个14.4k.这样这可模似在网上加载动画。点 视图>模似下载,怎么样看到了加载进度条了吧。

Flash as入门(10):影片剪辑的深度

--------------------------------------------------------------------------------

日期:2009-02-24 15 作者:sanbos 来源:中国教程网

本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课第四节:影片剪辑的深度,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

第4节 MC的深度

在flash创作环境中我们对层的概念已经比较熟悉了。深度与层的概念比较接近。每一个在舞台上的对象都有它自已的深度,深度数字大的盖住比它小的对象,这就象上面的层遮住下面的层一样。我们可以把MC放到-16384 至 1048575的任一深度上,但某一深度上原来已有一个对象时,那么新放入的对象将替换原来的对象。这可能会遇到一个问题,当我用使用 attachMovie(MovieClip.attachMovie 方法)、duplicateMovieClip(MovieClip.duplicateMovieClip 方法)或 createEmptyMovieClip(MovieClip.createEmptyMovieClip 方法)在运行时创建影片剪辑时,始终要指定MC的深度。应该用个什么深度值呢?如果指定的深度值上已有MC了,会不会将原来的覆盖了呢?为了解决这个问题,flash 为我们提供了getNextHighestDepth()方法。

getNextHighestDepth()方法:MC的这个方法将返回下一个可用的深度值。更好的的理解就是当前最大的深度值加1。因此用这个深度值,MC将在最上面。

比如:this.createEmptyMovieClip(\"my_mc\

getInstanceAtDepth()方法:这个方法将返回某个特定深度值上的MC实例。

比如要确定当前最大深度值的MC,可以用如下代码:

var zddepth = this.getNextHighestDepth()-1; //获得当前最大的深度值 var my_mc:MovieClip =this.getInstanceAtDepth(zddepth); getDepth()方法:返回某个MC的深度 比如要返回MC,my_mc的深度:

var mymcdepth = my_mc.getDepth();

swapDepths()方法:交换两个MC的深度值,如果MC正在执行补间,则补间会停止。 比如有两个MC:mc1和mc2,现在要交换这两个MC的深度 mc1.swapDepths(mc2);

下面通过一个练习来熟悉本节课所介绍的内容。

效果说明:用鼠标点击挡在下面的图片,这张图片将移到最上面一层来。

制作方法:

1.新建一flash文档,导入若干图片。

2.将这些图片分别做成MC,大小随意,但宽高不应超过200或可再小一些。在库中分别右击这些MC,点击“连接”,在弹出的面板中,在为ActionSpript导出前打钩。在标识框内输入:pic1.第二个MC则输入pic2,以此类推。

3.回到主场景,打开动作面板,输入下列代码:(注意下面的代码是以5张图片为例写的,如果你不是5张图片则应作相应修改,详细说明看后面的代码分析)

for(i=1;i<6;i++){

this.attachMovie(\"pic\"+i,\"pic\"+i+\"_mc\ var pic_mc = eval(\"pic\"+i+\"_mc\"); pic_mc._x = 150 +random(200);

pic_mc._y = 100 + random(200); }

pic1_mc.onRelease = function(){

var zddepth =_root.getNextHighestDepth()-1;

var zd_mc:MovieClip =_root.getInstanceAtDepth(zddepth); this.swapDepths(zd_mc); }

pic2_mc.onRelease = function(){

var zddepth = _root.getNextHighestDepth()-1;

var zd_mc:MovieClip = _root.getInstanceAtDepth(zddepth); this.swapDepths(zd_mc); }

pic3_mc.onRelease = function(){

var zddepth = _root.getNextHighestDepth()-1;

var zd_mc:MovieClip = _root.getInstanceAtDepth(zddepth); this.swapDepths(zd_mc); }

pic4_mc.onRelease = function(){

var zddepth = _root.getNextHighestDepth()-1;

var zd_mc:MovieClip = _root.getInstanceAtDepth(zddepth); this.swapDepths(zd_mc); }

pic5_mc.onRelease = function(){

var zddepth = _root.getNextHighestDepth()-1;

var zd_mc:MovieClip = _root.getInstanceAtDepth(zddepth); this.swapDepths(zd_mc); }

代码分析:

首先用一个for循环,将库中的图片加载到舞台上,循环次数是你的图片元件的数量,下面i<6中的6用你的图片元件数量加1替换。我这里是5张图片,所以我用6。

for(i=1;i<6;i++){

接下来加载这些图片元件,这里加载的深度我们用到了this.getNextHighestDepth()方法。图片加载后指定图片的x,y坐标在一定的范围内随机的位置。这个范围应根据图片元件的大小来确定,不能太小,太小了,上面的图片会完全盖住下面的图片。也不能太大,太大了则不能产生重叠效果。总之就是要即要产生重叠效果,又不能完全盖住。

this.attachMovie(\"pic\"+i,\"pic\"+i+\"_mc\ var pic_mc = eval(\"pic\"+i+\"_mc\"); pic_mc._x = 150 +random(200);

pic_mc._y = 100 + random(200);

现在图片已加载到舞台上了,并产生了不完全重叠效果。接下来就是实现点击图片让该图片移到最上层,所以用到图片MC的onRelease事件,以第一张图片为例:

pic1_mc.onRelease = function(){

在这个事件执行中首先确定最上面的图片的深度值。上面介绍了getNextHighestDepth()返回的是最大的深度值加1,那么最大的深度值自然就是getNextHighestDepth()减1了。 var zddepth = _root.getNextHighestDepth()-1;

有了最大的深度值后,就可以确定最上面的图片是哪张了:

var zd_mc:MovieClip = _root.getInstanceAtDepth(zddepth);

最后将这张图片与最大深度那张图片交换深度,那这张图片深度值就最大了,当然也就在最上面了: this.swapDepths(zd_mc);

第一张图片的点击动作代码就完成了。下面写第二张图片的代码,因为每张图片点击事件中的代码是完全一样的,所以复制第一张图片的代码,粘帖到第一张图片代码的下面,将第一句pic1_mc.onRelease = function(){中的pic1改为pic2,就行了。

以后的以此类推,直到完成所有的图片的点击代码。

Flash as入门(11):拖动与碰撞检测

--------------------------------------------------------------------------------

日期:2009-02-24 15 作者:sanbos 来源:中国教程网

本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课:影片剪辑第五节拖动与碰撞检测,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

第五节 拖动与碰撞检测

AS的一个重要优势就是可以实现交互动画,一些特效不用AS也是可以做出来的,但交互的动画不用AS则是无法实现的。拖动MC则是交互动画的一个例子。

startDrag() 函数或 MovieClip.startDrag() 方法:

使用startDrag()可以实现拖动效果。格式:

MC.startDrag(一个布尔值,左边,上边,右边,下边);

这个方法中的所有参数都是可选的,即可要可不要。下面介绍一下这些参数:

一个布尔值:true或false。当设定为true时鼠标位置将锁定在要拖动的MC的注册点上。想一想我们要自定义鼠标指针,这个参数是不是很有用呢? 后面的4个边,确定了MC可以被拖动的范围。想一想我们要做一个控制滑条这几个参数是不是很有用呢?

下面练习一下:

自定义鼠标指针:

新建一个MC,画一个或找一个你喜欢的鼠标图形,图形应该有一个较尖的部位作为针尖吧?将这个针尖与窗口中的十字对齐。回到主场景,将这个MC拖到舞台上,打开属性面板,实例名称为:mouse_mc;打开帧动作面板输入:

Mouse.hide();

mouse_mc.startDrag(true);

测试影片,你会发现你的鼠标已经变成你喜欢的图形了。

代码中第一句将系统鼠标隐藏起来,第二句使你的图形可以拖动了,并且鼠标指针被定位在针尖处。使用自定义鼠标要注意的是,你不能再拖动第二个MC,因为一次只能拖动一个MC,当你拖动第二个MC时,你的鼠标图形将不会再被拖动了。

stopDrag()方法:

上面介绍了开始拖动MC的方法,开始拖动总得有停止拖的时候啊,这个方法就是停止拖动。我们回想一下拖动一个MC的过程,一般来说,都是点下鼠标左键不放,就可以拖动了,放开鼠标后就停止拖动,是这样的吧?所以一般将startDrag()放到MC的onPress事件(点下鼠标时)中,而将 stopDrag()放到onRelease事件(放开鼠标时)中。

滑动控制条:

有时我们会用到滑动控制条,比如控制音量大小,播放进度等。那么滑块就需要用到拖动的方法。 用矩形工具画一个细长的矩形,笔触填充公随你喜欢,要不要都行,至少要一个吧?将它转换为MC,双击它进入编辑状态,打开对齐面板选择相对于舞台,左对齐,回到主场景,打开属性面板,实例名称为blt_mc。然后再画一个很短的矩形,做滑块,也转换为MC,也同细长的矩形一样的做法,只是居中对齐,最后的实例名为hk_mc。

blt_mc移到你想它所处的位置,将hk_mc移到blt_mc上。

在帧动作面板中输入:

l = blt_mc._x;

r = l+blt_mc._width; h = blt_mc._y;

hk_mc.onPress = function(){ this.startDrag(\"true\ }

hk_mc.onRelease = function(){ stopDrag();

num = (hk_mc._x-blt_mc._x)/blt_mc._width; }

测试影片,拖动滑块会发现滑块只能在进度条的范围内拖动了。这是因为我们对startDrag()由于方法运用了4个参数:l,r,h.它们分别是进度条的左右边的x位置及y轴的位置。滑块的移动范围被限定在这个范围内。

从上面的代码中可以看出,当鼠标放开时会产生一个num变量,这个变量是用滑块的x坐标减去进度条的x坐标除以进度条的长度,这样就可以得到一个0~1的数字。有了这个数字,我们就可以用于任何需要用数字控制的对象了。

_droptarget 属性:

可能会有这种情况,我们拖动一个对象,想知道它是否被拖到了另一个对象之上,比如我们拖动苹果到盘子中,我们可能想知道苹果是否被拖到了盘子之上,如果是苹果则定位到盘子上,如果不是苹果就掉到深渊中。MC的_droptarget 属性将返回被自已重叠在下面的MC的名称。比如将苹果拖到盘子上时,苹果将盘子压在下面,苹果的_droptarget 属性将返回盘子的名称。但它返回的名称是带反斜杠的格式的,因此需要用eval()将其转换为标准格式,如:eval(苹果. _droptarget)这一句结果是:盘子。

做个练习熟悉一下:

在舞台上画两个园,不同的颜色,均转换为MC,实例名称分别为:mc1_mc,mc2_mc.右击mc1_mc>排列>移至顶层;打开动作面板,输入:

mcx = mc1_mc._x;

mcy = mc1_mc._y;

mc1_mc.onPress = function(){ this.startDrag(true); }

mc1_mc.onRelease = function(){ stopDrag();

if(eval(mc1_mc._droptarget)==mc2_mc){ this._x = mc2_mc._x; this._y = mc2_mc._y; } else {

this._x = mcx; this._y = mcy; }

}

测试影片,在mc1_mc上点击时可以拖动,将它拖到mc2_mc上放开鼠标,则与mc2_mc重叠,如果不在mc2_mc上放开鼠标,则回到原位。

这种检查一个MC是否被拖到另一个MC之上还有另一种方法,那就是碰撞检测。

hitTest()方法:

该方法将检测MC是否与某点或与另一MC发生相交(碰撞)。如果发生相交则返回true,否则返回false.

用法:1.与某点相交: MC.hitTest(x,y,true或false);

这将检测MC是否与括号中的x,y所确定的点(x,y)相交。后面的布尔值如果为ture,那么将检测MC的实际图形范围,如果为false则检测MC的外框是否与(x,y)相交。 2.MC与MC相交:MC.hitTest(另一MC).

把上面的的练习改为下面的代码,可得到相同的结果:

mcx = mc1_mc._x; mcy = mc1_mc._y;

mc1_mc.onPress = function(){ this.startDrag(true);

}

mc1_mc.onRelease = function(){ stopDrag();

if(this.hitTest(mc2_mc)){ this._x = mc2_mc._x; this._y = mc2_mc._y; } else { this._x = mcx; this._y = mcy; }

}

Flash as入门(13):用AS代码实现过渡

--------------------------------------------------------------------------------

日期:2009-02-25 16 作者:中国教程网 来源:sanbos

本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课_影片剪辑第七节:用AS代码实现过渡,教程讲解了遮帘过渡、淡化过渡、飞行过渡、光圈过渡、照片过渡、像素溶解过渡、旋转过渡、挤压过渡、划入/划出过渡、缩放过渡的制作,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

上一篇文章:Flash as入门(12):使用遮罩Mask

用AS实现过渡效果

效果演示:

http://www.webjx.com/flash/actionscript-9079.html

通过 TransitionManager 类,您可以迅速将令人印象深刻的过渡动画效果应用于影片剪辑。TransitionManager为我们提供了10种过渡效果。下面来看看怎样使用TransitionManager类来实现过渡效果。

要实现过渡效果,为编写代码更为方便首先需要导入所有 mx.transitions 类和所有 mx.transitions.easing 类:

import mx.transitions.*;

import mx.transitions.easing.*;

在导入上面两个类以后,就可以使用TransitionManager类的start()方法将过渡效果应用于影片剪辑上。 格式:TransitionManager.start(影片剪辑名称,{ type:过渡类型,direction:方向,duration:过渡所所需的时间,easing:缓动效果,各种过渡效果所需的参数});

start()方法参数的说明:

影片剪辑名称:就是要应用过渡效果的MC的实例名称。

过渡类型:上面已提到共有10种过渡效果,这里填上要用的过渡效果名称。下面将分别介绍这十种效果。

direction:方向:即过渡是进入还是退出。可以用两个值:Transition.IN和Transition.OUT

duration:过渡所所需的时间:一般一个过渡几秒就够了吧,常用3-5。

easing:缓动效果:在过渡效果中可以为过渡效果添加缓动效果,有关缓动效果后面将专门介绍,这里先介绍一个值,我们才好测试过渡效果。None.easeNone用这个值,就是不用缓动效果。

各种过渡效果所需的参数:除了上面的的参数外,每一种过渡效果可能还有自已的参数,那么就跟在后面就行了。

有了上面的介绍,我们已经对TransitionManager类有了一个大概的认识,下面我们来介绍这十种过渡效果,并用练习来实现它,这样我们便能掌握TransitionManager的应用了。

遮帘过渡:Blinds

这个是什么效果呢?文字说不清楚,自已看吧,就这个效果:

参数

numStrips,\"遮帘\"效果中的遮罩条纹数。建议的范围是 1 到 50。 dimension,一个整数,指示遮帘条纹是垂直的 (0) 还是水平的 (1)。

下面我们来制作这个效果:

1. 新建flash文档,导入一张图片到舞台,打开对齐面板,宽高匹配,居中对齐。 2. 点中图片:将其转换为MC,实例名称为:img1_mc.,在第50帧插入帧。 3. 点第1帧,右键打开动作面板,输入如下代码: import mx.transitions.*;

import mx.transitions.easing.*;

TransitionManager.start(img1_mc,{type:Blinds, numStrips:10, dimension:0});

测试影片,怎么样?看到效果了吧。

这些代码不用解释了吧。

淡化过渡:Fade

效果:

制作方法跟前面一样,只是把代码改为: import mx.transitions.*;

import mx.transitions.easing.*;

TransitionManager.start(img1_mc, {type:Fade, direction:Transition.IN, duration:3, easing:None.easeNone}); 这个过渡跟上面的过渡比较起代码不同的是,上面的过渡自已有两个参数,而这个过渡则没有自已的参数。 现在你可能已经感觉到用代码实现的过渡效果比自已在计设环境中去设透明度,做遮罩要简单得多。废话,要不我在这废这么多口舌干啥呢?继续往下看吧,好东西还多呢。 飞行过渡:Fly

效果:

参数:startPoint,一个指示起始位置的整数;范围是 1 到 9:

左上,1;上中,2;右上,3;左中,4;中心,5;右中,6;左下,7;下中,8;右下,9。 代码:import mx.transitions.*;

import mx.transitions.easing.*;

TransitionManager.start(img1_mc,{type:Fly,

direction:Transition.IN,

duration:3,

easing:None.easeNone,

irection:Transition.IN, duration:2, easing:None.easeNone,

startPoint:9});

这里最后又跟了一个自带的参数,你可以改变一下这个参数,让图片从不同的方向飞入。

光圈过渡:Iris

效果:

参数:startPoint,一个指示起始位置的整数;范围是 1 到 9:

左上,1;上中,2;右上,3;左中,4;中心,5;右中,6;左下,7;下中,8;右下,9。 shape,值为Iris.SQUARE(方形)或Iris.CIRCLE(圆形)的遮罩形状

代码:import mx.transitions.*; import mx.transitions.easing.*;

TransitionManager.start(img1_mc, {type:Iris, direction:Transition.IN, duration:2, easing: None.easeNone, startPoint:5, shape:Iris.CIRCLE}); 照片过渡:Photo

效果:

代码:import mx.transitions.*;

import mx.transitions.easing.*;

TransitionManager.start (img1_mc, {type:Photo, direction:Transition.IN, duration:1, easing:None.easeNone}); 像素溶解过渡:PixelDissolve

效果:

参数:xSections,一个整数,指示沿水平轴的遮罩矩形部分的数目。建议的范围是 1 到 50。 ySections,一个整数,指示沿垂直轴的遮罩矩形部分的数目。建议的范围是 1 到 50。 代码:import mx.transitions.*; import mx.transitions.easing.*; TransitionManager.start(img1_mc,

{type:PixelDissolve,

direction:Transition.IN,

duration:2,

easing:None.easeNone, xSections:10, ySections:10});

旋转过渡:Rotate

效果:

参数:ccw 一个布尔值:对于顺时针旋转为 false;对于逆时针旋转为 true。

degrees,一个整数,指示对象要旋转的度数。建议是范围是 1 到 9999。例如,degrees 设置为 1080 时,会将对象完全旋转三次。 代码:import mx.transitions.*;

import mx.transitions.easing.*;

TransitionManager.start(img1_mc, {type:Rotate, direction:Transition.IN, duration:3, easing:None.easeNone, ccw:false, degrees:720}); 挤压过渡:Squeeze

效果:

参数:dimension,一个整数,指示\"挤压\"效果应是水平的 (0) 还是垂直的 (1)。 代码:import mx.transitions.*; import mx.transitions.easing.*;

TransitionManager.start(img1_mc, {type:Squeeze, direction:Transition.IN, duration:2, easing:None.easeNone, dimension:1});

划入/划出过渡:Wipe

效果:

参数:startPoint,一个整数,指示开始位置。范围是 1 到 4 和 6 到 9:

左上,1;上中,2;右上,3;左中,4;右中,6;左下,7;下中,8;右下,9。 代码:import mx.transitions.*; import mx.transitions.easing.*;

TransitionManager.start(img1_mc, {type:Wipe, direction:Transition.IN, duration:2, easing:None.easeNone, startPoint:1});

缩放过渡:Zoom

效果:

代码:import mx.transitions.*; import mx.transitions.easing.*;

TransitionManager.start(img1_mc, {type:Zoom, direction:Transition.IN, duration:2, easing:None.easeNone});

以上是十种过渡效果,你可以更改其中的参数,以实现不同的效果,同时你也可以调整图片MC的注册点,也可能出现不同的效果。

上面的easing参数我们全用的是None.easeNone,即不使用缓动效果,在这里你可以更改这个参数将缓动效果应用于过渡效果中。不过我经测试,加上缓动效果后,很多过渡效果失去原味,不是很理想,我不提昌在过渡中使用缓动效果,但这必竟是我个人的意见,因此缓动效果还得介绍,何况下节课还要用到它的,下面再说说缓动效果。 关于缓动类和方法:

Flash 提供了五个缓动类,每个缓动类都有三个方法,这些方法指示过渡动画的以下哪一部分应用缓动效果:在动画的开始、结尾或开始和结尾。此外,带有 easeNone 方法的 None 缓动类可用于指示未使用缓动。

下表描述了这 6 个缓动计算类。

缓动类 描述

Back 在过渡范围外的一端或两端扩展动画一次,以产生从其范围外回拉的效果。

Bounce 在过渡范围的一端或两端内添加弹跳效果。弹跳数与持续时间相关,持续时间越长,弹跳数越多。

Elastic 添加一端或两端超出过渡范围的弹性效果。弹性量不受持续时间影响。

Regular 在一端或两端添加较慢的运动。此功能使您能够添加加速效果、减速效果或这两种效果。

Strong 在一端或两端添加较慢的运动。此效果类似于 Regular 缓动类,但它更明显。

None 添加从开始到结尾无任何减速或加速效果的相同的运动。此过渡也称为线性过渡。

这 6 种缓动计算类的每一种都有三个缓动方法,它们指明缓动效果应用于动画的哪个部分。此外,None 缓动类还有第四个缓动方法:easeNone。

下表中描述了这些缓动方法:

方法 描述

easeIn 在过渡的开始提供缓动效果。

easeOut 在过渡的结尾提供缓动效果。

easeInOut 在过渡的开始和结尾提供缓动效果。

easeNone 指明不使用缓动计算。只在 None 缓动类中提供。

下面我们来看看使用方法。 用法:在过渡效果中:

TransitionManager.start()方法的easing:参数用这个值:缓动类名.缓动方法

比如在上面的过渡效果中我们使用了:easing:None.easeNone表示没有用缓动。看上面两个表,可以看出,None是缓动类名,easeNone是类的方法。

下面将上面的缩放过渡的easeing参数改一下用Bounce类的easeOut方法让图片放大后产生一个弹跳的动作:

代码为:

import mx.transitions.*;

import mx.transitions.easing.*;

TransitionManager.start(img1_mc, {type:Zoom, direction:Transition.IN, duration:2, easing:Bounce.easeOut}); 你可以将这个代码与上面的缩放过渡代码比较一下。 其它的过渡效果,就由你自已去试验了。

本课作业:完成本节开头的图片转场效果。

制作建议:将十种过渡效果按上面介绍的方法分别做成MC,并在第50帧上输入:stop();。在主场景第1层放一张背景图片,从第2层开始每隔50帧放一个做好的MC并延长100帧,每层只放1个MC。如第2层第1帧放1个,第100帧插入帧,第3层第51帧放1个,第150帧插入帧,以此类推。

Flash as入门(15):filters类滤镜

--------------------------------------------------------------------------------

日期:2009-02-27 16 作者:sanbos 来源:中国教程网 本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课:影片剪辑第9节使用滤镜,教程详细讲解了Flash的filters类为我们提供的9种滤镜效果,并用实例作了说明,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

用AS实现滤镜效果、

使用滤镜

Flash的filters类为我们提供了9种滤镜效果,要用AS实现滤镜效果,首先仍然需导入filters类: import flash.filters.*;

然后,使用new构造函数,创建一个filters对象,并将它赋值给MC(或文本或按钮)的filters属性从而实现滤镜效果。

下面分别介绍这些滤镜效果:

1. 模糊滤镜:BlurFilter

BlurFilter类可以带来模糊的效果。要创建BlurFilter实例可用下面的方法:

var filter: BlurFilter = new BlurFilter(blurX, blurY, quality); 在BlurFilter的构造函数中使用了三个参数: blurX: 水平模糊量。有效值为 0 到 255(浮点值)。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。

blurY: ― 垂直模糊量。有效值为 0 到 255(浮点值)。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。

quality: ― 应用滤镜的次数。默认值是 1,即表示低品质。值为 2 表示中等品质,值为 3 表示高品质并且接近高斯模糊。

下面还是用一个练习来熟悉模糊滤镜的应用。

导入一张图片将它做成MC,放到舞台上,实例名称为:my_mc. 然后打开帧动作面板,输入下列代码:

import flash.filters.*

var filter:BlurFilter = new BlurFilter(8,8,3); my_mc.filters = [filter];

测试影片,这时图片已变模糊了。效果如下:

我们甚至可以在运行时改变模糊滤镜的参数,使模糊效果是可变的,比如根据鼠标的位置产生不同的模糊效果。将代码改成下面的:

import flash.filters.*

var filter:BlurFilter = new BlurFilter(8,8,3);

my_mc.filters = [filter];

onMouseMove = function() { bx = Math.abs(_xmouse - my_mc._x); by = Math.abs(_ymouse - my_mc._y); filter.blurX = bx/10; filter.blurY = by/10; my_mc.filters = [filter]; }

测试影片,当鼠标移动时,模糊效果发生变化,鼠标距图片中心越远,模糊效果越深。效果如下:

2. 投影滤镜:DropShadowFilter

DropShadowFilter滤镜将产生投影的效果。要创建投影滤镜可用:

var filter: DropShadowFilter = new DropShadowFilter(distance, angleInDegrees,color,alpha,blurX,blurY,strength,quality,inner,knockout,hideObject);

投影影滤镜的参数比较多哈,还是一个一个介绍一下:

distance:― 阴影的偏移距离,以像素为单位。默认值是 4(浮点)。 angle:― 阴影的角度,0 到 360˚(浮点)。默认值是 45。

color:― 阴影颜色,采用十六进制格式 0xRRGGBB。默认值是 0x000000。

alpha:― 阴影颜色的 Alpha 透明度值。有效值为 0 到 1。例如,0.25 设置透明度值为 25%。默认值是 1。

blurX:― 水平模糊量。有效值为 0 到 255(浮点)。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。 blurY:― 垂直模糊量。有效值为 0 到 255(浮点)。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。

strength:― 压印或跨页的强度。该值越高,压印的颜色越深,而且阴影与背景之间的对比度也越强。有效值为 0 到 255。默认值是 1。

quality:― 应用滤镜的次数。有效值为 0 到 15。默认值是 1,它表示低品质。值为 2 表示中等品质,值为 3 表示高品质。

inner:― 表示阴影是否为内侧阴影。值 true 指定内侧阴影。默认为 false,即外侧阴影,它表示对象外缘周围的阴影。

knockout:― 应用挖空效果 (true),这将有效地使对象的填色变为透明,并显示文档的背景颜色。默认值是 false,即不应用挖空效果。

hideObject:― 表示是否隐藏对象。如果值为 true,则表示没有绘制对象本身,只有阴影是可见的。默认值是 false(显示对象)。

做个练习,将上面练习的代码改为:

import flash.filters.*

var filter:DropShadowFilter = new DropShadowFilter(); my_mc.filters = [filter];

测试影片,效果如下:图片产生了投影效果。因为投影滤镜的所有参数都是可选的,所以我们没有给任何参数,即都使用默认值。

同样的我们可以在运时改变投影的参数,从而改变效果。我们将这个效果改变加在图片的点击事件上,即点击图片投影效果发生改变。这里改变了三个参数,偏移量,颜色(随机)和角度。

效果:

http://www.webjx.com/flash/actionscript-9081_2.html

代码如下:

import flash.filters.*

var filter:DropShadowFilter = new DropShadowFilter(); my_mc.filters = [filter];

var i = 1;

my_mc.onRelease = function():Void { if(filter.distance<5){ i=1;

} else if (filter.distance>30){ i=-1; }

filter.distance += i;

filter.color = random(16000000); filter.angle++;

my_mc.filters = [filter]; }

3.发光滤镜:GlowFilter

构造函数:

var filter:GlowFilter = new GlowFilter(color,alpha,blurX,blurY,strength,quality,inner,knockout);

参数:

color:― 光晕颜色,采用十六进制格式 0x RRGGBB。默认值是 0xFF0000。

alpha:― 颜色的 Alpha 透明度值。有效值为 0 到 1。例如,.25 设置透明度值为 25%。默认值是 1。 blurX:― 水平模糊量。有效值为 0 到 255(浮点)。默认值是 6。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,它的呈现速度会比其它值更快。 blurY:― 垂直模糊量。有效值为 0 到 255(浮点)。默认值是 6。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,它的呈现速度会比其它值更快。

strength:― 压印或跨页的强度。该值越高,压印的颜色越深,而且发光与背景之间的对比度也越强。有效值为 0 到 255。默认值是 2。

quality:― 应用滤镜的次数。有效值为 0 到 15。默认值是 1,它表示低品质。值为 2 表示中等品质,值为 3 表示高品质。

inner:― 指定发光是否为内侧发光。值 true 表示内侧发光。默认值是 false,即外侧发光,它表示对象外

缘周围的发光。

knockout:― 指定对象是否具有挖空效果。值为 true 将使对象的填充变为透明,并显示文档的背景颜色。默认值是 false(不应用挖空效果)。

效果:点击图片效果发生变化。

代码如下:

import flash.filters.*

var filter:GlowFilter = new GlowFilter(); my_mc.filters = [filter]; var i = 1;

var j =0.1;

my_mc.onRelease = function():Void { if(filter.blurX<5){ i=1;

} else if (filter.blurX>250){ i=-1; }

if(filter.alpha < 3){ j =0.1;

} else if(filter.alpha >8){ j=-0.1;

}

filter.blurX += i; filter.blurY += i;

filter.color = random(16000000); filter.alpha += j;

my_mc.filters = [filter]; }

4. 渐变发光滤镜:GradientGlowFilter

构造函数:

var filter:GradientGlowFilter = new GradientGlowFilter(distance,angleInDegrees, colors, alphas, ratios, blurX, blurY, strength, quality, type, knockout);

参数:

distance:― 光晕的偏移距离。默认值为 4。

angle:― 角度,以度为单位。有效值为 0 到 360。默认值是 45。

colors: ― 定义渐变的颜色的数组。例如,红色为 0xFF0000,蓝色为 0x0000FF,依此类推。

alphas: ― colors 数组中对应颜色的 Alpha 透明度值的数组。数组中每个元素的有效值为 0 到 1。例如,值为 .25 设置 Alpha 透明度值为 25%。

ratios: ― 颜色分布比例的数组。有效值为 0 到 255。该值定义宽度的百分比,颜色采样率为 100%。 blurX: ― 水平模糊量。有效值为 0 到 255。如果模糊量小于等于 1,则表明原始图像是按原样复制的。

默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。 blurY:― 垂直模糊量。有效值为 0 到 255。如果模糊量小于等于 1,则表明原始图像是按原样复制的。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。 strength: ― 压印或跨页的强度。该值越高,压印的颜色越深,而且发光与背景之间的对比度也越强。有效值为 0 到 255。值越大,压印越强。值为 0 意味着未应用滤镜。默认值是 1。

quality: ― 应用滤镜的次数。有效值为 0 到 15。默认值是 1,它表示低品质。值为 2 表示中等品质,值为 3 表示高品质。

type: ― 滤镜效果的放置。可能的值包括: \"outer\":对象外缘上的发光

\"inner\":对象内缘上的发光;默认值 \"full\":对象顶部的发光

效果:

代码:

import flash.filters.*

var filter:GradientGlowFilter = new GradientGlowFilter(); filter.colors = [0xFFFFFF, 0xFF0000, 0xFFFF00, 0x00CCFF]; filter.alphas = [0.3, 0.5, 0.5, 0.5]; filter.ratios = [0, 63, 126, 255]; filter.blurX = 50; filter.blurY = 50;

filter.type = \"outer\"; my_mc.filters = [filter];

5. 斜角滤镜:BevelFilter(斜角滤镜可产生三维效果。)

构造函数:

var filter:BevelFilter = new BevelFilter(distance, angleInDegrees, highlightColor, highlightAlpha, shadowColor, shadowAlpha, blurX, blurY, strength, quality, type, knockout);

参数:

distance:― 斜角的偏移距离,以像素为单位(浮点)。默认值是 4。 angle:― 斜角的角度,0 至 360 度。默认值是 45。

highlightColor:― 斜角的加亮颜色 0xRRGGBB 。默认值是 0xFFFFFF。

highlightAlpha: ―加亮颜色的 Alpha 透明度值。有效值为 0 到 1。例如,.25 设置透明度值为 25%。默认值是 1。

shadowColor:― 斜角的阴影颜色 0xRRGGBB 。默认值是 0x000000。

shadowAlpha: ― 阴影颜色的 Alpha 透明度值。有效值为 0 到 1。例如,0.25 设置透明度值为 25%。默认值是 1。

blurX: ― 水平模糊量,以像素为单位。有效值为 0 到 255(浮点)。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。

blurY: ― 垂直模糊量,以像素为单位。有效值为 0 到 255(浮点)。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。

strength: ― 压印或跨页的强度。该值越大,压印的颜色越深,而且斜角与背景之间的对比度也越强。有效值为 0 到 255。默认值是 1。

quality: ― 应用滤镜的次数。默认值是 1,即表示低品质。值为 2 表示中等品质,值为 3 表示高品质。 type:― 斜角的类型。有效值为 \"inner\"、\"outer\" 和 \"full\"。默认值为 \"inner\"。

knockout: ― 应用挖空效果 (true),这将有效地使对象的填色变为透明,并显示文档的背景颜色。默认值是 false(不应用挖空效果)。

效果:

代码:

import flash.filters.*

var filter: BevelFilter = new BevelFilter (); filter.distance = 8;

filter.highlightColor = 0xcccccc; my_mc.filters = [filter];

你可以调整其它参数,创建不同的效果。

6. 渐变斜角滤镜:GradientBevelFilter

构造函数:

var filter:GradientBevelFilter = new GradientBevelFilter(distance, angleInDegrees, colors, alphas, ratios, blurY, quality, type, knockout);

参数:

distance: ― 偏移距离。有效值为 0 到 8。默认值为 4。

angle: ― 角度,以度为单位。有效值为 0 到 360。默认值是 45。

colors: ― 渐变中使用的 RGB 十六进制颜色值的数组。例如,红色为 0xFF0000,蓝色为 0x0000FF,依此类推。

alphas: ― colors 数组中对应颜色的 Alpha 透明度值的数组。数组中每个元素的有效值为 0 到 1。例如,.25 设置透明度值为 25%。

ratios: ― 颜色分布比例的数组;有效值为 0 到 255。

blurX: ― 水平模糊量。有效值为 0 到 255。如果模糊量小于等于 1,则表明原始图像是按原样复制的。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。 blurY: ― 垂直模糊量。有效值为 0 到 255。如果模糊量小于等于 1,则表明原始图像是按原样复制的。默认值是 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。 strength: ― 压印或跨页的强度。该值越高,压印的颜色越深,而且斜角与背景之间的对比度也越强。有效值为 0 到 255。值为 0 表明没有应用滤镜。默认值是 1。

quality: ― 滤镜的质量。有效值为 0 到 15。默认值是 1。几乎在所有情况下,有用值都是 1(低品质)、2(中等品质)和 3(高品质)。滤镜的值越小,呈现速度越快。 type: ― 斜角效果的放置。可能的值包括: \"outer\" :对象外缘上的斜角

\"inner\" :对象内缘上的斜角 \"full\" :对象顶部的斜角

默认值为 \"inner\"。

knockout: ― 指定是否应用挖空效果。值为 true 将使对象的填充变为透明,并显示文档的背

效果:

代码:

var filter:GradientBevelFilter = new GradientBevelFilter(); filter.colors = [0x005500,0x005588 ,0xffffff, 0x00aa00];; filter.alphas= [1,1, 0, 1]; filter.ratios= [0,64, 128, 255]; filter.blurX =20; filter.blurY= 20; filter.distance=32; my_mc.filters =[filter];

7. 矩阵颜色滤镜:ColorMatrixFilter

使用这个滤镜可以将一个4x5的矩阵应到MC(或位图)上,从面改变MC的色相,透明度及亮度等。我想这个滤镜的难点应该是对这个矩阵的理解上。RGB 颜色由红绿蓝三种色组成,矩阵将各像素颜色拆分成红绿蓝三种色另加一个透明度。共四个通道。每个通道由5组值组成这就形成了一个4x5的矩阵。看看下图,来理解一下:

红 绿 蓝 透明度 结果 红色 1 0 0 0 0 绿色 0 1 0 0 0 蓝色 0 0 1 0 0

透明度 0 0 0 N 0(N为0.1-1)

从上面的矩阵中可看出,每个通道在其相应的位置设置了值,最小是0,最大为1,改变这些值就可改变图象的色相及透明度。结果的数值改变可改变图象的亮度。比如将矩阵中红色通道的值由1改为0.5,那么图象中的红色元素将会降低。

在实际应用中,将这个矩阵赋值给一个数组,再将这个数组作为ColorMatrixFilter类构造函数的参数,最后将MC的filters属性设为ColorMatrixFilter类的实例。这同使用其它滤镜一样。

先来做一个增加图片亮度的练习:

效果:

将代码改为:

import flash.filters.*;

var matrix:Array = new Array();

matrix = matrix.concat([1, 0, 0, 0, 100]); // red matrix = matrix.concat([0, 1, 0, 0, 100]); // green matrix = matrix.concat([0, 0, 1, 0, 100]); // blue matrix = matrix.concat([0, 0, 0, 1, 0]); // alpha

var filter:ColorMatrixFilter = new ColorMatrixFilter(matrix); my_mc.filters = [filter];

测试影片,可以片到图片亮度被增大了很多。这是将矩阵中红绿蓝通道的结果值都改为了100得到的结果。 下面一个练习是动态改变红绿蓝三种色的值,从而改变色相。通过鼠标在屏幕上的位置来确定各颜色的值,当鼠标移动时动态改变。

效果:

代码:

import flash.filters.*;

onMouseMove = function() {

var xPercent:Number = 1 - (_xmouse/Stage.width); var yPercent:Number = 1 - (_ymouse/Stage.height); var matrix:Array = new Array();

matrix = matrix.concat([yPercent, 0, 0, 0, 0]); // red matrix = matrix.concat([0, xPercent, 0, 0, 0]); // green matrix = matrix.concat([0, 0, xPercent, 0, 0]); // blue matrix = matrix.concat([0, 0, 0, 1, 0]); // alpha

var filter:ColorMatrixFilter = new ColorMatrixFilter(matrix); my_mc.filters = [filter]; }

8. 卷积滤镜:ConvolutionFilter

卷积滤镜同样用一个矩阵于图象可形成如模糊、边缘检测、锐化、浮雕和斜角等多种效果。卷积滤镜重新计算每个像素,并根据矩阵将像素及其周围的象素要加得也该像素的新颜色。最常用的矩阵是3x3的矩阵,如下图: N N N N P N

N N N

在这个矩阵中P代表本身的像素,而N代表周围的像素。那么下面这个矩阵: 0 0 0 0 1 0 0 0 0

可以看出将这个矩阵用于图象时,图象没有变化,因为除自已外周围的像素均为0,即周围像素对中间的P像素没有影响。

将矩阵存入一个数组,并将它作为ConvolutionFilter类构造函数的一个参数,可实现卷积滤镜效果,除了矩阵参数处ConvolutionFilter构造函数还有其它的一些参数:

matrixX ― 矩阵的 x 维度(矩阵中列的数目)。默认值是 0。

matrixY: ― 矩阵的 y 维度(矩阵中行的数目)。默认值是 0。

matrix: ― 用于矩阵转换的值的数组;返回一个副本。数组中的项数必须等于 matrixX*matrixY。 divisor: ― 矩阵转换中使用的除数。默认值是 1。这个参数如果与矩阵值的总和相等,那么图象的亮度无变化。比如这个矩阵: 0 1 0 1 1 1 0 1 0

里面有5个1,那么矩阵总值为5,如果divisor参设为5,则图象的亮度无变化。如果本参数为1,那么图象的亮度是原图象的5/1倍,这时图象就很亮了。如果本参数为10,那么原图片的亮度为5/10,显然图片就变暗了。

bias: ― 要添加到矩阵转换结果的偏差。默认值是 0。

preserveAlpha: ― 值为 false 表明卷积应用于所有通道,包括 Alpha 通道。值为 true 表示只对颜色通道应用卷积。默认值为 true。

clamp: ― 对于源图像之外的像素,如果值为 true,则表明通过复制输入图像给定边缘处的颜色值,沿着输入图像的每个边框按需要扩展输入图像。如果值为 false,则表明应按照 color 和 alpha 属性中的指定使用其它颜色。默认值是 true。

color: ― 要替换源图像之外的像素的十六进制颜色。 alpha: ― 替换颜色的 Alpha。

下面是几个基本效果的矩阵:

基本模糊(除数 5): 0 1 0 1 1 1 0 1 0

锐化(除数 1): 0, -1, 0 -1, 5, -1 0, -1, 0

边缘检测(除数 1): 0, -1, 0 -1, 4, -1 0, -1, 0

浮雕效果(除数 1): -2, -1, 0 -1, 1, 1 0, 1, 2

练习:将上面几个矩阵效果应用于图片,点击图片一次,变换一种效果。

效果:

代码:

import flash.filters.*;

var i =0;

my_mc.onRelease = function(){ i++; if(i>4){ i=1; }

switch(i){ case 1:

var matrixArr:Array =[0,1,0,1,1,1,0,1,0];

var convolution:ConvolutionFilter = new ConvolutionFilter(3, 3, matrixArr,5); my_mc.filters = [convolution]; break; case 2:

var matrixArr:Array = [0, -1, 0,-1, 5, -1, 0, -1, 0];

var convolution:ConvolutionFilter = new ConvolutionFilter(3, 3, matrixArr,1); my_mc.filters = [convolution]; break; case 3:

var matrixArr:Array = [0, -1, 0,-1, 4, -1, 0, -1, 0];

var convolution:ConvolutionFilter = new ConvolutionFilter(3, 3, matrixArr,1); my_mc.filters = [convolution]; break; case 4:

var matrixArr:Array = [-2, -1, 0,-1, 1, 1,0, 1, 2];

var convolution:ConvolutionFilter = new ConvolutionFilter(3, 3, matrixArr,1); my_mc.filters = [convolution]; break; } }

图片置换滤镜:

mapBitmap: ― 包含置换映射数据的 BitmapData 对象。

mapPoint: ― 一个 flash.geom.Point 值,它包含目标影片剪辑的左上角与映射图像左上角之间的偏移量。 componentX: ― 说明在映射图像中使用哪个颜色通道来置换 x 结果。 可能的值如下所示: • • • •

1(红色) 2(绿色) 4 (蓝色) 8 (alpha)

componentY: ― 说明在映射图像中使用哪个颜色通道来置换 y 结果。可能的值如下所示: • 1 (红色) • 2(绿色) • 4(蓝色) • 8 (alpha)

scaleX: ― 用于缩放映射计算的 x 置换结果的乘数。 scaleY: ― 用于缩放映射计算的 y 置换结果的乘数。 mode: [可选] ― 滤镜的模式。可能的值如下所示: \"wrap\" -- 将置换值折返到源图像的另一侧。 \"clamp\" -- 将置换值锁定在源图像的边缘。

\"ignore\" -- 如果置换值超出了范围,则忽略置换并使用源像素。

\"color\" -- 如果置换值在图像外,则替换由滤镜的 alpha 属性和 color 属性组成的像素值。

color: [可选] ― 指定对于超出范围的替代应用什么颜色。置换的有效范围是 0.0 到 1.0。如果 mode 设置为 \"color\",则使用此参数。

alpha: [可选] ― 指定对于超出范围的替换应用什么 Alpha 值。它被指定为 0.0 到 1.0 之间的标准值。例如,0.25 设置透明度值为 25%。默认值是 0。如果 mode 设置为 \"color\",则使用此参数。

代码:

import flash.filters.DisplacementMapFilter; import flash.geom.Point;

import flash.display.BitmapData;

var perlinBmp:BitmapData;

var displacementMap:DisplacementMapFilter;

perlinBmp = new BitmapData(my_mc._width, my_mc._height);

perlinBmp.perlinNoise(my_mc._width, my_mc._height, 10, Math.round(Math.random() * 100000), false, true, 1, false);

displacementMap = new DisplacementMapFilter(perlinBmp, new Point(0, 0), 1, 1, 100, 100, \"color\"); // my_mc.filters = [displacementMap];

my_mc.onRollOver = function():Void { onEnterFrame = function (){

perlinBmp.perlinNoise(my_mc._width, my_mc._height, 10, Math.round(Math.random() * 100000), false, true, 1, false);

my_mc.filters = [displacementMap]; }

};

my_mc.onRollOut = function(){ delete onEnterFrame; my_mc.filters = []; }

Flash as入门(16):用AS绘制各种图形

--------------------------------------------------------------------------------

日期:2009-02-27 16 作者:sanbos 来源:中国教程网

本例继续讲解AS的基础知识,今天我们来学习Flash AS入门系列教程第七课:影片剪辑第10节用AS绘图,教程详细讲解了运用AS绘制各种图形的方法,对Flash的AS编程有兴趣的朋友可以到论坛与作者交流。

用AS绘图

AS2.0这我们提供了一些绘图方法,利用这些方法,我们可以绘制一些图形。下面来认识一下这些方法。首先是画直线,要画线应先确定线的类型等,AS提供的是:

lineStyle() 方法:该方法确定线条的类型。

常用格式:MC.lineStyle(粗细,颜色,透明度)。该方法还有其它一些参数,本文就不介绍了。 比如:my_mc. lineStyle(1,0xff0000,100)

这就指明了线条粗细为1,颜色是红色,透明度为100%。

有了线条样式后就可以画直线了,首先将画笔移到要开始画直线的起始点上,AS提供了: moveTo()方法:该方法将画笔移到起画点上。 用法:MC.moveTo(x,y);

起画点有了,就可以画线了,AS提供了:

lineTo()方法: 该方法将从起画点到终点画一条直线,并将起画点移到终点。 用法:MC.lineTo(x,y)

有了上面的三个方法就可以画直线了,下面就画一条:

this.lineStyle(1,0xff0000,100); this.moveTo(0,0); this.lineTo(200,200);

测试影片,上面的代码画了一条从(0,0)到(200,200)的红色直线。

下面扩展一下,画个三角形:

this.lineStyle(1,0xff0000,100); this.moveTo(200,200); this.lineTo(300,200); this.lineTo(250,300); this.lineTo(200,200);

我想我们绘画,肯定不会甘心只画一些线条,还想画一些形状,下面的方法对我们这种愿望提供了可能。

beginFill()方法:该方法从字面上就能理解,开始填充。 用法:MC.beginFill(颜色,透明度)

endFill()方法:用beginFill()中的颜色填充图形。 比如将上面的三角形填上蓝色:

this.lineStyle(1,0xff0000,100); this.beginFill(0x0000ff,100); this.moveTo(200,200); this.lineTo(300,200); this.lineTo(250,300); this.lineTo(200,200); ebdFill();

测试影片,会看到一个红色笔触蓝色填充的三角形。

如果想要无笔触的三角形,那么上面第一句不要就行了。

看起来到目前为止,我们已经自认为已学会了用AS绘图了,很想跃跃欲试画点什么玩意儿,好吧,就满足你吧,下面我们来画一个五星吧^_^

用矩形工具画一个与舞始一样大的黑色矩形。为什么要画这个?很简单,黑色背景下红五星要好看些。为什么不直接将文档的背景色设为黑色?因为很多网站插入的swf文件默认是透明的,比如我们论坛。当然你完全可以连这个黑色矩形都用AS来完成。

将下列代码输入到帧动作面板中:

this.createEmptyMovieClip(\"wx_mc\ wx_mc._x = Stage.width/2; wx_mc._y = Stage.height/2;

wx_mc.beginFill(0xFF0000,100); wx_mc.moveTo(0,0); wx_mc.lineTo(0,-100);

wx_mc.lineTo(25,-30); wx_mc.lineTo(0,0);

wx_mc.endFill();

wx_mc.beginFill(0xee0202,100); wx_mc.moveTo(0,0); wx_mc.lineTo(0,-100); wx_mc.lineTo(-25,-30); wx_mc.lineTo(0,0); wx_mc.endFill(); for(i=0;i<5;i++){

wx_mc.duplicateMovieClip(\"wx1\"+i,this.getNextHighestDepth()); wx1 = eval(\"wx1\"+i); wx1._rotation = i*72;

}

this.createEmptyMovieClip(\"xg_mc\ xg_mc._x = Stage.width/2; xg_mc._y= Stage.height/2; xg_mc.lineStyle(1,0xeed600,100); xg_mc.moveTo(0,-120); xg_mc.lineTo(0,-140); xg_mc.moveTo(10,-160); xg_mc.lineTo(10,-180);

for(j=0;j<37;j++){

xg_mc.duplicateMovieClip(\"xg\"+j,this.getNextHighestDepth()); xg1_mc = eval(\"xg\"+j); xg1_mc._rotation = j*10; }

测试影片,效果出来了。

代码分析:

首先创建一个空的MC“wx_mc”用来绘制五星。并将wx_mc放到舞中央。 this.createEmptyMovieClip(\"wx_mc\

wx_mc._x = Stage.width/2; wx_mc._y = Stage.height/2;

接下来画一个红色三角形,从下面的代码中可以看到,三角形的右下角在wx_mc的注册点上,即舞台中央,这一点很重要,因为我们后面要旋转这个三角形。 wx_mc.beginFill(0xFF0000,100); wx_mc.moveTo(0,0); wx_mc.lineTo(0,-100); wx_mc.lineTo(25,-30); wx_mc.lineTo(0,0);

wx_mc.endFill();

接下来,继续画图又画了一个三角形,这个三角形与第一个三角形刚好水平相反,这样就组成了五星的一

只角,而这个三角形的颜色比第一个三角形略深,这样就形成了立体感。 wx_mc.beginFill(0xee0202,100); wx_mc.moveTo(0,0); wx_mc.lineTo(0,-100);

wx_mc.lineTo(-25,-30); wx_mc.lineTo(0,0); wx_mc.endFill();

有了一只角了,要形成五星就简单了,复制5份,然后每份旋转360/5x份数,五星就绘成了。 for(i=0;i<5;i++){

wx_mc.duplicateMovieClip(\"wx1\"+i,this.getNextHighestDepth());

wx1 = eval(\"wx1\"+i); wx1._rotation = i*72; }

五星画好了,还想加些光辉,那又新建一个MC,用来画光辉,就在五星外围画一条直线,然后复制直线36份,每10度放一份就行了。用同样的方法画第二层光辉。 this.createEmptyMovieClip(\"xg_mc\ xg_mc._x = Stage.width/2; xg_mc._y= Stage.height/2;

xg_mc.lineStyle(1,0xeed600,100); xg_mc.moveTo(0,-120); xg_mc.lineTo(0,-140); xg_mc.moveTo(10,-160); xg_mc.lineTo(10,-180); for(j=0;j<37;j++){

xg_mc.duplicateMovieClip(\"xg\"+j,this.getNextHighestDepth()); xg1_mc = eval(\"xg\"+j); xg1_mc._rotation = j*10; }

上面画的图形全部是直线的,这时我们又想画点花儿什么的,需要用到曲线,有画曲线的方法吗?有,下面就来学习

curveTo() 方法:该方法画一条由起画点经控制点到终点的一条曲线。 用法:MC. curveTo(控制点x,控制点y,终点x,终点y);

有了画曲线的方法那就画个花儿吧。

代码:

this.createEmptyMovieClip(\"mh_mc\ mh_mc._x = Stage.width /2; mh_mc._y = Stage.height/2; mh_mc.beginFill(0xff0000,100); mh_mc.moveTo(0,0);

mh_mc.curveTo(-20,-25,-10,-45); mh_mc.curveTo(0,-60,10,-45);

mh_mc.curveTo(20,-25,0,0); mh_mc.endFill();

for(i=0;i<5;i++){

mh_mc.duplicateMovieClip(\"mh\"+i,this.getNextHighestDepth()); mh1_mc = eval(\"mh\"+i); mh1_mc._rotation= i*72; }

实际上这个花的画法跟五星差不多,只是这个是曲线的而已。

现在问题又来了,这花的颜色不理想,是纯色的,在flash创作工具中还有个叫什么渐变填充的家伙,可以搞出些更好的效果,在AS中同样有这家伙。

beginGradientFill()方法:该方法可实现渐变填充。

参数:fillType: ― 线性渐变用\"linear\",放射渐变用\"radial\"。

colors: ― 用于渐变色的 RGB 十六进制颜色值的数组;例如,红色为 0xFF0000,蓝色为 0x0000FF。可以至多指定 15 种颜色。对于每种颜色,请确保在 alphas 和 ratios 参数中指定对应值。

alphas: ― colors 数组中对应颜色的 Alpha 值数组;有效值为 0 到 100。如果值小于 0,则 Flash 使用 0。如果值大于 100,则 Flash 使用 100。

ratios: ― 颜色分布比例数组;有效值为 0 到 255。即渐变中每种颜色的比例值,可以理解为颜色面板中,渐变色的滑块的位置。比如在colors参数为:[0xFF0000,0x0000FF],本参数为:[250,255],那么就相当于在混色器中的这种情况:

matrix: ― 一个转换矩阵:

flash.geom.Matrix 类包括 createGradientBox() 方法,通过该方法可以方便地设置矩阵,以便用于 MovieClip 类的 beginGradientFill() 方法。 用法:首先需要导入flash.geom.Matrix类

import flash.geom.*

然后,创建一个flash.geom.Matrix类的实例,再调用createGradientBox方法:

matrix = new Matrix();

matrix.createGradientBox(渐变范围的宽,渐变范围的高,旋转, x轴方向的偏移量,y轴方向的偏移量); x轴方向的偏移量:一般为要填充的形状的x减去渐变范围的宽。 y轴方向的偏移量:一般为要填充的形状的y减去渐变范围的高。 根据形状可调。

这里边的4个参数想一下渐变填充工具就清楚了。

focalPointRatio: [可选] ― 在 Flash Player 8 中添加。一个数字,控制渐变焦点的位置。值 0 表示焦点位于中心。值 1 表示焦点位于渐变圆的一条边界上。值 -1 表示焦点位于渐变圆的另一条边界上。小于 -1 或大于 1 的值将被舍入为 -1 或 1。

有了这个方法我们就想把那朵花搞成桃花了,使用由红色到粉红色的放射填充。

效果:

代码:

import flash.geom.*;

this.createEmptyMovieClip(\"mh_mc\ mh_mc._x = Stage.width /2;

mh_mc._y = Stage.height/2;

var color:Array = [0xFF0000,0xfee7f8];

var alph:Array= [100,100]; var rotio:Array = [0,255]; var matrix = new Matrix();

matrix.createGradientBox(40,100,Math.PI,-20,-40);//这里要填充的形状注册点是(0,0)这样就算出了-20,和-40(调整后的)

mh_mc.beginGradientFill(\"radial\ mh_mc.moveTo(0,0);

mh_mc.curveTo(-20,-25,-10,-45); mh_mc.curveTo(0,-60,10,-45); mh_mc.curveTo(20,-25,0,0); mh_mc.endFill();

for(i=0;i<5;i++){

mh_mc.duplicateMovieClip(\"mh\"+i,this.getNextHighestDepth()); mh1_mc = eval(\"mh\"+i); mh1_mc._rotation= i*72; }

this.createEmptyMovieClip(\"hz_mc\ hz_mc._x =Stage.width/2; hz_mc._y = Stage.height/2; hz_mc.lineStyle(6,663333,100);

hz_mc.moveTo(0,0);

hz_mc.curveTo(-5,110,0,160);

this.createEmptyMovieClip(\"hy_mc\ hy_mc._x =Stage.width/2; hy_mc._y = Stage.height/2;

color = [0x0e730d,0x06db2b];

matrix.createGradientBox(60,20,Math.PI,10,50);

hy_mc.beginGradientFill(\"radial\ hy_mc.moveTo(0,70); hy_mc.curveTo(35,40,70,50); hy_mc.curveTo(35,90,0,70);

hy_mc.endFill();

hy_mc.duplicateMovieClip(\"hy1_mc\ hy1_mc._xscale = -100; hy1_mc._x =hy_mc._x -6; hy1_mc._y =hy_mc._y +10;

差不多了,再做两个练习,一个是涂鸦板的制作,一个是动态引导线的效果。 涂雅板的制作:

效果在左边选择颜色和粗细后,可在右边绘图。

按下图画好图形,并将每个图形转换为MC.

实例名称:

黑色-hs_mc; 红色-hongs_mc; 橙色-cs_mc; 黄色-huans_mc; 绿色-lus_mc; 蓝色_nans_mc; 紫色-zs_mc; 大园-m6_mc; 二园-m4_mc; 三园_m3_mc; 幺园-m1_mc;

新插入一层,打开帧动作面板,输入: var color = 0x000000; var dx =1;

var h:Boolean = true;

hs_mc.onRelease = function (){ color = 0x000000; }

hongs_mc.onRelease = function (){ color = 0xFF0000; }

cs_mc.onRelease = function (){ color = 0xFF9900; }

huans_mc.onRelease = function (){ color = 0xFFFF00; }

lus_mc.onRelease = function (){ color = 0x00FF00; }

nans_mc.onRelease = function (){

鼠绘引导线: 用鼠标画一条引导线,小球将按引导线运动.

画一个球,或者你喜欢的任何玩意儿,转换为MC,实例名称为:ball_mc. 然后在帧动作面板中输入: var a:Array;

this.onMouseDown = function() { this.lineStyle(1, 0x0000ff, 100); a = new Array();

a.push(_xmouse, _ymouse); this.moveTo(_xmouse, _ymouse); this.onMouseMove = function() { a.push(_xmouse, _ymouse); this.lineTo(_xmouse, _ymouse); }; };

this.onMouseUp = function() { delete this.onMouseMove;

var z:Number = new Number(); this.onEnterFrame = function() { ball_mc._x = a[z++]; ball_mc._y = a[z++]; if(z>a.length){ delete onEnterFrame; this.clear(); }; } };

color = 0x0000FF;

}

zs_mc.onRelease = function (){ color = 0xFF00FF; }

m1_mc.onRelease = function(){ dx = 1; }

m3_mc.onRelease = function(){ dx = 3;

}

m4_mc.onRelease = function(){ dx = 4; }

m6_mc.onRelease = function(){ dx = 6; }

onMouseDown = function(){ if(_xmouse >170){ h=true; }

lineStyle(dx,color,100);

moveTo(_xmouse,_ymouse);

}

onMouseMove = function(){ if(_xmouse <170){ h=false;

} if(h){

lineTo(_xmouse,_ymouse); } }

onMouseUp= function(){ h=false;; }

因篇幅问题不能全部显示,请点此查看更多更全内容