Flex中如何通过swatchPanelStyleName和textFieldWidth样式调整ColorPicker的样本颜色数值表示框SIZE的例子

By Minidxer | January 25, 2009

接下来的例子演示了Flex中如何通过swatchPanelStyleName和textFieldWidth样式，调整ColorPicker的样本颜色数值表示框SIZE。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：

下面是完整代码(或点击这里察看)：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="top"
backgroundColor="white">
<mx:Script>
<![CDATA[
import mx.events.SliderEvent;
private function slider_change(evt:SliderEvent):void {
var cssObj:CSSStyleDeclaration = StyleManager.getStyleDeclaration(".myCustomSwatchPanelStyleName");
cssObj.setStyle("textFieldWidth", evt.value);
colorPicker.open();
}
]]>
</mx:Script>
<mx:Style>
ColorPicker {
swatchPanelStyleName: myCustomSwatchPanelStyleName;
}
.myCustomSwatchPanelStyleName {
}
</mx:Style>
<mx:ApplicationControlBar dock="true">
<mx:Form styleName="plain">
<mx:FormItem label="textFieldWidth:">
<mx:HSlider id="slider"
minimum="0"
maximum="172"
value="72"
snapInterval="1"
tickInterval="5"
liveDragging="true"
dataTipPrecision="0"
change="slider_change(event);" />
</mx:FormItem>
</mx:Form>
</mx:ApplicationControlBar>
<mx:ColorPicker id="colorPicker" />
</mx:Application>

代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: ColorPicker | No Comments » | 636 views Tags: ColorPicker, swatchPanelStyleName, textFieldWidth

中文Flex例子