MultiLineBox

minimalcomps extends

by gggiyeok 28 Dec 2010

Embed

/**
 * Copyright gggiyeok ( http://wonderfl.net/user/gggiyeok )
 * MIT License ( http://www.opensource.org/licenses/mit-license.php )
 * Downloaded from: http://wonderfl.net/c/dEPE
 */

package {
    import flash.display.Sprite;
    import com.bit101.components.*;
    public class FlashTest extends Sprite {
        public function FlashTest() {
            // write as3 code here..
            var mbox:MultiLineBox = new MultiLineBox(this);
            mbox.setSize(500, 200);
            for(var i:int = 0; i < 100; i++){
                var box:PushButton = new PushButton(this);
                box.setSize(40*(Math.random()+.5), 40* (Math.random()+.5));
                mbox.addChild(box);
            }
        }
    }
}
import com.bit101.components.Component;
    import com.bit101.components.Style;
    import flash.display.DisplayObject;
    import flash.display.Sprite;
    import flash.display.DisplayObjectContainer;
    import flash.events.Event;
    
    /**
     * ...
        var mbox = new MultiLineBox(this);
        mbox.setSize(300, 200);
        for(var i = 0; i < 40; i++){
            var box = new Box();
            box.width *= (Math.random()+.5);
            box.height *= (Math.random()+.5);
            mbox.addChild(box);
        }
     */
     class MultiLineBox extends Component 
    {
        private var boxW:int;
        private var boxH:int;
        private var lineNum:int = 0;
        protected var _background:Sprite;
        protected var _spacing:Number = 5;
        public function MultiLineBox(parent:DisplayObjectContainer = null, xpos:Number = 0, ypos:Number =  0)
        {
            super(parent, xpos, ypos);
            _background = new Sprite();
        }
        /**
         * Draws the visual ui of the component, in this case, laying out the sub components.
         */
        override public function draw() : void
        {
            super.draw();
            _background.graphics.clear();
            _background.graphics.beginFill(Style.PANEL);
            _background.graphics.drawRect(0, 0, _width, _height);
            _background.graphics.endFill();
            
            drawBox();
        }
        /**
         * Creates and adds the child display objects of this component.
        
        override protected function addChildren():void
        {
            _background = new Sprite();
            addChild(_background);
        }
         */
        override public function addChild(child:DisplayObject) : DisplayObject
        {
            super.addChild(child);
            child.addEventListener(Event.RESIZE, onResize);
            draw();
            return child;
        }

        /**
         * Override of addChildAt to force layout;
         */

        override public function addChildAt(child:DisplayObject, index:int) : DisplayObject
        {
            super.addChildAt(child, index);
            child.addEventListener(Event.RESIZE, onResize);
            draw();
            return child;
        }

        /**
         * Override of removeChild to force layout;
         */
        override public function removeChild(child:DisplayObject):DisplayObject
        {
            super.removeChild(child);
            child.removeEventListener(Event.RESIZE, onResize);
            draw();
            return child;
        }

        /**
         * Override of removeChild to force layout;
         */
        override public function removeChildAt(index:int):DisplayObject
        {
            var child:DisplayObject = super.removeChildAt(index);
            child.removeEventListener(Event.RESIZE, onResize);
            draw();
            return child;
        }

        protected function onResize(event:Event):void
        {
            invalidate();
        }
        
        /**
         * Draws the visual ui of the component, in this case, laying out the sub components.
         */
        public function drawBox() : void
        {
            boxW = 0;
            boxH = 0;
            var xpos:Number = 0;
            var row:int = 0;
            lineNum = 1;
            for(var i:int = 0; i < numChildren; i++)
            {
                var child:DisplayObject = getChildAt(i);
                child.x = xpos;
                child.y = row;  
                xpos += child.width;
                xpos += _spacing;                
                if (xpos > _width) {
                    lineNum++;
                    row += boxH+_spacing;
                    child.x = 0;                                    
                    xpos = child.width + _spacing;
                    child.y = row;
                    boxH = 0;
                }
                boxH = Math.max(boxH, child.height);
            }
            //_width = boxW + _spacing * (numChildren - 1);
            _height = boxH + _spacing * (lineNum-1)
            dispatchEvent(new Event(Event.RESIZE));
        }
        
        /**
         * Gets / sets the spacing between each sub component.
         */
        public function set spacing(s:Number):void
        {
            _spacing = s;
            invalidate();
        }
        public function get spacing():Number
        {
            return _spacing;
        }
    }