怎样使用Flash拾色器教程(翻译)

Posted by wpm on Jun 5, 2010 in ActionScript, Articles, Flash, Tutorials, Uncategorized |

原文链接:http://www.graphicmania.net/how-to-use-the-color-picker-in-flash-tutorial/

这个我们将要建立的应用程序,我肯定你已经在许多网站上见到过了。一种你可以改变某物体(汽车,衣服等)的颜色的情况。我们现在所讲的很简单,但是你在这一课上所学习的能够帮助你完成更加复杂的应用。

这是最终的效果预览。

建立一个新的 actionscript 3.0flash文件

设置场景大小为400*100,背景为灰色(#CCCCCC)

flash文件中使用的层级结构如下图所示:

建立如下这些层:

Background – 建立一个背景元件。使用白色颜色填充和宽0.1颜色为#666666边线的矩形工具,选择粗糙笔触样式,画一个矩形框。转换为元件,命名为background。确保你设置background为最底层(使用修改——>排列——>移至底层);锁定背景层。

Text – 建立两个文本框。
第一个是静态文本。文本框大小为153.65*19,并把它置于舞台上坐标为(x:53.3,y:65.45),在文本框中输入”当前被选择的颜色“,选择对齐方式为右对齐。我选择字体为veranda(为系统字体) ,确保嵌入你自己的字体。
第二个文本框在第一个的右边,是一个动态文本框。文本框大小为135.85*19,把它放在舞台上坐标为(205.8,65.55);给这个文本框取个实例名” myColor“;选择对齐方式为左对齐。我选择字体为veranda(为系统字体) ,确保嵌入你自己的字体。

colorpicker – 选择拾色器组件(窗口——>组件),拖到舞台上。在第一个文本框之上,坐标为(175.45,37)。

circle – 使用椭圆工具,在拾色器左边画一个圆,大小和颜色你可以自己决定,我画的圆是黑色填充没有边线的。大小为34.5*34.5,位置为(136.2,265.)

我们已经完成了设计,现在打开动作面板,我们将要添加一些actionscript代码来实现当用户从拾色器中选择了新的颜色时,改变圆的颜色,并在文本框中显示改变后的颜色值。在动作层,右击第一个关键帧并打开动作面板(或按F9)。

我们需要做的第一件事情是导入需要的类。

现在我们给拾色器设置默认显示值。默认值为圆的颜色。我们也可以预先定义一组颜色值到拾色器中供用户选择。如果你希望拾色器中所有颜色值都有效,你可以将ColorPicker.colors这一行注释掉。

接下来我们设置一个colorInfo 的变量类型为ColorTransform,并设置文本框显示当前颜色即默认值。

添加一个监听拾色器改变的事件,并在改变颜色时调用changedColor 方法。这个方法将改变圆的颜色,并更新文本框的显示。

好了,我们完成了。我希望你们喜欢这篇自学材料,并能学到些有用的东西。
如果你有任何问题,请留言,或者联系我。

Johnny

代码:拾色器代码

Tags: , ,