开发者

Remove hover gray shade from flex spark button

I create a new skin for a spark button, starting from the default button skin. Then I remove all the layers in the skin, except the text layer. If I use a button with this skin normally, everything is OK. If I put the button in an ItemRenderer, when I hover one of the buttons, it gets a shade of gray. Here's a code sample.

The skin:

<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" minWidth="21" minHeight="21" alpha.disabled="0.5">

<!-- host component -->
<fx:Metadata>
    <![CDATA[ 
    /** 
     * @copy spark.skins.spark.ApplicationSkin#hostComponent
     */
    [HostComponent("spark.components.Button")]
    ]]>
</fx:Metadata>

<!-- states -->
<s:states>
    <s:State name="up" />
    <s:State name="over" />
    &开发者_运维知识库lt;s:State name="down" />
    <s:State name="disabled" />
</s:states>

<!-- layer 8: text -->
<!--- @copy spark.components.supportClasses.ButtonBase#labelDisplay -->
<s:Label id="labelDisplay"
         textAlign="center"
         verticalAlign="middle"
         maxDisplayedLines="1"
         horizontalCenter="0" verticalCenter="1"
         left="10" right="10" top="2" bottom="2">
</s:Label>

The code where I use it:

    <s:applicationComplete>
    <![CDATA[
        dg.dataProvider = new ArrayList(['but1', 'but2']);
    ]]>
</s:applicationComplete>

<s:DataGroup id="dg">
    <s:layout>
        <s:HorizontalLayout gap="0" />
    </s:layout>
    <s:itemRenderer>
        <fx:Component>
            <s:ItemRenderer>
                <s:Button skinClass="Test" label="{data}" width="200" height="50"/>
            </s:ItemRenderer>
        </fx:Component>
    </s:itemRenderer>
</s:DataGroup>

How can I stop this from happening?


It was caused by the item renderer. I added this and it works:

           <s:ItemRenderer>
                <fx:Script>
                    <![CDATA[
                        override protected function get hovered():Boolean {
                            return false;
                        }
                    ]]>
                </fx:Script>
                <s:Button skinClass="Test" label="{data}" width="200" height="50"/>
            </s:ItemRenderer>

Is there a better, more elegant way?

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜