You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ha...@apache.org on 2013/04/05 12:58:33 UTC
[1/2] git commit: Added dataProvider and no color support to Color
Picker
Updated Branches:
refs/heads/develop 266fe322c -> 66325004f
Added dataProvider and no color support to Color Picker
Project: http://git-wip-us.apache.org/repos/asf/flex-sdk/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-sdk/commit/c6846f8b
Tree: http://git-wip-us.apache.org/repos/asf/flex-sdk/tree/c6846f8b
Diff: http://git-wip-us.apache.org/repos/asf/flex-sdk/diff/c6846f8b
Branch: refs/heads/develop
Commit: c6846f8b74ff8b597c192e7d470cce60db65ad2d
Parents: 266fe32
Author: Harbs <ha...@in-tools.com>
Authored: Fri Apr 5 13:50:15 2013 +0300
Committer: Harbs <ha...@in-tools.com>
Committed: Fri Apr 5 13:50:15 2013 +0300
----------------------------------------------------------------------
.../src/spark/components/ColorPicker.as | 430 +++++++++++++--
.../src/spark/events/ColorChangeEvent.as | 7 +-
.../src/spark/skins/ColorPickerSkin.mxml | 453 +++++++++------
3 files changed, 656 insertions(+), 234 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/flex-sdk/blob/c6846f8b/frameworks/projects/experimental/src/spark/components/ColorPicker.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/experimental/src/spark/components/ColorPicker.as b/frameworks/projects/experimental/src/spark/components/ColorPicker.as
index 9658b5d..d4ad1a5 100644
--- a/frameworks/projects/experimental/src/spark/components/ColorPicker.as
+++ b/frameworks/projects/experimental/src/spark/components/ColorPicker.as
@@ -19,16 +19,18 @@
package spark.components {
import flash.display.DisplayObject;
import flash.events.Event;
-
+
import mx.collections.IList;
+ import mx.events.FlexEvent;
import mx.graphics.SolidColor;
-
+
import spark.events.ColorChangeEvent;
import spark.events.DropDownEvent;
+ import spark.primitives.Line;
import spark.utils.ColorPickerUtil;
/**
- * Dispatched when a color is choosed
+ * Dispatched when a color is chosen
*
* @langversion 3.0
* @playerversion Flash 10.1
@@ -37,13 +39,22 @@ package spark.components {
*/
[Event(name="choose", type="spark.events.ColorChangeEvent")]
/**
- * Dispatched when a color is hovered. Might be usefull in 'preview' situations
+ * Dispatched when a null color is chosen. Useful for removing color.
*
* @langversion 3.0
* @playerversion Flash 10.1
* @playerversion AIR 2.5
* @productversion Flex 4.5
*/
+ [Event(name="nocolor", type="spark.events.ColorChangeEvent")]
+ /**
+ * Dispatched when a color is hovered. Might be usefull in 'preview' situations
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.1
+ * @playerversion AIR 2.5
+ * @productversion Flex 4.5
+ */
[Event(name="hover", type="spark.events.ColorChangeEvent")]
/**
* @langversion 3.0
@@ -64,7 +75,9 @@ package spark.components {
*/
[SkinPart(required="true")]
public var solidColor:SolidColor;
-
+
+ [SkinPart(required="false")]
+ public var noColorOrnament:Line;
/**
* @langversion 3.0
* @playerversion Flash 10.1
@@ -73,7 +86,14 @@ package spark.components {
*/
public function ColorPicker() {
super();
+ if (!isModelInited)
+ loadDefaultPalette();
+
}
+ /**
+ * @private
+ */
+ private var indexFlag:Boolean = false;
/**
* Upon children creation, we're setting the dataprovider to the colors list
@@ -85,8 +105,6 @@ package spark.components {
*/
override protected function childrenCreated():void {
super.childrenCreated();
- var util:ColorPickerUtil = new ColorPickerUtil();
- super.dataProvider = ColorPickerUtil.getColorsList();
labelFunction = blankLabelFunction;
labelToItemFunction = colorFunction;
openOnInput = false;
@@ -126,13 +144,42 @@ package spark.components {
* @productversion Flex 4.5
*/
private function onColorChange(event:Event):void {
+ if(selectedItem === null){
+ solidColor.color = getColor(-1);
+ if(noColorOrnament)
+ noColorOrnament.visible = true;
+ dispatchEvent(new ColorChangeEvent(ColorChangeEvent.NO_COLOR,0));
+ return;
+ }
+ var newColor:uint = getColor(selectedIndex);
if (solidColor) {
- solidColor.color = selectedItem;
- dispatchEvent(new ColorChangeEvent(ColorChangeEvent.CHOOSE, selectedItem));
+ solidColor.color = newColor;
+ if(noColorOrnament)
+ noColorOrnament.visible = false;
}
+ var ev:ColorChangeEvent = new ColorChangeEvent(ColorChangeEvent.CHOOSE, newColor);
+ if(typeof(selectedItem) == "object"){
+ ev.colorObject = selectedItem;
+ }
+ dispatchEvent(ev);
}
- /**
+ /**
+ * @private
+ * The dataProvider for the ColorPicker control.
+ * The default dataProvider is an Array that includes all
+ * the web-safe colors.
+ *
+ */
+ override public function set dataProvider(value:IList):void
+ {
+ super.dataProvider = value;
+
+ isModelInited = true;
+
+ }
+
+/* /**
* We never allow the dataProvider to be set
*
* @langversion 3.0
@@ -140,10 +187,11 @@ package spark.components {
* @playerversion AIR 2.5
* @productversion Flex 4.5
*/
+/*
override public function set dataProvider(value:IList):void {
}
-
+*/
/**
* Initialization of the selected color
*
@@ -155,9 +203,13 @@ package spark.components {
override protected function partAdded(partName:String, instance:Object):void {
super.partAdded(partName, instance);
if (instance == solidColor) {
- solidColor.color = selectedItem;
- }
- }
+ solidColor.color = selectedColor;
+ } else if(instance == textInput){
+ textInput.editable = editable;
+ } else if(instance == noColorOrnament){
+ noColorOrnament.visible = selectedItem === null;
+ }
+ }
/**
* @langversion 3.0
@@ -192,33 +244,331 @@ package spark.components {
super.dropDownController_closeHandler(event);
}
- /**
- * @langversion 3.0
- * @playerversion Flash 10.1
- * @playerversion AIR 2.5
- * @productversion Flex 4.5
- */
- override public function set selectedItem(value:*):void {
- super.selectedItem = value;
- if (solidColor) {
- solidColor.color = value;
- }
- }
+ //----------------------------------
+ // selectedColor
+ //----------------------------------
+
+ /**
+ * @private
+ * Storage for the selectedColor property.
+ */
+ private var _selectedColor:uint = 0x000000;
+
+ [Bindable("change")]
+ [Bindable("valueCommit")]
+ [Inspectable(category="General", defaultValue="0", format="Color")]
+
+ /**
+ * The value of the currently selected color in the
+ * SwatchPanel object.
+ * In the <s:ColorPicker> tag only, you can set this property to
+ * a standard string color name, such as "blue".
+ * If the dataProvider contains an entry for black (0x000000), the
+ * default value is 0; otherwise, the default value is the color of
+ * the item at index 0 of the data provider.
+ *
+ * @helpid 4932
+ *
+ * @langversion 3.0
+ * @playerversion Flash 9
+ * @playerversion AIR 1.1
+ * @productversion Flex 3
+ */
+ public function get selectedColor():uint
+ {
+ return _selectedColor;
+ }
+
+ /**
+ * @private
+ */
+ public function set selectedColor(value:uint):void
+ {
+ if (!indexFlag)
+ {
+ super.selectedIndex = findColorByName(value);
+ }
+ else
+ {
+ indexFlag = false;
+ }
+
+ if (value != selectedColor)
+ {
+ _selectedColor = value;
+
+ //updateColor(value);
+
+ if (solidColor){
+ solidColor.color = value;
+ dispatchEvent(new FlexEvent(FlexEvent.VALUE_COMMIT));
+ }
+ if(noColorOrnament){
+ if(selectedIndex < 0){
+ noColorOrnament.visible = false;
+ } else {
+ noColorOrnament.visible = dataProvider.getItemAt(selectedIndex) === null;
+ }
+ }
+ }
+
+ }
- /**
- * Duplicate of selectedItem property, just for naming to be right
- *
- * @langversion 3.0
- * @playerversion Flash 10.1
- * @playerversion AIR 2.5
- * @productversion Flex 4.5
- */
- public function set selectedColor(value:uint):void {
- selectedItem = value;
- }
+ //----------------------------------
+ // editable
+ //----------------------------------
+
+ [Bindable("editableChanged")]
+ [Inspectable(category="General", defaultValue="true")]
+
+ /**
+ * @private
+ */
+ private var _editable:Boolean = true;
+
+ /**
+ * @private
+ * Specifies whether the user can type a hexadecimal color value
+ * in the text box.
+ *
+ * @default true
+ * @helpid 4930
+ */
+ public function get editable():Boolean
+ {
+ return _editable;
+ }
+
+ /**
+ * @private
+ */
+ public function set editable(value:Boolean):void
+ {
+ _editable = value;
+
+ if (textInput)
+ textInput.editable = value;
+
+ dispatchEvent(new Event("editableChanged"));
+ }
+
+ //----------------------------------
+ // selectedIndex
+ //----------------------------------
+
+ [Bindable("change")]
+ [Bindable("collectionChange")]
+ [Inspectable(defaultValue="0")]
+
+ /**
+ * Index in the dataProvider of the selected item in the
+ * SwatchPanel object.
+ * Setting this property sets the selected color to the color that
+ * corresponds to the index, sets the selected index in the drop-down
+ * swatch to the <code>selectedIndex</code> property value,
+ * and displays the associated label in the text box.
+ * The default value is the index corresponding to
+ * black(0x000000) color if found, else it is 0.
+ *
+ * @helpid 4931
+ *
+ * @langversion 3.0
+ * @playerversion Flash 9
+ * @playerversion AIR 1.1
+ * @productversion Flex 3
+ */
+ override public function set selectedIndex(value:int):void
+ {
+ if ((selectedIndex != -1 || !isNaN(selectedColor)) &&
+ value != selectedIndex)
+ {
+ if (value >= 0)
+ {
+ indexFlag = true;
+ selectedColor = getColor(value);
+ // Call super in mixed-in DataSelector
+ super.selectedIndex = value;
+ }
+
+ if (solidColor)
+ solidColor.color = selectedColor;
+ if(noColorOrnament){
+ noColorOrnament.visible = dataProvider.getItemAt(value) === null;
+ }
+ }
+ }
+
+ //----------------------------------
+ // selectedItem
+ //----------------------------------
+
+ [Bindable("change")]
+ [Bindable("collectionChange")]
+ [Inspectable(defaultValue="0")]
+
+ /**
+ * @private
+ * If the dataProvider is a complex object, this property is a
+ * reference to the selected item in the SwatchPanel object.
+ * If the dataProvider is an Array of color values, this
+ * property is the selected color value.
+ * If the dataProvider is a complex object, modifying fields of
+ * this property modifies the dataProvider and its views.
+ *
+ * <p>If the dataProvider is a complex object, this property is
+ * read-only. You cannot change its value directly.
+ * If the dataProvider is an Array of hexadecimal color values,
+ * you can change this value directly.
+ * The default value is undefined for complex dataProviders;
+ * 0 if the dataProvider is an Array of color values.
+ *
+ */
+ override public function set selectedItem(value:*):void
+ {
+ if (value != selectedItem)
+ {
+ // Call super in mixed-in DataSelector
+ super.selectedItem = value;
+
+ if (typeof(value) == "object")
+ selectedColor = Number(value[colorField]);
+ else if (typeof(value) == "number")
+ selectedColor = Number(value);
+
+ indexFlag = true;
+
+ if (solidColor)
+ solidColor.color = selectedColor;
+ }
+ }
+
+ //----------------------------------
+ // colorField
+ //----------------------------------
+
+ /**
+ * @private
+ * Storage for the colorField property.
+ */
+ private var _colorField:String = "color";
+
+ [Bindable("colorFieldChanged")]
+ [Inspectable(category="Data", defaultValue="color")]
+
+ /**
+ * Name of the field in the objects of the dataProvider Array that
+ * specifies the hexadecimal values of the colors that the swatch
+ * panel displays.
+ *
+ * <p>If the dataProvider objects do not contain a color
+ * field, set the <code>colorField</code> property to use the correct field name.
+ * This property is available, but not meaningful, if the
+ * dataProvider is an Array of hexadecimal color values.</p>
+ *
+ * @default "color"
+ * @helpid 4927
+ *
+ * @langversion 3.0
+ * @playerversion Flash 9
+ * @playerversion AIR 1.1
+ * @productversion Flex 3
+ */
+ public function get colorField():String
+ {
+ return _colorField;
+ }
+
+ /**
+ * @private
+ */
+ public function set colorField(value:String):void
+ {
+ _colorField = value;
+
+ dispatchEvent(new Event("colorFieldChanged"));
+ }
+
+ /**
+ * @private
+ * Load Default Palette
+ */
+ private function loadDefaultPalette():void
+ {
+ // Initialize default swatch list
+ if (!dataProvider || dataProvider.length < 1)
+ {
+ dataProvider = ColorPickerUtil.getColorsList();
+
+ }
+ //selectedIndex = findColorByName(selectedColor);
+ }
+
+
+ /**
+ * @public
+ * Find Color by Name
+ */
+ public function findColorByName(name:Number):int
+ {
+ if (name == getColor(selectedIndex))
+ return selectedIndex;
+
+ var n:int = dataProvider.length;
+ for (var i:int = 0; i < dataProvider.length; i++)
+ {
+ if (name == getColor(i))
+ return i;
+ }
+
+ return -1;
+ }
+
+ /**
+ * @public
+ * Get the color value of a color object or color value
+ */
+ public function getColorValue(color:*):uint
+ {
+ return Number(typeof(color) == "object" && color!=null ? color[colorField] : color);
+ }
+
+ /**
+ * @public
+ * Get the color name of a color object
+ */
+ public function getColorName(color:*):String
+ {
+ if(typeof(color) == "object"){
+ if(color){
+ return color[labelField];
+ }
+ return "";
+ }
+ return ColorPickerUtil.uint2hex(color as uint);
+ }
+
+ /**
+ * @private
+ */
+ private var isModelInited:Boolean = false;
+
+ /**
+ * @private
+ * Get Color Value
+ */
+ private function getColor(location:int):Number
+ {
+ if (!dataProvider || dataProvider.length < 1 ||
+ location < 0 || location >= dataProvider.length)
+ {
+ return -1;
+ }
+ var item:* = dataProvider.getItemAt(location);
+ if(typeof(item) == "object"){
+ return item === null ? -1 : Number(item[colorField]);
+ }
+ return Number(item);
+ }
- public function get selectedColor():uint {
- return selectedItem;
- }
}
}
http://git-wip-us.apache.org/repos/asf/flex-sdk/blob/c6846f8b/frameworks/projects/experimental/src/spark/events/ColorChangeEvent.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/experimental/src/spark/events/ColorChangeEvent.as b/frameworks/projects/experimental/src/spark/events/ColorChangeEvent.as
index fac9358..5bae91f 100644
--- a/frameworks/projects/experimental/src/spark/events/ColorChangeEvent.as
+++ b/frameworks/projects/experimental/src/spark/events/ColorChangeEvent.as
@@ -25,10 +25,11 @@ package spark.events
public class ColorChangeEvent extends Event
{
public static const CHOOSE:String = "choose";
-
+ public static const NO_COLOR:String = "nocolor";
public static const HOVER:String = "hover";
public var color : uint;
+ public var colorObject:Object;
public function ColorChangeEvent(type:String, aColor : uint, bubbles:Boolean=false, cancelable:Boolean=false)
{
@@ -47,7 +48,9 @@ package spark.events
*/
override public function clone():Event
{
- return new ColorChangeEvent(type, color, bubbles, cancelable);
+ var ev:ColorChangeEvent = new ColorChangeEvent(type, color, bubbles, cancelable);
+ ev.colorObject = colorObject;
+ return ev;
}
}
}
http://git-wip-us.apache.org/repos/asf/flex-sdk/blob/c6846f8b/frameworks/projects/experimental/src/spark/skins/ColorPickerSkin.mxml
----------------------------------------------------------------------
diff --git a/frameworks/projects/experimental/src/spark/skins/ColorPickerSkin.mxml b/frameworks/projects/experimental/src/spark/skins/ColorPickerSkin.mxml
index d40ce0b..21e15cb 100644
--- a/frameworks/projects/experimental/src/spark/skins/ColorPickerSkin.mxml
+++ b/frameworks/projects/experimental/src/spark/skins/ColorPickerSkin.mxml
@@ -1,202 +1,271 @@
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabled=".5" minWidth="24"
- currentStateChange="onStateChange(event)">
- <!--
- ////////////////////////////////////////////////////////////////////////////////
- //
- // Licensed to the Apache Software Foundation (ASF) under one or more
- // contributor license agreements. See the NOTICE file distributed with
- // this work for additional information regarding copyright ownership.
- // The ASF licenses this file to You under the Apache License, Version 2.0
- // (the "License"); you may not use this file except in compliance with
- // the License. You may obtain a copy of the License at
- //
- // http://www.apache.org/licenses/LICENSE-2.0
- //
- // Unless required by applicable law or agreed to in writing, software
- // distributed under the License is distributed on an "AS IS" BASIS,
- // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- // See the License for the specific language governing permissions and
- // limitations under the License.
- //
- ////////////////////////////////////////////////////////////////////////////////
- @author Bogdan Dinu (http://www.badu.ro)
- -->
- <fx:Metadata>
+ xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabled=".5" minWidth="24"
+ currentStateChange="onStateChange(event)">
+ <!--
+ ////////////////////////////////////////////////////////////////////////////////
+ //
+ // Licensed to the Apache Software Foundation (ASF) under one or more
+ // contributor license agreements. See the NOTICE file distributed with
+ // this work for additional information regarding copyright ownership.
+ // The ASF licenses this file to You under the Apache License, Version 2.0
+ // (the "License"); you may not use this file except in compliance with
+ // the License. You may obtain a copy of the License at
+ //
+ // http://www.apache.org/licenses/LICENSE-2.0
+ //
+ // Unless required by applicable law or agreed to in writing, software
+ // distributed under the License is distributed on an "AS IS" BASIS,
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ // See the License for the specific language governing permissions and
+ // limitations under the License.
+ //
+ ////////////////////////////////////////////////////////////////////////////////
+ @author Bogdan Dinu (http://www.badu.ro)
+ -->
+ <fx:Metadata>
<![CDATA[
- [HostComponent("spark.components.ColorPicker")]
- ]]>
+ [HostComponent("spark.components.ColorPicker")]
+ ]]>
</fx:Metadata>
- <fx:Declarations>
- <fx:Component id="colorItemRenderer">
- <s:ItemRenderer rollOver="onRolledOver(event)">
- <fx:Script>
+ <fx:Declarations>
+ <fx:Component id="colorItemRenderer">
+ <s:ItemRenderer rollOver="onRolledOver(event)" dataChange="onDataChange()">
+ <fx:Script>
<![CDATA[
- import spark.events.ColorChangeEvent;
- import spark.utils.ColorPickerUtil;
-
- protected function onRolledOver(event:MouseEvent):void {
- outerDocument.previewColor.color = uint(data);
- outerDocument.previewTextInput.text = ColorPickerUtil.uint2hex(uint(data));
- outerDocument.hostComponent.dispatchEvent(new ColorChangeEvent(ColorChangeEvent.HOVER, uint(data)));
- }
- ]]>
+ import mx.events.FlexEvent;
+
+ import spark.events.ColorChangeEvent;
+ import spark.utils.ColorPickerUtil;
+
+ [Bindable]private var color:uint;
+ [Bindable]private var noneColor:Boolean;
+ protected function onRolledOver(event:MouseEvent):void
+ {
+ var cVal:uint = outerDocument.hostComponent.getColorValue(data);
+ outerDocument.previewColor.color = cVal;
+ outerDocument.popupTextInput.text = outerDocument.hostComponent.getColorName(data);
+ var ev:ColorChangeEvent = new ColorChangeEvent(ColorChangeEvent.HOVER, cVal);
+ if(typeof(data) == "object"){
+ ev.colorObject = data;
+ }
+ outerDocument.hostComponent.dispatchEvent(ev);
+ }
+
+ protected function onDataChange():void
+ {
+ if(data === null){
+ // draw a no-color square
+ color = 0xFFFFFF;
+ noneColor = true;
+ } else {
+ color = outerDocument.hostComponent.getColorValue(data);
+ noneColor = false;
+ }
+ }
+
+ ]]>
</fx:Script>
- <s:states>
- <s:State name="normal"/>
- <s:State name="hovered"/>
- <s:State name="selected"/>
- </s:states>
- <s:Rect width="10" height="10">
- <s:fill>
- <s:SolidColor color="{data}"/>
- </s:fill>
- <s:stroke>
- <s:SolidColorStroke color="0xFFFF00" alpha.hovered="1" alpha="0"/>
- </s:stroke>
- </s:Rect>
- </s:ItemRenderer>
- </fx:Component>
- </fx:Declarations>
- <fx:Script fb:purpose="styling">
+ <s:states>
+ <s:State name="normal"/>
+ <s:State name="hovered"/>
+ <s:State name="selected"/>
+ </s:states>
+ <s:Rect width="14" height="14">
+ <s:fill>
+ <s:SolidColor color="{color}"/>
+ </s:fill>
+ <s:stroke>
+ <s:SolidColorStroke color="0xFFFF00" alpha.hovered="1" alpha="0"/>
+ </s:stroke>
+ </s:Rect>
+ <s:Line xFrom="1" xTo="13" yFrom="1" yTo="13" visible="{noneColor}">
+ <s:stroke>
+ <s:SolidColorStroke color="0xFF0000" weight="2"/>
+ </s:stroke>
+ </s:Line>
+ </s:ItemRenderer>
+ </fx:Component>
+ </fx:Declarations>
+ <fx:Script fb:purpose="styling">
<![CDATA[
- import mx.events.FlexEvent;
- import mx.events.StateChangeEvent;
-
- import spark.events.ColorChangeEvent;
- import spark.events.TextOperationEvent;
- import spark.utils.ColorPickerUtil;
-
- static private const contentFill:Array = ["bgFill"];
-
- /**
- * @private
- */
- override public function get contentItems():Array {
- return contentFill
- }
- /**
- * @private
- */
- override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
- if (getStyle("borderVisible") == false) {
- if (border) {
- border.visible = false;
- }
- if (background) {
- background.left = background.top = background.right = background.bottom = 0;
- }
- if (swatchpanel) {
- swatchpanel.left = swatchpanel.top = swatchpanel.right = swatchpanel.bottom = 0;
- }
- } else {
- if (border) {
- border.visible = true;
- }
- if (background) {
- background.left = background.top = background.right = background.bottom = 1;
- }
- if (swatchpanel) {
- swatchpanel.left = swatchpanel.top = swatchpanel.right = swatchpanel.bottom = 1;
- }
- }
-
- if (dropShadow) {
- dropShadow.visible = getStyle("dropShadowVisible");
- }
-
- openButton.setStyle("cornerRadius", getStyle("cornerRadius"));
-
- if (borderStroke) {
- borderStroke.color = getStyle("borderColor");
- borderStroke.alpha = getStyle("borderAlpha");
- }
- super.updateDisplayList(unscaledWidth, unscaledHeight);
- }
-
- private function onEnterKey(e:FlexEvent):void {
- hostComponent.selectedItem = previewColor.color;
- hostComponent.closeDropDown(true);
- hostComponent.dispatchEvent(new ColorChangeEvent(ColorChangeEvent.CHOOSE, previewColor.color));
- }
+ import mx.events.FlexEvent;
+ import mx.events.StateChangeEvent;
+
+ import spark.events.ColorChangeEvent;
+ import spark.events.TextOperationEvent;
+ import spark.utils.ColorPickerUtil;
+
+ static private const contentFill:Array = ["bgFill"];
+
+ /**
+ * @private
+ */
+ override public function get contentItems():Array
+ {
+ return contentFill
+ }
+ /**
+ * @private
+ */
+ override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
+ {
+ if (getStyle("borderVisible") == false) {
+ if (border) {
+ border.visible = false;
+ }
+ if (background) {
+ background.left = background.top = background.right = background.bottom = 0;
+ }
+ if (swatchpanel) {
+ swatchpanel.left = swatchpanel.top = swatchpanel.right = swatchpanel.bottom = 0;
+ }
+ } else {
+ if (border) {
+ border.visible = true;
+ }
+ if (background) {
+ background.left = background.top = background.right = background.bottom = 1;
+ }
+ if (swatchpanel) {
+ swatchpanel.left = swatchpanel.top = swatchpanel.right = swatchpanel.bottom = 1;
+ }
+ }
+
+ if (dropShadow) {
+ dropShadow.visible = getStyle("dropShadowVisible");
+ }
+
+ openButton.setStyle("cornerRadius", getStyle("cornerRadius"));
+
+ if (borderStroke) {
+ borderStroke.color = getStyle("borderColor");
+ borderStroke.alpha = getStyle("borderAlpha");
+ }
+ super.updateDisplayList(unscaledWidth, unscaledHeight);
+ }
+
+ private function onEnterKey(e:FlexEvent):void
+ {
+ hostComponent.selectedColor = previewColor.color;
+ hostComponent.closeDropDown(true);
+ var ev:ColorChangeEvent = new ColorChangeEvent(ColorChangeEvent.CHOOSE, previewColor.color);
+ if(typeof(null) == "object"){
+ ev.colorObject = null;
+ }
- protected function onStateChange(event:StateChangeEvent):void {
- if (currentState == 'open') {
- if (preview) {
- previewColor.color = hostComponent.selectedItem as uint;
- }
- previewTextInput.callLater(previewTextInput.setFocus);
- previewTextInput.text = ColorPickerUtil.uint2hex(previewColor.color);
- }
- }
+ hostComponent.dispatchEvent(ev);
+ }
+
+ protected function onStateChange(event:StateChangeEvent):void
+ {
+ if (currentState == 'open') {
+ if (preview) {
+ previewColor.color = hostComponent.selectedColor;
+ }
+ popupTextInput.callLater(popupTextInput.setFocus);
+ popupTextInput.text = hostComponent.getColorName(hostComponent.selectedItem);
+ }
+ }
- protected function onPreviewTextInputChange(event:TextOperationEvent):void {
- previewColor.color = uint('0x' + previewTextInput.text);
- }
- ]]>
+ protected function onPreviewTextInputChange(event:TextOperationEvent):void
+ {
+ var color:String = TextInput(event.target).text;
+ if (color.charAt(0) == "#"){
+ popupTextInput.maxChars = 7;
+ color = "0x"+color.substring(1);
+ }
+ else if (color.substring(0,2) == "0x"){
+ popupTextInput.maxChars = 8;
+ }
+ else{
+ popupTextInput.maxChars = 6;
+ color = "0x"+color;
+ }
+ previewColor.color = Number(color);
+ }
+
+ private function onKeyDown(ev:KeyboardEvent):void
+ {
+ if ((ev.ctrlKey && ev.keyCode == Keyboard.UP) ||
+ ev.keyCode == Keyboard.ESCAPE)
+ {
+ if (currentState == 'open'){
+ hostComponent.closeDropDown(false);
+ }
+ }
+ }
+
+ ]]>
</fx:Script>
-
- <s:states>
- <s:State name="normal"/>
- <s:State name="open"/>
- <s:State name="disabled"/>
- </s:states>
-
- <s:PopUpAnchor id="popUp" displayPopUp.normal="false" displayPopUp.open="true" includeIn="open"
- left="0" right="0" top="0" bottom="0" itemDestructionPolicy="auto"
- popUpPosition="below" popUpWidthMatchesAnchorWidth="false">
-
- <s:Group id="dropDown">
- <s:RectangularDropShadow id="dropShadow" blurX="20" blurY="20" alpha="0.45" distance="7"
- angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/>
- <s:Rect id="border" left="0" right="0" top="0" bottom="0">
- <s:stroke>
- <s:SolidColorStroke id="borderStroke" weight="1"/>
- </s:stroke>
- </s:Rect>
-
- <s:Rect id="background" left="1" right="1" top="1" bottom="1">
- <s:fill>
- <s:SolidColor id="bgFill" color="0x1F1F1F"/>
- </s:fill>
- </s:Rect>
- <s:VGroup id="swatchpanel" left="0" top="0" right="0" bottom="0">
- <s:HGroup>
- <s:Rect id="preview" width="50" height="20">
- <s:fill>
- <s:SolidColor id="previewColor"/>
- </s:fill>
- </s:Rect>
- <s:TextInput id="previewTextInput" restrict="0123456789abcdefABCDEF"
- change="onPreviewTextInputChange(event)"
- enter="onEnterKey(event)"/>
- </s:HGroup>
- <s:Group>
- <s:Rect left="0" top="0" right="0" bottom="0" width="220" height="132">
- <s:fill>
- <s:SolidColor color="0x0"/>
- </s:fill>
- </s:Rect>
- <s:DataGroup id="dataGroup" left="0" top="0" right="0" bottom="0" width="220" height="132"
- itemRenderer="{colorItemRenderer}">
- <s:layout>
- <s:TileLayout verticalGap="0" horizontalGap="0"
- requestedColumnCount="20"
- requestedRowCount="12" useVirtualLayout="false"/>
- </s:layout>
- </s:DataGroup>
- </s:Group>
- </s:VGroup>
- </s:Group>
- </s:PopUpAnchor>
-
- <s:Button id="openButton" left="0" right="0" top="0" bottom="0" focusEnabled="false"
- skinClass="spark.skins.ColorPickerButtonSkin"/>
-
- <s:Rect left="2" right="2" top="2" bottom="2" width="20" height="20" radiusX="2">
- <s:fill>
- <s:SolidColor id="solidColor"/>
- </s:fill>
- </s:Rect>
-
+
+ <s:states>
+ <s:State name="normal"/>
+ <s:State name="open"/>
+ <s:State name="disabled"/>
+ </s:states>
+
+ <s:PopUpAnchor id="popUp" displayPopUp.normal="false" displayPopUp.open="true" includeIn="open"
+ left="0" right="0" top="0" bottom="0" itemDestructionPolicy="auto"
+ popUpPosition="below" popUpWidthMatchesAnchorWidth="false">
+
+ <s:Group id="dropDown">
+ <s:RectangularDropShadow id="dropShadow" blurX="20" blurY="20" alpha="0.45" distance="7"
+ angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/>
+ <s:Rect id="border" left="0" right="0" top="0" bottom="0">
+ <s:stroke>
+ <s:SolidColorStroke id="borderStroke" weight="1"/>
+ </s:stroke>
+ </s:Rect>
+
+ <s:Rect id="background" left="1" right="1" top="1" bottom="1">
+ <s:fill>
+ <s:SolidColor id="bgFill" color="0x1F1F1F"/>
+ </s:fill>
+ </s:Rect>
+ <s:VGroup id="swatchpanel" left="0" top="0" right="0" bottom="0" gap="2">
+ <s:HGroup>
+ <s:Rect id="preview" width="50" height="100%">
+ <s:fill>
+ <s:SolidColor id="previewColor"/>
+ </s:fill>
+ </s:Rect>
+ <s:TextInput id="popupTextInput" restrict="#xa-fA-F0-9" selectable="false" editable="false"
+ borderVisible="false"
+ change="onPreviewTextInputChange(event)" keyDown="onKeyDown(event)"
+ enter="onEnterKey(event)"/>
+ </s:HGroup>
+ <s:Group>
+ <s:Rect left="0" top="0" right="0" bottom="0" width="300" height="132">
+ <s:fill>
+ <s:SolidColor color="0x0"/>
+ </s:fill>
+ </s:Rect>
+ <s:DataGroup id="dataGroup" left="0" top="0" right="0" bottom="0" width="300" height="132"
+ itemRenderer="{colorItemRenderer}">
+ <s:layout>
+ <s:TileLayout verticalGap="0" horizontalGap="0"
+ requestedColumnCount="20"
+ requestedRowCount="12" useVirtualLayout="false"/>
+ </s:layout>
+ </s:DataGroup>
+ </s:Group>
+ </s:VGroup>
+ </s:Group>
+ </s:PopUpAnchor>
+
+ <s:Button id="openButton" left="0" right="0" top="0" bottom="0" focusEnabled="false"
+ skinClass="spark.skins.ColorPickerButtonSkin"/>
+
+ <s:Rect left="2" right="2" top="2" bottom="2" width="20" height="20" radiusX="2">
+ <s:fill>
+ <s:SolidColor id="solidColor"/>
+ </s:fill>
+ </s:Rect>
+ <s:Line xFrom="3" xTo="20" yFrom="3" yTo="20" id="noColorOrnament">
+ <s:stroke>
+ <s:SolidColorStroke color="0xFF0000" weight="2"/>
+ </s:stroke>
+ </s:Line>
+ <s:TextInput id="textInput" visible="false" width="1" height="1"/>
+
</s:SparkSkin>
[2/2] git commit: Merge branch 'colorpicker_work' into develop
Posted by ha...@apache.org.
Merge branch 'colorpicker_work' into develop
Project: http://git-wip-us.apache.org/repos/asf/flex-sdk/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-sdk/commit/66325004
Tree: http://git-wip-us.apache.org/repos/asf/flex-sdk/tree/66325004
Diff: http://git-wip-us.apache.org/repos/asf/flex-sdk/diff/66325004
Branch: refs/heads/develop
Commit: 66325004fd6cff59fdca612f1a35c57c224bc1a1
Parents: 266fe32 c6846f8
Author: Harbs <ha...@in-tools.com>
Authored: Fri Apr 5 13:55:40 2013 +0300
Committer: Harbs <ha...@in-tools.com>
Committed: Fri Apr 5 13:55:40 2013 +0300
----------------------------------------------------------------------
.../src/spark/components/ColorPicker.as | 430 +++++++++++++--
.../src/spark/events/ColorChangeEvent.as | 7 +-
.../src/spark/skins/ColorPickerSkin.mxml | 453 +++++++++------
3 files changed, 656 insertions(+), 234 deletions(-)
----------------------------------------------------------------------