带有按钮和皮肤的Flex DataGrid

时间:2014-01-31 02:55:59

标签: actionscript-3 flex datagrid flex-spark

尽可能尝试,当我将按钮放在spark dataGrid中时,我无法设置Spark按钮。我被限制使用光环主题。

我在单独的mxml文件中创建了按钮渲染器;我在dataGrid外面有单独的按钮,正确显示皮肤,所以我确信皮肤没有任何问题。这一点的重点是在dataGrid中使用与外部相同的皮肤

以下代码显示了我所看到的相同行为;在这种情况下,渲染器是在线创建的。似乎skinClass不受尊重。还是有另一种方法可以做到。

<s:DataGrid id="dg" width="500" dataProvider="{employees2}">
    <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField="name" headerText="Name">
                <s:itemRenderer>
                    <fx:Component>
                        <s:GridItemRenderer>
                            <s:Button label="Press Me"
                                      top="0" bottom="0" left="0" right="0"
                                      skinClass="MyButtonSkin" />
                        </s:GridItemRenderer>
                    </fx:Component>
                </s:itemRenderer>
            </GridColumn>   
        </s:ArrayList>
    </s:columns>
</s:DataGrid>

在文件MyButtonSkin.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:SparkButtonSkin 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">

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

<fx:Script fb:purpose="styling">
    <![CDATA[         
        /* Define the skin elements that should not be colorized. 
        For button, the graphics are colorized but the label is not. */
        static private const exclusions:Array = ["labelDisplay"];

        /** 
         * @private
         */     
        override public function get colorizeExclusions():Array {return exclusions;}

        /**
         * @private
         */
        override protected function initializationComplete():void
        {
            useChromeColor = true;
            super.initializationComplete();
        }  

    ]]>        
</fx:Script>

<!-- states -->
<s:states>
    <s:State name="up" />
    <s:State name="over" />
    <s:State name="down" />
    <s:State name="disabled" />
</s:states>

<!-- layer 2: fill -->
<!--- @private -->
<s:Rect id="fill" left="1" right="1" top="1" bottom="1" radiusX="10">
    <s:fill>
        <s:LinearGradient rotation="90">
            <s:GradientEntry color="0xFAFAFA" 
                             color.over="0xBBBDBD" 
                             color.down="0xAAAAAA" 
                             alpha="0.85" />
            <s:GradientEntry color="0x808080" 
                             color.over="0x9FA0A1" 
                             color.down="0x929496" 
                             alpha="0.85" />
        </s:LinearGradient>
    </s:fill>
</s:Rect>

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

</s:SparkButtonSkin>

1 个答案:

答案 0 :(得分:0)

似乎将按钮缩放到网格项的大小不会调整角半径。

我最终得到一个200x200像素的按钮,角半径为6像素;它只是无法看到。我将值提高到25,现在我可以看到它