[flexcomponents] Best way updating SliderTrackSkin

[Firdosh Tangri]

So I have a HSlider which has a custom skin applied to it called SliderTrack
and its linked up to a VideoDisplay.

Now what I would like to do is while video is downloading I would like to
show how much of the video is downloaded on the slider
so half the bar would be a different color  ( amt user is watching ) while
the other would be a different color (amt of video that is downloaded)

videoHolder_VdDisp.addEventListener(ProgressEvent.PROGRESS,videoLoading);


private function videoLoading(evt:ProgressEvent):void{

   var percent:int=(evt.bytesLoaded*100)/evt.bytesTotal;
   videoDownloadProgress_Lbl.text=percent.toString()+"%";
   //var sdSkin:SliderTrack=
SliderTrack(video_HSlider.getStyle("trackSkin"));  <--- RUNTIME ERROR



}


Error #1034: Type Coercion failed: cannot convert
kcc.components.kccSlider::SliderTrack$ to
kcc.components.kccSlider.SliderTrack.











package  kcc.components.kccSlider
{
   import mx.core.UIComponent;
   import flash.display.Graphics;
   import flash.geom.Matrix;
   import mx.skins.halo.SliderTrackSkin;
   import flash.display.GradientType;
   import mx.skins.Border;
   import mx.styles.StyleManager;
   import mx.utils.ColorUtil;

   public class SliderTrack extends UIComponent
   {
        override public function get height():Number{
           return 10;
       }

       override protected function updateDisplayList(w:Number,
h:Number):void{

           super.updateDisplayList(w, h);
          // User-defined styles.
           var borderColor:Number = getStyle("borderColor");
           var fillAlphas:Array = getStyle("fillAlphas");
           var fillColors:Array = getStyle("trackColors") as Array;
           StyleManager.getColorNames(fillColors);

           // Derivative styles.
           var borderColorDrk:Number =
               ColorUtil.adjustBrightness2(borderColor, -50);

           graphics.clear();

           drawRoundRect(0,0,w,h,0,0,0); // Draw a transparent rect to fill
the entire space

           drawRoundRect(
               1, 0, w, h - 1, 1.5,
               borderColorDrk, 1, null,
               GradientType.LINEAR, null,
               { x: 2, y: 1, w: w - 2, h: 1, r: 0 });

           drawRoundRect(
               2, 1, w - 2, h - 2, 1,
               borderColor, 1, null,
               GradientType.LINEAR, null,
               { x: 2, y: 1, w: w - 2, h: 1, r: 0 });

           drawRoundRect(
               2, 1, w - 2, 1, 0,
               fillColors, Math.max(fillAlphas[1] - 0.3, 0),
               horizontalGradientMatrix(2, 1, w - 2, 1));

       }


       override public function get measuredHeight():Number{
           return 10;
       }


   }
}


cheers
firdosh