Question

这是我尝试为一组按钮（可能有2到20个按钮）编写自己的布局类。基本上它们都应该是均匀的尺寸，间距恒定（5px）并适当调整大小。

然而，它并不总是有效。

有时它工作得非常好，但是其他的它为额外的列提供空间，或者无法在调整大小时添加额外的列（删除列很好），或者某些东西不起作用。它需要很长时间，并且在计算方面看起来非常昂贵。由于某些原因，在这方面减小宽度似乎更加痛苦。

无论如何，这是：

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);
        }           
    }
}
}

任何想法都会非常感激。

批评不止欢迎。

Answer 1

事实证明事实并非如此。就计算元素位置和大小而言，布局类本身很好。

实际上，使用按钮计算其首选宽度的方式存在问题。虽然我不熟悉发生这种情况的实际方式，但它通过删除按钮外观中图形元素的任何高度和宽度值的％宽度值来解决。（例如，将width =“100％”改为left =“0”right =“0”）。

我希望这可能会帮助某个人某个地方。

为什么这个布局类并不总是有效？

1 个答案: