FWIW, at one point in time, Spark skins were supposed to have as few styles as possible since tools like Catalyst were supposed to make easier to "just draw" a different skin and not have to implement as much code in the skin. Custom skins were supposed to simply place the icon wherever it should be in relation to the label. Existing custom skins/themes certainly will not respond to this new option.
That said, I'm not saying you should revert. I'm just pointing this out to see if anyone else cares. I think some Spark skins respond to custom non-font styles already. One other thing: should the case statement handle the default case as LEFT? If someone has a custom CSS file but use the default skin, they won't pick up this new style then will the skin still work as it used to? On 12/8/13 1:01 PM, "mkess...@apache.org" <mkess...@apache.org> wrote: >Updated Branches: > refs/heads/develop 7c3d70818 -> cdcb49242 > > >FLEX-33984: Moved the placement logic from the hostComponent to the skin. >Removed some code no longer needed. > > >Project: http://git-wip-us.apache.org/repos/asf/flex-sdk/repo >Commit: http://git-wip-us.apache.org/repos/asf/flex-sdk/commit/cdcb4924 >Tree: http://git-wip-us.apache.org/repos/asf/flex-sdk/tree/cdcb4924 >Diff: http://git-wip-us.apache.org/repos/asf/flex-sdk/diff/cdcb4924 > >Branch: refs/heads/develop >Commit: cdcb49242ae0d06645d3ebaf4f7e3c102b8f6506 >Parents: 7c3d708 >Author: Mark Kessler <kesslerconsult...@gmail.com> >Authored: Sun Dec 8 15:59:25 2013 -0500 >Committer: Mark Kessler <kesslerconsult...@gmail.com> >Committed: Sun Dec 8 15:59:25 2013 -0500 > >---------------------------------------------------------------------- > .../spark/src/spark/components/CheckBox.as | 188 ------------------- > .../src/spark/skins/spark/CheckBoxSkin.mxml | 138 ++++++++++++++ > 2 files changed, 138 insertions(+), 188 deletions(-) >---------------------------------------------------------------------- > > >http://git-wip-us.apache.org/repos/asf/flex-sdk/blob/cdcb4924/frameworks/p >rojects/spark/src/spark/components/CheckBox.as >---------------------------------------------------------------------- >diff --git a/frameworks/projects/spark/src/spark/components/CheckBox.as >b/frameworks/projects/spark/src/spark/components/CheckBox.as >index 77dd23d..c72f6c8 100644 >--- a/frameworks/projects/spark/src/spark/components/CheckBox.as >+++ b/frameworks/projects/spark/src/spark/components/CheckBox.as >@@ -24,9 +24,7 @@ import flash.events.Event; > import flash.events.MouseEvent; > > import mx.core.mx_internal; >-import mx.core.UIComponent; > >-import spark.components.supportClasses.LabelPlacement; > import spark.components.supportClasses.ToggleButtonBase; > > use namespace mx_internal; >@@ -214,30 +212,6 @@ public class CheckBox extends ToggleButtonBase > > >//------------------------------------------------------------------------ >-- > // >- // Variables >- // >- >//------------------------------------------------------------------------ >-- >- >- //---------------------------------- >- // checkDisplay >- //---------------------------------- >- >- /** >- * The skin part that defines the CheckBox grouping. >- * >- * @see spark.skins.spark.CheckBoxSkin#checkDisplay >- * >- * @langversion 3.0 >- * @playerversion Flash 11.8 >- * @playerversion AIR 3.8 >- * @productversion Flex 4.12 >- */ >- [SkinPart(required="false")] >- public var checkDisplay:UIComponent; >- >- >- >//------------------------------------------------------------------------ >-- >- // > // Properties > // > >//------------------------------------------------------------------------ >-- >@@ -323,120 +297,6 @@ public class CheckBox extends ToggleButtonBase > > >//------------------------------------------------------------------------ >-- > // >- // Methods >- // >- >//------------------------------------------------------------------------ >-- >- >- /** >- * Sets the label placement in relation to the checkbox. >- * Requires the SkinParts <code>checkDisplay</code> and ><code>labelDisplay</code>. >- * >- * @langversion 3.0 >- * @playerversion Flash 11.8 >- * @playerversion AIR 3.8 >- * @productversion Flex 4.12 >- */ >- public function updateLabelPlacement():void >- { >- var labelDisplayAsUIComponent:UIComponent; >- >- >- if (!checkDisplay || !labelDisplay) >- { >- return; >- } >- >- labelDisplayAsUIComponent = labelDisplay as UIComponent; >- >- >- switch (String(getStyle("labelPlacement")).toLowerCase()) >- { >- case LabelPlacement.BOTTOM: >- { >- //Adjust the labels position to the bottom. >- labelDisplayAsUIComponent.horizontalCenter = 0; >- labelDisplayAsUIComponent.verticalCenter = undefined; >- labelDisplayAsUIComponent.top = checkDisplay.height + >int(getStyle("gap")); >- labelDisplayAsUIComponent.bottom = undefined; >- labelDisplayAsUIComponent.left = undefined; >- labelDisplayAsUIComponent.right = undefined; >- >- //Adjust the checkboxes position to the top. >- checkDisplay.horizontalCenter = 0; >- checkDisplay.verticalCenter = undefined; >- checkDisplay.top = 0; >- checkDisplay.bottom = undefined; >- >- break; >- } >- >- case LabelPlacement.LEFT: >- { >- //Adjust the labels position to left side. >- labelDisplayAsUIComponent.horizontalCenter = undefined; >- labelDisplayAsUIComponent.verticalCenter = 2; >- labelDisplayAsUIComponent.top = undefined; >- labelDisplayAsUIComponent.bottom = undefined; >- labelDisplayAsUIComponent.left = undefined; >- labelDisplayAsUIComponent.right = checkDisplay.width + >int(getStyle("gap")); >- >- //Adjust the checkboxes position to right side. >- checkDisplay.horizontalCenter = undefined; >- checkDisplay.verticalCenter = 0; >- checkDisplay.left = undefined; >- checkDisplay.right = 0; >- >- break; >- } >- >- case LabelPlacement.RIGHT: >- { >- //Adjust the labels position to right side. >- labelDisplayAsUIComponent.horizontalCenter = undefined; >- labelDisplayAsUIComponent.verticalCenter = 2; >- labelDisplayAsUIComponent.top = undefined; >- labelDisplayAsUIComponent.bottom = undefined; >- labelDisplayAsUIComponent.left = checkDisplay.width + >int(getStyle("gap")); >- labelDisplayAsUIComponent.right = undefined; >- >- //Adjust the checkboxes position to left side. >- checkDisplay.horizontalCenter = undefined; >- checkDisplay.verticalCenter = 0; >- checkDisplay.left = 0; >- checkDisplay.right = undefined; >- >- break; >- } >- >- case LabelPlacement.TOP: >- { >- //Adjust the labels position to the top. >- labelDisplayAsUIComponent.horizontalCenter = 0; >- labelDisplayAsUIComponent.verticalCenter = undefined; >- labelDisplayAsUIComponent.top = undefined; >- labelDisplayAsUIComponent.bottom = checkDisplay.height + >int(getStyle("gap")); >- labelDisplayAsUIComponent.left = undefined; >- labelDisplayAsUIComponent.right = undefined; >- >- //Adjust the checkboxes position to the bottom. >- checkDisplay.horizontalCenter = 0; >- checkDisplay.verticalCenter = undefined; >- checkDisplay.top = undefined; >- checkDisplay.bottom = 0; >- >- break; >- } >- >- default: >- { >- break; >- } >- } >- } >- >- >- >//------------------------------------------------------------------------ >-- >- // > // Overridden methods > // > >//------------------------------------------------------------------------ >-- >@@ -450,54 +310,6 @@ public class CheckBox extends ToggleButtonBase > CheckBox.createAccessibilityImplementation(this); > } > >- >- /** >- * @copy >spark.components.supportClasses.SkinnableComponent#partAdded >- * >- * @langversion 3.0 >- * @playerversion Flash 11.8 >- * @playerversion AIR 3.8 >- * @productversion Flex 4.12 >- */ >- override protected function partAdded(partName:String, >instance:Object):void >- { >- super.partAdded(partName, instance); >- >- if (instance == checkDisplay) >- { >- updateLabelPlacement(); >- >- return; >- } >- >- if (instance == labelDisplay) >- { >- updateLabelPlacement(); >- >- return; >- } >- } >- >- >- /** >- * @copy mx.core.UIComponent#styleChanged >- * >- * @langversion 3.0 >- * @playerversion Flash 11.8 >- * @playerversion AIR 3.8 >- * @productversion Flex 4.12 >- */ >- override public function styleChanged(styleProp:String):void >- { >- super.styleChanged(styleProp); >- >- //Check if the style is null for mass style changes or if the >labelPlacement/gap styles were changed. >- if (styleProp == "labelPlacement" || styleProp == "gap" || >styleProp === null) >- { >- updateLabelPlacement(); >- } >- } >- > } > > } > >http://git-wip-us.apache.org/repos/asf/flex-sdk/blob/cdcb4924/frameworks/p >rojects/spark/src/spark/skins/spark/CheckBoxSkin.mxml >---------------------------------------------------------------------- >diff --git >a/frameworks/projects/spark/src/spark/skins/spark/CheckBoxSkin.mxml >b/frameworks/projects/spark/src/spark/skins/spark/CheckBoxSkin.mxml >index aeec082..e6bf5b3 100644 >--- a/frameworks/projects/spark/src/spark/skins/spark/CheckBoxSkin.mxml >+++ b/frameworks/projects/spark/src/spark/skins/spark/CheckBoxSkin.mxml >@@ -70,6 +70,9 @@ > > <fx:Script> > <![CDATA[ >+ import spark.components.supportClasses.LabelPlacement; >+ >+ > /** > * @private > */ >@@ -79,6 +82,141 @@ > * @private > */ > override public function get focusSkinExclusions():Array { >return focusExclusions;}; >+ >+ >+ >//------------------------------------------------------------------------ >-- >+ // >+ // Overridden methods >+ // >+ >//------------------------------------------------------------------------ >-- >+ >+ /** >+ * @copy mx.core.UIComponent#styleChanged >+ * >+ * @langversion 3.0 >+ * @playerversion Flash 11.8 >+ * @playerversion AIR 3.8 >+ * @productversion Flex 4.12 >+ */ >+ override public function styleChanged(styleProp:String):void >+ { >+ super.styleChanged(styleProp); >+ >+ //Check if the style is null for mass style changes or >if the labelPlacement/gap styles were changed. >+ if (styleProp == "labelPlacement" || styleProp == "gap" >|| styleProp === null) >+ { >+ updateLabelPlacement(); >+ } >+ } >+ >+ >+ >//------------------------------------------------------------------------ >-- >+ // >+ // Methods >+ // >+ >//------------------------------------------------------------------------ >-- >+ >+ /** >+ * Sets the label placement in relation to the checkbox. >+ * Requires the SkinParts <code>checkDisplay</code> and ><code>labelDisplay</code>. >+ * >+ * @langversion 3.0 >+ * @playerversion Flash 11.8 >+ * @playerversion AIR 3.8 >+ * @productversion Flex 4.12 >+ */ >+ public function updateLabelPlacement():void >+ { >+ if (!checkDisplay || !labelDisplay) >+ { >+ return; >+ } >+ >+ switch (String(getStyle("labelPlacement")).toLowerCase()) >+ { >+ case LabelPlacement.BOTTOM: >+ { >+ //Adjust the labels position to the bottom. >+ labelDisplay.horizontalCenter = 0; >+ labelDisplay.verticalCenter = undefined; >+ labelDisplay.top = checkDisplay.height + >int(getStyle("gap")); >+ labelDisplay.bottom = undefined; >+ labelDisplay.left = undefined; >+ labelDisplay.right = undefined; >+ >+ //Adjust the checkboxes position to the top. >+ checkDisplay.horizontalCenter = 0; >+ checkDisplay.verticalCenter = undefined; >+ checkDisplay.top = 0; >+ checkDisplay.bottom = undefined; >+ >+ break; >+ } >+ >+ case LabelPlacement.LEFT: >+ { >+ //Adjust the labels position to left side. >+ labelDisplay.horizontalCenter = undefined; >+ labelDisplay.verticalCenter = 2; >+ labelDisplay.top = undefined; >+ labelDisplay.bottom = undefined; >+ labelDisplay.left = undefined; >+ labelDisplay.right = checkDisplay.width + >int(getStyle("gap")); >+ >+ //Adjust the checkboxes position to right side. >+ checkDisplay.horizontalCenter = undefined; >+ checkDisplay.verticalCenter = 0; >+ checkDisplay.left = undefined; >+ checkDisplay.right = 0; >+ >+ break; >+ } >+ >+ case LabelPlacement.RIGHT: >+ { >+ //Adjust the labels position to right side. >+ labelDisplay.horizontalCenter = undefined; >+ labelDisplay.verticalCenter = 2; >+ labelDisplay.top = undefined; >+ labelDisplay.bottom = undefined; >+ labelDisplay.left = checkDisplay.width + >int(getStyle("gap")); >+ labelDisplay.right = undefined; >+ >+ //Adjust the checkboxes position to left side. >+ checkDisplay.horizontalCenter = undefined; >+ checkDisplay.verticalCenter = 0; >+ checkDisplay.left = 0; >+ checkDisplay.right = undefined; >+ >+ break; >+ } >+ >+ case LabelPlacement.TOP: >+ { >+ //Adjust the labels position to the top. >+ labelDisplay.horizontalCenter = 0; >+ labelDisplay.verticalCenter = undefined; >+ labelDisplay.top = undefined; >+ labelDisplay.bottom = checkDisplay.height + >int(getStyle("gap")); >+ labelDisplay.left = undefined; >+ labelDisplay.right = undefined; >+ >+ //Adjust the checkboxes position to the bottom. >+ checkDisplay.horizontalCenter = 0; >+ checkDisplay.verticalCenter = undefined; >+ checkDisplay.top = undefined; >+ checkDisplay.bottom = 0; >+ >+ break; >+ } >+ >+ default: >+ { >+ break; >+ } >+ } >+ } >+ > ]]> > </fx:Script> > >
