We have decided to open up our component library to users -- normally we use this library internally to develop widgets, but we thought you would find it useful as well.  There are a lot of components for you to explore; at the moment documentation is very sparse, but we will be improving this with time, in addition to other aspects of the library.  Also, we will be providing examples of these components in action, and short tutorials on how to use them.  You can download the yourminis Component Library here.  You will want to make sure that your classpath ("File"->"Publish Settings"->"Flash [tab]"->"Settings...") includes a link to where ever you extract the yourminis Component Library to.

The first component we will be showing is the ImageLoader utility, which allows you to load images, frame them, and resize them proportionately (so that they don't skew when resized).  You can view a widget using this component here.  You can download the sample FLA here or grab the code from the code box below.

import yourminis.api.IWidget; import yourminis.utils.ImageLoader; var widget:IWidget; var il:ImageLoader; var im_mc:Sprite; addEventListener("widget-loaded",onWidgetLoaded); function onWidgetLoaded(evt:Event):void { widget.chrome.resizable = true; widget.addEventListener(widget.WIDGET_RESIZED,onWidgetResize); widget.chrome.setBounds(240,180,1000,1000); widget.initWidget(240,180,0x000000); widget.chrome.setTitle("Image Loader Sample"); im_mc = new Sprite(); im_mc.x = 4; im_mc.y = 25; addChild(im_mc); loadImage("http://static.guim.co.uk/Guardian/environment/gallery/2007/nov/12/wildlife/Giant-panda1C-David-Sheppar-8146.jpg"); } function onWidgetResize(evt:Event):void { resizeAll(); } function resizeAll() { var w = widget.width; var h = widget.height; if (il) il.setSize(w-8,h-29); } function loadImage(str) { if (im_mc.numChildren) im_mc.removeChildAt(0); il = new ImageLoader( str, //_url:String -- A string containing the URL of the image to load 20, //_maxWidth:Number -- The maximum width of the image (can be changed with setSize(w,h) also) 20, //_maxHeight:Number -- The maximum height of the image (can be changed with setSize(w,h) also) true, //_preserveRatio:Boolean -- If true, the image will be resized proportionately, otherwise it will fit its container exactly false, //_showIndicator:Boolean -- If true, a loading indicator will be shown while the image is loading true, //_centerImage:Boolean -- If true, the image will be centered inside its container, otherwise it will align to the upper left 4, //_padding:Number -- padding between the image and its container 0x666666, //_frameColor:uint -- color of the inside of the image container, -1 to disable 0xFF0000 //_frameBorderColor:uint -- color of the border around the image container, -1 to disable ); im_mc.addChild(il); resizeAll(); }

As you can see, after the widget is initialized in the "onWidgetLoaded" event handler, a new Sprite is created ("im_mc") to hold the ImageLoader.  This isn't required but it allows you more control over placing the ImageLoader before it is initialized, and allows you to easily dispose of the ImageLoader and create a new instance of it if you want to reload an image into it or change the way it is constructed.

A description of all the parameters for the constructor of the ImageLoader is provided in the code.  The "setSize(width,height)" function allows you to set the size of the image loader.  Note that we check if the instance "il" of the ImageLoader is defined before calling any function, as it is possible the user could remove the imageLoader object in their code if they were to dispose of the image.

The ImageLoader allows you to load images pretty easily, but what if you want to load movies?  Our next component sample will show you just how to do that.