Loading via MovieClipLoader to ScrollPane

I want to use the movieClipLoader class to load a JPG into the scrollPane component…
I can get the picture to load via the movieClipLoader class and I can even get it to load on top of the scrollPane but not into the scroll pane any suggestions…

here is the code…


var viewImageListner:Object = new Object();
viewImageListner["owner"] = this;
var viewImage:MovieClipLoader = new MovieClipLoader();
viewImage["owner"] = this;
viewImageListner.onLoadError = function() {
 //throwError("Problem locating plug-in. Check location or path.  "+loc, "Plug-In Error");
};
viewImageListner.onLoadInit = function() {
 trace("Pic has been initalized.");
};
viewImageListner.onLoadStart = function() {
 trace("Started.");
};
viewImageListner.onLoadProgress = function(target, loaded, total) {
 trace(loaded+" "+total);
};
viewImageListner.onLoadComplete = function() {
 trace("Pic has been loaded.");
 trace("The name of this is: "+this.owner._name);
};
viewImage.addListener(viewImageListner);
 
function loadImage(s:String):Void {
 //s is a path to the location of the JPG
 //imagePreview.contentPath = "container";
 //var c = imagePreview.content;
 // Function to actually attach the clip to scrollpane
 viewImage.loadClip(s, imagePreview.content);
}

My main end goal is to do a progress bar while it loads the JPG to the component so if you know of a better way of achieving the same affect i am all ears!