[
https://issues.apache.org/jira/browse/FLEX-34689?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
]
DarkStone updated FLEX-34689:
-----------------------------
Description:
This issue has been resolved, here is the right way to set default skinClass
for the custom SkinnableComponent, which is to use the Type Selector:
package test
{
import flash.utils.getQualifiedClassName;
import mx.styles.CSSStyleDeclaration;
import spark.components.supportClasses.SkinnableComponent;
public class TestComponent extends SkinnableComponent
{
public function TestComponent()
{
super();
var css:CSSStyleDeclaration = new CSSStyleDeclaration();
css.setStyle("skinClass",
skin.DefaultTestComponentSkin);
styleManager.setStyleDeclaration(getQualifiedClassName(this).replace(/::/g,
"."), css, true);
}
}
}
DarkStone
2014-12-19
was:
[Step to reproduce the bug]
1. Create a subclass of SkinnableComponent named TestComponent.
package test
{
import spark.components.supportClasses.ButtonBase;
import spark.components.supportClasses.SkinnableComponent;
import spark.core.IDisplayText;
public class TestComponent extends SkinnableComponent
{
[SkinPart]
public var textDisplay:IDisplayText;
[SkinPart]
public var testButton:ButtonBase;
public function TestComponent()
{
super();
}
}
}
2. Create 2 different skins for TestComponent:
TestComponentASkin.mxml (see the attachment)
TestComponentBSkin.mxml (see the attachment)
3. Create a CSS file named TestStyle.css
@namespace s "library://ns.adobe.com/flex/spark";
s|SkinnableComponent.testComponentB
{
skinClass: ClassReference("test.TestComponentBSkin");
}
4. In the main Application.mxml, do the following:
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication frameRate="30" showStatusBar="false"
xmlns:fx="http://ns.adobe.com/mxml/2009";
xmlns:s="library://ns.adobe.com/flex/spark" xmlns:test="test.*">
<fx:Style source="test/TestStyle.css"/>
<test:TestComponent id="tc" skinClass="test.TestComponentASkin"
horizontalCenter="0" top="10"/>
<s:Button label="Change Skin" click="tc.styleName='testComponentB'"
horizontalCenter="0" bottom="10"/>
</s:WindowedApplication>
5. Run the application, click the "Change Skin" button, then you'll see the
bug, which is the TestComponent's skin won't change!
[Solution]
I have already solved this bug, it's very eazy to fix:
Just modify the source code of SkinnableComponent.as, add the following codes
to the class:
override public function set styleName(value:Object):void
{
clearStyle("skinClass");
super.styleName = value;
}
I've already fixed the bug, and pushed it to the develop branch of the Flex SDK
git.
DarkStone
2014-12-18
> How to correctly set default skinClass for custom SkinnableComponent?
> ---------------------------------------------------------------------
>
> Key: FLEX-34689
> URL: https://issues.apache.org/jira/browse/FLEX-34689
> Project: Apache Flex
> Issue Type: Question
> Components: Spark: SkinnableComponent
> Affects Versions: Apache Flex 4.13.0
> Reporter: DarkStone
> Assignee: DarkStone
> Priority: Minor
> Labels: easyfix, easytest
> Attachments: TestComponent.as, TestComponentASkin.mxml,
> TestComponentBSkin.mxml, TestStyle.css
>
> Original Estimate: 0h
> Remaining Estimate: 0h
>
> This issue has been resolved, here is the right way to set default skinClass
> for the custom SkinnableComponent, which is to use the Type Selector:
> package test
> {
> import flash.utils.getQualifiedClassName;
>
> import mx.styles.CSSStyleDeclaration;
>
> import spark.components.supportClasses.SkinnableComponent;
>
> public class TestComponent extends SkinnableComponent
> {
> public function TestComponent()
> {
> super();
> var css:CSSStyleDeclaration = new CSSStyleDeclaration();
> css.setStyle("skinClass",
> skin.DefaultTestComponentSkin);
>
> styleManager.setStyleDeclaration(getQualifiedClassName(this).replace(/::/g,
> "."), css, true);
> }
> }
> }
> DarkStone
> 2014-12-19
--
This message was sent by Atlassian JIRA
(v6.3.4#6332)
