skinClass WindowedApplication zuweisen

[carsten cs]

Hallo

ich benutze Air mit dem FlashBuilder4 und wollte ein Skin für die WindowedApplication Klasse erstellen.

ich habe die SkinKlasse über den ProjectExplorer als Kopie von der spark.skins.spark.SparkChromeWindowedApplicationSk in erstellt und wenn ich diese Klasse im DesignView im Editor anschauen möchte, gibt es eine Endlosschleife: Ein kleines Prrogress-Popup geht auf, der skin kann irgendwie nicht dargestellt werden und dann geht das Progress-Popup erneut auf.

Hier mal der code von der Klasse:

<!--

      ADOBE SYSTEMS INCORPORATED
      Copyright 2009 Adobe Systems Incorporated
      All Rights Reserved.

      NOTICE: Adobe permits you to use, modify, and distribute this file
      in accordance with the terms of the license agreement accompanying it.

-->
<!--- A skin class for the Spark WindowedApplication component. 
      This class defines the Flex chrome which includes a border, status bar, 
      gripper button, title bar, and title bar buttons.
      
      <p>You can either use  system chrome, the FlexChromSkin class, or 
      the WindowedApplicationSkin class to define the appearance of 
      the WindowedApplication and Window containers. 
      To use the FlexChromSkin class with the WindowedApplication container, 
      set <code>systemChrome</code> to "none" 
      in the application's .xml file, and set the <code>skinClass</code> style to
      spark.skins.spark.FlexChromSkin. 
      To use the FlexChromSkin class with the Window container, 
      set the <code>Window.systemChrome</code> property to "none", 
      and set the <code>skinClass</code> style to
      spark.skins.spark.FlexChromSkin.</p>

      @see spark.components.WindowedApplication

      @langversion 3.0
      @playerversion Flash 10
      @playerversion AIR 1.5
      @productversion Flex 4      
-->
<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" alpha.disabledGroup="0.5" >
    <fx:Metadata>[HostComponent("spark.components.WindowedApplication")]</fx:Metadata>

    <fx:Script fb:purpose="styling">
        /*  Define the skin elements that should not be colorized. 
         *  For WindowedApplication, border and status bar background are colorized,
         *  but the content area and status text are not. 
         *  Exclude the titleBar because it is a SparkSkin and we 
         *  don't want to colorize it twice.
         * 
         * @langversion 3.0
         * @playerversion Flash 10
         * @playerversion AIR 1.5
         * @productversion Flex 4 
         */
        static private const exclusions:Array = ["backgroundRect", "contentGroup", "titleBar",
                                                 "titleBarBackgroundRect", "statusText",
                                                 "borderBgFill"];

        /**
         * @private
         */
        override public function get colorizeExclusions():Array {return exclusions;}
        
        /**
         * @private
         */
        override protected function initializationComplete():void
        {
            useChromeColor = true;
            super.initializationComplete();
        } 
        
        /**
         *  @private
         */
        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number) : void
        {
            backgroundFill.color = getStyle("backgroundColor");
            backgroundFill.alpha = getStyle("backgroundAlpha");
            super.updateDisplayList(unscaledWidth, unscaledHeight);
        }
    </fx:Script>
    
    <s:states>
        <s:State name="normal" />
        <s:State name="disabled" stateGroups="disabledGroup" />
        <s:State name="normalAndInactive" stateGroups="inactiveGroup" />
        <s:State name="disabledAndInactive" stateGroups="disabledGroup, inactiveGroup" />
    </s:states>

    <!-- layer 1: background fill -->
    <!--- Defines the background color of the skin. -->
    <s:Rect id="backgroundRect" left="1" right="1" top="1" bottom="1" >
        <s:fill>
            <!--- @private -->
            <s:SolidColor id="backgroundFill"/>
        </s:fill>
    </s:Rect>

    <!-- title bar background fill for when the title bar is inactive -->
    <!--- Defines the background color of the title bar. -->
    <s:Rect id="titleBarBackgroundRect" left="0" right="0" top="0" height="24" visible="{titleBar.visible}" >
        <s:fill>
            <!--- @private -->
            <s:SolidColor id="titleBarBgFill" color="0xFFFFFF" />
        </s:fill>
    </s:Rect>

        
    <!-- layer 2: titlebar + content + status bar -->
    <s:Group left="1" right="1" top="1" bottom="1" minHeight="24" minWidth="0" >
        <s:layout>
            <s:VerticalLayout gap="0"/>
        </s:layout>
    
        <!-- title bar to display when not using 'systemChrome' -->
        <!--- @copy spark.components.WindowedApplication#titleBar -->
        <s:TitleBar id="titleBar" width="100%" minHeight="24" alpha.inactiveGroup="0.5" />
        
        <!-- content -->
        <!--- @copy spark.components.SkinnableContainer#contentGroup -->
        <s:Group id="contentGroup" width="100%" height="100%" minHeight="0" minWidth="0"/>
        
        <!-- status bar -->
        <!--- @copy spark.components.WindowedApplication#statusBar -->
        <s:Group id="statusBar" width="100%" minHeight="24" >
        
            <!-- status bar fill -->
            <s:Rect left="0" right="0" top="0" bottom="0">
               <s:fill>
                    <s:LinearGradient rotation="90">
                        <s:GradientEntry color="0xE2E2E2" />
                        <s:GradientEntry color="0xD9D9D9" />
                    </s:LinearGradient>
               </s:fill>
            </s:Rect>
            
            <!-- status bar highlight -->
            <s:Rect left="1" right="1" top="1" bottom="0" >
               <s:stroke>
                    <s:LinearGradientStroke rotation="90" weight="1">
                        <s:GradientEntry color="0xEAEAEA" />
                        <s:GradientEntry color="0xBEBEBE" />
                    </s:LinearGradientStroke>
               </s:stroke>
            </s:Rect>
        
            <!-- status text -->
            <!--- @copy spark.components.WindowedApplication#statusText -->
            <s:Label id="statusText" top="2" bottom="2" left="10" right="10" verticalAlign="middle" 
                fontSize="10" color="0x585858" width="100%" maxDisplayedLines="1" />
                    
        </s:Group> 

    </s:Group>
    
    <!-- layer 3: gripper -->
    <!--- 
        By default, the button uses the spark.skins.spark.windowChrome.GripperSkin class
        to define the skin for the gripper button.
            
        @copy spark.components.WindowedApplication#gripper
    
        @see spark.skins.spark.windowChrome.GripperSkin 
    -->
    <s:Button id="gripper" right="3" bottom="3" tabEnabled="false" 
              skinClass="spark.skins.spark.windowChrome.GripperSkin" /> 

    <!-- layer 4: border -->
    
    <!-- background of border for when it is alpha=0.5 -->
    <!--- Defines the background color of the border. -->
    <s:Group id="borderBgFill" left="0" right="0" top="0" bottom="0" >
        <s:Rect left="0" right="0" top="0" bottom="0">
            <s:stroke>
                <s:SolidColorStroke weight="1" color="0xFFFFFF" />
            </s:stroke>
        </s:Rect>
    </s:Group>

    <!-- the border -->
    <s:Rect left="0" right="0" top="0" bottom="0">
        <s:stroke>
            <s:SolidColorStroke alpha.inactiveGroup="0.5" weight="1" color="0xA6A6A6" />
        </s:stroke>
    </s:Rect>
        
</s:SparkSkin>

??


etwas anderes was ich nicht verstehe ist, wenn ich den skin folgendermassen übergebe scheint der Designview zu funktionieren ... aber was heißt zu funktionieren ... eigentlich wird der skinn auch nicht dargestellt, aber wenigstens der content der Haupt.mxml Datei.

wenn ich den originalSkin benutze, wird allerdings auch nicht der Skin im designView angezeigt...sondern auch nur der content.

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
					   xmlns:s="library://ns.adobe.com/flex/spark" 
					   xmlns:mx="library://ns.adobe.com/flex/mx"
					   title="test" 
					   viewSourceURL="srcview/index.html"
					   >
	
	
	<fx:Style>
		@namespace s "library://ns.adobe.com/flex/spark";
		@namespace mx "library://ns.adobe.com/flex/mx";
		
		s|WindowedApplication {
			
			
			
			skinClass:ClassReference("skins.css_WindowedApplicationSkin");
			backgroundColor:#45290d;
			backgroundAlpha:"0.7"
			
		}

		
	</fx:Style>
	<fx:Script>
		<![CDATA[
			import skins.css_WindowedApplicationSkin;
		]]>
	</fx:Script>

...

wenn ich allerdings den skin direkt im WindowedApplication Tag setzen möchte funktioniert der DesignView überhaupt nicht. d.h. noch nicht einmal der content wird angezeigt.


und die Datei wird mit einem Ausrufezeichen im projectexplorer markiert, mit dem Hinweis auf ein problem im designView.

??