2.3.使用ColorPicker设置Canvas颜色
2.3.1. 问题
我想要让用户使用色彩选取器来修改一个组件的颜色。
2.3.2. 解决办法
为用户提供一个用来选取颜色的调色板。并且使用ColorPicker 控件的change 事件来设定Canvas 的背景颜色。
2.3.3. 讨论
让用户使用一个调色板。创建一个程序,使用ColorPicker 控件来改变Canvas 控件的backgroundColro 属性(背景色)。ColorPicker 控件提供给用户一种从色彩采样选取颜色的方式。为了实现我们的需求,Colorpicker 控件的change 事件的处理程序被指向到setColor 方法。
setColor 方法会接受一个包含了当前选中颜色的ColorPickerEvent。具体实现代码如下:
When the user selects a new color, the backgroundColor style of the Canvas is updated.
Note that because backgroundColor is a style attribute rather than a property of the Canvas control, the setStyle method is used to update the style as shown:
当用户选择了一个新的颜色,Cancas 控件的backgroundColor 样式就会更新。值得注意的是,backgroundColor 是一个样式而不是Canvas 的普通属性,所以,更新backgroundColor 需要使用setStyle 方法来操作,譬如:
我想要让用户使用色彩选取器来修改一个组件的颜色。
2.3.2. 解决办法
为用户提供一个用来选取颜色的调色板。并且使用ColorPicker 控件的change 事件来设定Canvas 的背景颜色。
2.3.3. 讨论
让用户使用一个调色板。创建一个程序,使用ColorPicker 控件来改变Canvas 控件的backgroundColro 属性(背景色)。ColorPicker 控件提供给用户一种从色彩采样选取颜色的方式。为了实现我们的需求,Colorpicker 控件的change 事件的处理程序被指向到setColor 方法。
setColor 方法会接受一个包含了当前选中颜色的ColorPickerEvent。具体实现代码如下:
+展开
-XML
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical">
<mx:Canvas id="cnv" width="450" height="450"
backgroundColor="#eeaeaea">
<mx:ColorPicker id="pckr" right="10" top="10"
change="setColor(event)"/>
</mx:Canvas>
<mx:Script>
<![CDATA[
import mx.events.ColorPickerEvent;
private function setColor(evt:ColorPickerEvent):void
{
cnv.setStyle("backgroundColor",evt.color); }
]]>
</mx:Script>
</mx:Application>
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical">
<mx:Canvas id="cnv" width="450" height="450"
backgroundColor="#eeaeaea">
<mx:ColorPicker id="pckr" right="10" top="10"
change="setColor(event)"/>
</mx:Canvas>
<mx:Script>
<![CDATA[
import mx.events.ColorPickerEvent;
private function setColor(evt:ColorPickerEvent):void
{
cnv.setStyle("backgroundColor",evt.color); }
]]>
</mx:Script>
</mx:Application>
When the user selects a new color, the backgroundColor style of the Canvas is updated.
Note that because backgroundColor is a style attribute rather than a property of the Canvas control, the setStyle method is used to update the style as shown:
当用户选择了一个新的颜色,Cancas 控件的backgroundColor 样式就会更新。值得注意的是,backgroundColor 是一个样式而不是Canvas 的普通属性,所以,更新backgroundColor 需要使用setStyle 方法来操作,譬如:
+展开
-ActionScript
private function setColor(evt:ColorPickerEvent):void
{
cnv.setStyle("backgroundColor",evt.color); }
{
cnv.setStyle("backgroundColor",evt.color); }
加支付宝好友偷能量挖...