AS3 Setting width and height of a Sprite Container

Question

Ok, my mind is boggling over this issue im having. I know this might seem like such an easy issue and I can't understand why I cant figure it out but none the less I can't and I've just about given up. Here's the issue:

I have a sprite container which is supposed to hold a bunch of thumbnails to videos. I am able to populate the container with all the videos and the whole works but obviously if I add a bunch of videos its going to exceed the size of the flash document so I need to add a UIScrollBar (which I did) now the scrollbars target is set to the container but isnt allowing me to scroll and if im correct this is because the container doesnt have a set height. So Im trying to set the height of this container but the second I try setting the height or even width all my thumbnails I used to be able to see are gone! It's as if the size is being set to 0 when its not I've even tried to set it to a specified size just to test and nothing. Anyways heres my code if anyone can help out I'd really appreciate it! Thanks in advance!

import fl.controls.UIScrollBar; 

var videoList:XMLList;
var numVideos:Number;
var current_Video:Number = 0;
var video_position:Number;
var video_paused:Boolean;
var xmlPlaylist:String;

//XML File setup
var playlist_xml:XML;
var myLoader:URLLoader = new URLLoader();

//Playlist setup
var thumb_width:Number;
var thumb_height:Number;
var thumbs_x:Number;
var thumbs_y:Number;
var main_container:Sprite;
var thumbs:Sprite;
var scrollbar:UIScrollBar;

//Loader Data
this.loaderInfo.addEventListener(Event.COMPLETE, loaderComplete);
function loaderComplete(e:Event):void
{
    var myQueryStrings = this.loaderInfo.parameters;
    xmlPlaylist = myQueryStrings.pList;

    myLoader.load(new URLRequest(xmlPlaylist + "?uniq=" + new Date().getTime()));
}

myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void {
    playlist_xml = new XML(e.target.data);

    numVideos = playlist_xml.video.length();
    videoList = playlist_xml.video;

    thumb_width = playlist_xml.@thumb_width;
    thumb_height = playlist_xml.@thumb_height;
    thumbs_x = playlist_xml.@thumbs_x;
    thumbs_y = playlist_xml.@thumbs_y;

    current_Video = Math.round(Math.random()*(numVideos-1))+1;
    current_Video--;

    startPlayer();
}

function startPlayer()
{
    makeContainers();
    callThumbs();
    setVideo(current_Video);
}

function makeContainers():void
{
    main_container = new Sprite();
    addChild(main_container);

    thumbs = new Sprite();
    thumbs.addEventListener(MouseEvent.CLICK, playVideo);
    thumbs.addEventListener(MouseEvent.MOUSE_OVER, onOver);
    thumbs.addEventListener(MouseEvent.MOUSE_OUT, onOut);
    thumbs.x = thumbs_x;
    thumbs.y = thumbs_y;

This is where the Issue is: (If i comment out this code it displays the thumbnails)

    thumbs.width = thumb_width;
    thumbs.height = (thumb_height + 11) * 3;

    thumbs.buttonMode = true;
    main_container.addChild(thumbs);

    scrollbar = new UIScrollBar();
    scrollbar.x = thumbs_x + thumb_width + 2;
    scrollbar.y = thumbs_y;
    scrollbar.setSize(25, (thumb_height + 11) * 3);
    scrollbar.visible = true;
    scrollbar.scrollTarget = thumbs;
    main_container.addChild(scrollbar);
}

function callThumbs():void
{
    for (var i:Number = 0; i (less than) numVideos; i++) //For some reason Stack Overflow isnt allowing me to put the symbol less than so i just typed it in...
    {
        var thumb_url = videoList[i].@thumb;
        var thumb_loader = new Loader();
        thumb_loader.name = i;
        thumb_loader.load(new URLRequest(thumb_url));

        thumb_loader.contentLoaderInfo.addEventListener(Event.COMPLETE, thumbLoaded);

        thumb_loader.y = (thumb_height + 11) * i;
    }
}

function thumbLoaded(e:Event):void
{
    var my_thumb:Loader = Loader(e.target.loader);
    thumbs.addChild(my_thumb);
}

function playVideo(e:MouseEvent):void
{
    setVideo(e.target.name);
}

function onOver (e:MouseEvent):void
{
    var my_thumb:Loader = Loader(e.target);
    my_thumb.alpha = 0.5;
}

function onOut (e:MouseEvent):void
{
    var my_thumb:Loader = Loader (e.target);
    my_thumb.alpha = 1;
}

function setVideo(current_Video)
{
    var display:String = videoList[current_Video].@title;
    var video:String = videoList[current_Video].@url;

    txt_Display.text = display;
    flvPlayer.source = video;
}

stop();

Answer 1

This is easy. You are creating Sprite, adding listeners, setting coordinates. The sprite is still empty. Then you set width and height, which are translating to scaleX and scaleY. On empty sprite this messes up transformation matrix and sprite will never show up. Set width, height, or scaleX/Y only on non-empty sprites.