[flexcomponents] Custom Styles

[Firdosh Tangri]

Hey all ,
            I am trying to write a custom component in AS3 from scratch but
am having some trouble with the skinning and Style tags.

So its basic rating component ( like 5 stars )

I set up the stylels

[Style (name="iconUpSkin" , type="Class" , inherit="no" )]

   [Style (name="iconOverSkin" , type="Class" , inherit="no" )]

   [Style (name="iconDownSkin" , type="Class" , inherit="no" )]


public class Rating extends UIComponent
   {
       protected var iconUpSkin:IFlexDisplayObject;
       protected var iconOverSkin:IFlexDisplayObject;
       protected var iconDownSkin:IFlexDisplayObject;

//variables to hold the skins


override protected  function createChildren():void{
           super.createChildren();
           iconUpSkin  = createSkin( "iconUpSkin"    , RatingIconUpSkin );
           //iconOverSkin = createSkin( "iconOverSkin" , RatingIconOverSkin
);
           //iconDownSkin  = createSkin( "iconDownSkin", RatingIconDownSkin
);

       }


protected function createSkin( skinName:String, defaultSkin:Class ) :
IFlexDisplayObject{

var newSkin:IFlexDisplayObject =
IFlexDisplayObject(getChildByName(skinName)); //check to see if the child
already exists

if (!newSkin){   // IF DOESNT exist

               var newSkinClass:Class = Class(getStyle(skinName));   // see
if the user specified a skin

               if( !newSkinClass ){
                   trace("noskin");
                   newSkinClass = defaultSkin;                // if not
assign the default one
               }

               if (newSkinClass){

                  newSkin = IFlexDisplayObject(new newSkinClass());
//HERE IS WHERE I GET THE ERROR

Error: Error #2136: The SWF file
file:///C:/Fidi/projects/RatingComponent/bin/RatingComponent-debug.swfcontains
invalid data.

at com.ftangri.components::Rating/com.ftangri.components:Rating::createSkin
()[C:\Fidi\projects\RatingComponent\src\com\ftangri\components\Rating.as:76]

                   if( !newSkin ){
                       //newSkin = new defaultSkin();
                   }

                   newSkin.name = skinName;

                   var styleableSkin:ISimpleStyleClient = newSkin as
ISimpleStyleClient;


                   if (styleableSkin){

                       styleableSkin.styleName = this;
                   }

                   addChild(DisplayObject(newSkin));

               }

           }

           return newSkin;

       }






Here is the code for the RatingIconUpSkin

package com.ftangri.skins
{

   import mx.controls.Image;
   import mx.core.Container;

   [Embed (source="../../../assets/RankingUnSelectedUpSkin.png")]

   public class RatingIconUpSkin extends Container
   {
       private var upSkin:Image;

       public function RatingIconUpSkin()
       {
           super();
           upSkin=new Image();
       }

       override protected  function createChildren():void{
           super.createChildren();
           upSkin.source="../../../assets/RankingUnSelectedUpSkin.png";
           addChild(upSkin);


       }

       override protected function updateDisplayList( w:Number, h:Number )
: void{
           upSkin.move(0,0);
           upSkin.setActualSize(measuredMinWidth,measuredMinHeight);
       }

       override protected function measure():void {

           super.measure();
           measuredWidth = measuredMinWidth = 20;
           measuredHeight = measuredMinHeight = 20;
       }

   }
}