查看此帖的完整版本:变换的色彩阅读 3888 次

作者:dmacro 05/11/2003 11:26:52

变换的色彩
我们用Flash MX来设计一个色彩的变换效果,可以同时变幻无数种色彩。我们设定了四种色彩变换区域,观赏者只需要点击中间的圆圈按钮,就可以改变四个格子中的颜色。

制作步骤:

步骤1 建一个文件大小为200×200的Flash MX文件,背景为白色。

步骤2 在插入菜单下选择新建“New Symbol”,在弹出的对话框中选择“Movie Clip”,取名为“方块”。在“方块”编辑场景中,选中工具箱中的矩形工具,按住键盘Shift键,画一个正方形,大小为100×100,颜色为黑色,位置为-50×-50。

步骤3 再建一个新元件,在弹出的对话框中选择“Button”,取名为“按钮”。然后选中工具箱中的圆形工具,在弹起“Up”状态下,画一个圆圈,圆圈的边框为白色,中间填充色为桔黄色,大小为53×53,位置为-26.5×-26.5。在指针经过“Over”状态下增加一个关键帧,这里把圆圈的边框颜色和填充颜色对换,边框为桔黄色,填充色为白色(如图2)。

步骤4 回到主场景,把第一层的名称改为“方块”。然后从库“Library”中把“方块”元件拖到这里。一共拖四次,第一个方块在属性面板中给它定义为“1”,场景中的位置为0×0。第二个方块在属性面板中定义为“2”,位置为100×0。第三个方块定义它的名称为“3”,位置为0×100。第四个方块的名称为“4”,位置为100×100。

步骤5 新建一层取名为“边线”,用两条白色的直线把“方块”层中四个方块的边线区分出来(如图3)。

步骤6 再建一个“按钮”层,把“按钮”元件拖到两条边线十字交叉位置。

步骤7 下面该是给各个元件添加代码了,通过ActionScript代码来实现按钮控制背景颜色的变幻。

首先分别给每一个方块添加一组代码:

onClipEvent (load) {

myNum = _name;

}

onClipEvent (enterFrame) {

 _root["r"+myNum+"Diff"] = _root["r"+myNum+"New"]-_root["r"+myNum+"Old"];

 _root["r"+myNum+"Change"] = _root["r"+myNum+"Diff"]/10;

 _root["g"+myNum+"Diff"] = _root["g"+myNum+"New"]-_root["g"+myNum+"Old"];

 _root["g"+myNum+"Change"] = _root["g"+myNum+"Diff"]/10;

 _root["b"+myNum+"Diff"] = _root["b"+myNum+"New"]-_root["b"+myNum+"Old"];

 _root["b"+myNum+"Change"] = _root["b"+myNum+"Diff"]/10;

swatchColor = new Color(this);

 swatchColor.setRGB(_root["r"+myNum+"Change"]<< 16 | _root["g"+myNum+"Change"] << 8 |

_root["b"+myNum+"Change"]);

_root["r"+myNum+"Old"] -= _root["r"+myNum+"New"]-_root["r"+myNum+"Change"];

_root["g"+myNum+"Old"] -= _root["g"+myNum+"New"]-_root["g"+myNum+"Change"];

 _root["b"+myNum+"Old"] -= _root["b"+myNum+"New"]-_root["b"+myNum+"Change"];

}

然后给按钮添加一个Action动作:

on (release) {

for (i=1; i<5; i++) {

_root["r"+i+"New"] = random(255);

_root["g"+i+"New"] = random(255);

_root["b"+i+"New"] = random(255);

_root["b"+i+"New"] = random(255);

 }

}

本篇通过运用Flash MX中的随机取色实现色彩变换,这是MX版本在ActionScript程序中增加的一个新功能,最后的动画输出要使用Flash6播放器,低本版的播放器不能正常观察动画效果。

作者:羽忆 17/01/2005 20:45:00



分页:[1]