Flex中如何利用swatchBorderSize样式设置ColorPicker颜色样本框粗细尺寸的例子
By Minidxer | January 20, 2009
接下来的例子演示了Flex中如何利用swatchBorderSize样式,设置ColorPicker颜色样本框粗细尺寸。
让我们先来看一下Demo(可以右键View Source或点击这里察看源代码):
下面是完整代码(或点击这里察看):
Download: main.mxml
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
- layout="vertical"
- verticalAlign="top"
- backgroundColor="white">
- <mx:Style>
- ColorPicker {
- swatchPanelStyleName: myCustomSwatchPanelStyleName;
- }
- .myCustomSwatchPanelStyleName {
- swatchBorderSize: 1;
- }
- </mx:Style>
- <mx:Script>
- <![CDATA[
- import mx.events.SliderEvent;
- private function slider_change(evt:SliderEvent):void {
- var cssObj:CSSStyleDeclaration = StyleManager.getStyleDeclaration(".myCustomSwatchPanelStyleName");
- cssObj.setStyle("swatchBorderSize", evt.value);
- colorPicker.open();
- }
- ]]>
- </mx:Script>
- <mx:ApplicationControlBar dock="true">
- <mx:Form styleName="plain">
- <mx:FormItem label="swatchBorderSize:">
- <mx:HSlider id="slider"
- minimum="0"
- maximum="5"
- value="1"
- liveDragging="true"
- snapInterval="1"
- tickInterval="1"
- change="slider_change(event);" />
- </mx:FormItem>
- </mx:Form>
- </mx:ApplicationControlBar>
- <mx:ColorPicker id="colorPicker" />
- </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子
Topics:
ColorPicker |
No Comments » |
Tags: ColorPicker, swatchBorderSize, swatchPanelStyleName