分类
Flash

Flash CS3 新增组件——ColorPicker

Adobe Flash CS3 Professional组件比较少,增加了ColorPicker组件、TileList、Silder等组件。本教程将介绍ColorPicker组件。

早在Flash MX时代,ColorPicker组件就开始出现在FUI Components Set 4中。而现在,它已经在Adobe Flash CS3 Professional中自带了。该组件与DataField组件的功能有些类似,它会显示一个或多个色样列表供用户选择。默认情况下,该组件在方块按钮上显示单个的色样。当用户单击该按钮时,将弹出一个面板显示整个色样列表。

selectedColor是ColorPicker组件最重要的属性,该属性用来获取和设置ColorPicker组件色盘中当前选择(高亮显示)的色样,默认值为0x000000。

一、ColorPicker

下面以一个简单实例来讲一讲ColorPicker的用法。
1. 选择Flash Flie(ActionScript 3.0),新建ColorPicker.fla 文档,拖曳一个?ColorPicker实例到舞台中,命名为cp。
2. 新增一个脚本层,添加以下代码:

//定义一个Shape对象
var circle:Shape = new Shape();
circle.x = 80;
circle.y = 80;
//自定义函数初始化Shape实例并将其添加到舞台
addChild(circle);
//注册侦听器
cp.addEventListener(Event.ENTER_FRAME, colorChange);
//自定义侦听器函数
function colorChange(e:Event):void {
var cp:ColorPicker = e.target as ColorPicker;
drawCircle(circle, cp.selectedColor);
}
//自定义drawCircle函数
function drawCircle(circle:Shape, newColor:uint):void {
//清除graphics
circle.graphics.clear();
//开始填充
circle.graphics.beginFill(newColor, 1);
//画圆
circle.graphics.drawCircle(0, 0, 50);
//结束填充
circle.graphics.endFill();
}

3. 测试预览电影,点击此处查看效果。

二、自定义类

上述实例中,为方便对比,一方面我们用ActionScrip动态创建了Shape实例,另一方面又使用拖动库元件来实例化对象。下面我们加大一些难度,全部动态创建实例,并且将代码从时间线移出来,将它封装成自定义类。具体步骤如下:
1. 新建ColorPickerDemo.AS文档,添加如下代码,然后将其保存到com\riafan\tutorials目录下。

package com.riafan.tutorials {
import fl.controls.ColorPicker;
import fl.controls.ComboBox;
import flash.display.BlendMode;
import flash.display.Shape;
import flash.display.Sprite;
import flash.events.*;
public class ColorPickerDemo extends Sprite {
//定义一个Shape对象
var circle:Shape = new Shape();
//定义一个ColorPicker对象
var cp:ColorPicker = new ColorPicker();
public function ColorPickerDemo():void {
initCircle();
initColorPicker();
//添加事件监听器
cp.addEventListener(Event.ENTER_FRAME, colorChange);
}
//自定义侦听器方法
private function colorChange(e:Event):void {
var cp = e.target as ColorPicker;
drawCircle(circle, cp.selectedColor);
}
//自定义方法初始化Shape实例并将其添加到舞台
private function initCircle():void {
circle.x = 80;
circle.y = 80;
//动态将Shape的实例添加到舞台
addChild(circle);
}
//自定义方法初始化ColorPicker实例并将ColorPicker的实例添加到舞台
private function initColorPicker():void {
cp.x = 150;
cp.y = 60;
addChild(cp);
}
//自定义drawCircle方法
private function drawCircle(circle:Shape, newColor:uint):void {
//清除graphics
circle.graphics.clear();
//开始填充
circle.graphics.beginFill(newColor, 1);
//画圆
circle.graphics.drawCircle(0, 0, 50);
//结束填充
circle.graphics.endFill();
}
}
}

2. 选择Flash Flie(ActionScript 3.0),新建ColorPickerDemo.fla 文档。
3. 拖曳ColorPicker组件到库中, 在属性面板中的文档类文本框中键入全限定类名称:com.riafan.tutorials.ColorPickerDemo。
4. 测试预览电影,效果和前面的一样。

注意:
1. Flash CS3 中的组件类都放到fl.controls包中,以前是mx.controls包。
2. 如果不是用在自定义类中,可以不用导入内置类。