why is this layout class not always working?

This is my attempt to write my own 开发者_开发百科layout class for a panel of buttons (which may have between 2 and 20 buttons). Basically they should all be of a uniform size, with a constant spacing (5px) and resize appropriately.

However it doesn't always work.

Sometimes it works absolutely fine, but others it gives space for an extra column, or becomes unable to add additional columns on resizing (removing columns is fine), or something wont work. And it takes ages and seems horribly expensive in terms of computations. Reducing width seems significantly more painful in this respect for some reason.

Anyway, here it is:

package layouts
{
    import mx.core.ILayoutElement;

import spark.components.supportClasses.GroupBase;
import spark.layouts.supportClasses.LayoutBase;

public class QButtonsLayout extends LayoutBase
{
    public function QButtonsLayout()
    {
        super();
    }

    override public function measure():void
    {
        super.measure();

        target.measuredHeight = 130;

    }

    override public function updateDisplayList(w:Number, h:Number):void
    {
        super.updateDisplayList(w,h);

        var tCount:int = target.numElements; // Number of elements
        var tW:Number = target.width; // Width of target (button area) - somewhere between 550 and 1000px

        var maxW:Number = 1; // Largest natural width of any given element
        var maxH:Number = 1; // Largest natural height of any given element

        var eSetW:Number = 1; // Set (to be) width of each element upon the target
        var eSetH:Number = 1; // Set (to be) height of each element upon the target

        var tCols:Number = 1; // Number of columns upon the target
        var tRows:Number = 1; // Number of rows upon the target 

        for (var i:int = 0; i<tCount; i++) // Find maxW
        {
            var layoutElement:ILayoutElement = useVirtualLayout ? target.getVirtualElementAt(i):target.getElementAt(i);         
            var thisW:Number = layoutElement.getPreferredBoundsWidth();
            var thisH:Number = layoutElement.getPreferredBoundsHeight();

            if(thisW > maxW)
            {
                maxW = thisW;
            };

            if(thisH > maxH)
            {
                maxH = thisH;
            };
        }

        tCols = Math.floor((tW-5)/(maxW+5)); //Find maximum number of columns one can fit onto the target

        if(tCols>tCount) //Fix to deal with cases with low tCounts
        {
            tCols = tCount;
        };

        tRows = Math.ceil(tCount/tCols); //Find corresponding number of rows

        eSetW = ((tW-5)/tCols)-5; //Set widths of elements based upon number of columns, 5s to add some space between elements
        eSetH = maxH; //Takes height as the largest height

        for (var j:int = 0; j<tCount; j++)
        {
            var layoutElement2:ILayoutElement = useVirtualLayout ? target.getVirtualElementAt(j):target.getElementAt(j);

            var eRow:int = Math.floor(j/tRows); //Row of given element, taking the 1st to be zero
            var eCol:int = j - eRow*tRows; // Column of given element, again taking the 1st column as zero

            var _x:Number = 5 + eRow*(eSetW+5);
            var _y:Number = 5 + eCol*(eSetH+5);

            layoutElement2.setLayoutBoundsPosition(_x,_y);
            layoutElement2.setLayoutBoundsSize(eSetW,eSetH);
        }           
    }
}
}

Any thoughts would be much appreciated.

Criticism more than welcome.

Turns out that it's not. The layout class itself is fine, as far as calculating element positions and size is concerned.

It is actually a problem in the way in which the buttons used calculated their prefered widths. Whilst I'm not versed in the actual manner in which this happens, it was solved by removing %width values for any height and width values for graphic elements within the button skins. (Eg changing width="100%" to left="0" right="0").

I hope this might help someone, somewhere, sometime.