SparkSkin HostComponent - 空资源问题

Question

当我尝试访问 SparkSkin 类 （空引用） 中的 hostComponent 元素时，出现错误。

My itemRenderer：

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:fx="http://ns.adobe.com/mxml/2009"
         xmlns:s="library://ns.adobe.com/flex/spark"
         xmlns:mx="library://ns.adobe.com/flex/mx"
         horizontalAlign="center"
         creationComplete="main()">

    <fx:Script>
        <![CDATA[

            [Bindable]
            public var progress:Number;

            public function getProgress():Number
            {
                return data.@progress;
            }

            //Define a property for returning the new value to the cell.
            public var result:Boolean=false;

            public function main():void{                
                progress = Number(data.@progress);
                editor.setProgress(Number(data.@progress), 100);
            }


        ]]>
    </fx:Script>

    <fx:Style source="../css/progressbar.css" />
    <!-- Moving Progress Bar -->
    <mx:ProgressBar id="editor" width="100%" height="20"
                    mode="manual" labelPlacement="center"
                    label="{Number(data.@progress).toString()+'%'}"
                    barSkin="startkit.skin.CustomProgressBarSkin"
                    maskSkin="startkit.skin.CustomProgressBarSkin"/>


</mx:VBox> 

My SparkSkin：

<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin name="CustomProgressBarSkin"
             xmlns:fx="http://ns.adobe.com/mxml/2009"
             xmlns:s="library://ns.adobe.com/flex/spark"
             creationComplete="main()">

    <fx:Metadata>
        <![CDATA[       
            [HostComponent("startkit.renderer.ProgressBarRenderer")]
        ]]>     
    </fx:Metadata>

    <fx:Script>
        <![CDATA[

            import mx.controls.ProgressBar;
            import mx.core.UIComponent;         
            import spark.components.supportClasses.ItemRenderer;            
            import startkit.renderer.ProgressBarRenderer;

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

            public function main():void
            {               
                trace(hostComponent.progress);
            }

        ]]>
    </fx:Script>

    <!-- layer 1: fill -->
    <s:Rect left="2" right="2" top="2" bottom="2" >
        <s:fill>            
            <s:SolidColor color="#00FF00" />
        </s:fill>
    </s:Rect>

    <!-- layer 2: border -->
    <s:Rect left="2" right="2" top="2" bottom="2" >
        <s:stroke>
            <s:LinearGradientStroke rotation="90">
                <s:GradientEntry color="0xFFFFFF" alpha="0.9" />
                <s:GradientEntry color="0xFFFFFF" alpha="0.5" />
            </s:LinearGradientStroke>
        </s:stroke>
    </s:Rect>

    <!-- layer 3: right edge -->
    <s:Rect right="1" top="2" bottom="2" width="1" >
        <s:fill>
            <s:SolidColor color="0x000000" alpha="0.55" />
        </s:fill>
    </s:Rect>

</s:SparkSkin>

当我尝试跟踪“hostComponent”资源上的“progress”属性时，我收到此错误：

TypeError: Error #1009: Il est impossible d'accéder à la propriété ou à la méthode d'une référence d'objet nul.
    at startkit.skin::CustomProgressBarSkin/main()[C:\Documents and Settings\hduborper\Adobe Flash Builder 4.5\kit_demarrage\src\startkit\skin\CustomProgressBarSkin.mxml:28]
    at startkit.skin::CustomProgressBarSkin/___CustomProgressBarSkin_SparkSkin1_creationComplete()[C:\Documents and Settings\hduborper\Adobe Flash Builder 4.5\kit_demarrage\src\startkit\skin\CustomProgressBarSkin.mxml:5]
    at flash.events::EventDispatcher/dispatchEventFunction()
    at flash.events::EventDispatcher/dispatchEvent()
    at mx.core::UIComponent/dispatchEvent()[E:\dev\hero_private\frameworks\projects\framework\src\mx\core\UIComponent.as:13128]
    at mx.core::UIComponent/set initialized()[E:\dev\hero_private\frameworks\projects\framework\src\mx\core\UIComponent.as:1818]
    at mx.managers::LayoutManager/doPhasedInstantiation()[E:\dev\hero_private\frameworks\projects\framework\src\mx\managers\LayoutManager.as:842]
    at mx.managers::LayoutManager/doPhasedInstantiationCallback()[E:\dev\hero_private\frameworks\projects\framework\src\mx\managers\LayoutManager.as:1180]

我不知道会发生什么.. 。 请帮我 ：）

Answer 1

我想我看到了问题所在。您似乎正在尝试将 Spark Skin 应用于 MX 组件。这是不可能的。由于 MX ProgressBar 不扩展 SkinnableComponent，因此它无法接受 Spark 样式皮肤。

在 MX 组件中，“皮肤”样式属性通常需要 CSS 中定义的名称。

在我看来，您有几个选择：

1. 创建 皮肤MX Component 并使用它。
2. 创建 Spark 版本的 ProgressBar 并使用它。