Flash Builder4.0
Windows7
Flex
ActionScript
截图工具
第一步,首先,在Flex项目中的src目录下的默认包新建一个Flex应用程序,取名为“LabelColor.mxml”,默认的模版,如下图所示:
第二步,在Application中添加三个标签组件,使用Label组件,
第三步,由于这样三个标签的布局非常混乱,添加一个VBox和HBox,HBox是三个标签水平布局,VBox是使三个标签跟后面的组件垂直分布,如下图所示:
第四步,将窗口切换到设计视图,会看到三个标签的文本水平居中,调整位置,如下图所示:
第五步,在HBox和VBox中间,添加一个ColorPicker颜色选择器,注意位置,如下图所示:
第六步,最后,给ColorPicker颜色选择器添加change事件/** * 颜色器改变事件 */ protected function colorPicker_changeHandler(event:ColorPickerEvent):void { red.setStyle('color',colorPicker.selectedColor); yellow.setStyle('color',colorPicker.selectedColor); blue.setStyle('color',colorPicker.selectedColor); }如下图所示:
第七步,运行Flex应用程序,会看到选择不同颜色,字体的颜色也会跟着变化,说明这个场景实现了,如下图所示:
注意设置label标签的样式:red.setStyle('color',colorPicker.selectedColor);
注意ColorPicker事件函数的正确写法