http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/ButtonBarLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/ButtonBarLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/ButtonBarLayout.as index 5bd1159..24e3ef0 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/ButtonBarLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/ButtonBarLayout.as @@ -19,9 +19,9 @@ package org.apache.flex.html.beads.layouts { import org.apache.flex.core.IBeadLayout; - import org.apache.flex.core.IItemRendererClassFactory; - import org.apache.flex.core.IItemRendererParent; import org.apache.flex.core.ILayoutHost; + import org.apache.flex.core.ILayoutObject; + import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IParentIUIBase; import org.apache.flex.core.ISelectableItemRenderer; import org.apache.flex.core.ISelectionModel; @@ -34,6 +34,7 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.events.IEventDispatcher; import org.apache.flex.html.List; import org.apache.flex.html.beads.ButtonBarView; + import org.apache.flex.html.beads.models.ButtonBarModel; /** * The ButtonBarLayout class bead sizes and positions the org.apache.flex.html.Button @@ -75,6 +76,7 @@ package org.apache.flex.html.beads.layouts _strand = value; } + private var _widthType:Number = ButtonBarModel.PIXEL_WIDTHS; private var _buttonWidths:Array = null; /** @@ -100,17 +102,26 @@ package org.apache.flex.html.beads.layouts */ public function layout():Boolean { - var layoutParent:ILayoutHost = _strand.getBeadByType(ILayoutHost) as ILayoutHost; - var contentView:IParentIUIBase = layoutParent.contentView as IParentIUIBase; - var itemRendererParent:IItemRendererParent = contentView as IItemRendererParent; - var viewportModel:IViewportModel = (layoutParent as ButtonBarView).viewportModel; + var layoutHost:ILayoutHost = (_strand as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = layoutHost.contentView; + + var model:ButtonBarModel = _strand.getBeadByType(ButtonBarModel) as ButtonBarModel; + if (model) { + buttonWidths = model.buttonWidths; + _widthType = model.widthType; + } var n:int = contentView.numElements; var realN:int = n; + COMPILE::JS { + contentView.element.style["display"] = "flex"; + contentView.element.style["flex-flow"] = "row"; + } + for (var j:int=0; j < n; j++) { - var child:IUIBase = itemRendererParent.getElementAt(j) as IUIBase; + var child:IUIBase = contentView.getElementAt(j) as IUIBase; if (child == null || !child.visible) realN--; } @@ -120,17 +131,46 @@ package org.apache.flex.html.beads.layouts for (var i:int=0; i < n; i++) { - var ir:ISelectableItemRenderer = itemRendererParent.getElementAt(i) as ISelectableItemRenderer; + var ir:ISelectableItemRenderer = contentView.getElementAt(i) as ISelectableItemRenderer; if (ir == null || !UIBase(ir).visible) continue; - UIBase(ir).y = 0; - UIBase(ir).x = xpos; - if (!isNaN(useHeight) && useHeight > 0) { - UIBase(ir).height = useHeight; + COMPILE::SWF { + UIBase(ir).y = 0; + UIBase(ir).x = xpos; + + if (buttonWidths) { + var widthValue:* = buttonWidths[i]; + + if (_widthType == ButtonBarModel.PIXEL_WIDTHS) { + if (widthValue != null) UIBase(ir).width = Number(widthValue); + } + else if (_widthType == ButtonBarModel.PROPORTIONAL_WIDTHS) { + if (widthValue != null) UIBase(ir).width = useWidth; // - need to replicate this for SWF side element.style["flex-grow"] = String(widthValue); + } + else if (_widthType == ButtonBarModel.PERCENT_WIDTHS) { + if (widthValue != null) UIBase(ir).percentWidth = Number(widthValue); + } + } else { + UIBase(ir).width = useWidth; + } } - if (buttonWidths) UIBase(ir).width = Number(buttonWidths[i]); - else if (!isNaN(useWidth) && useWidth > 0) { - UIBase(ir).width = useWidth; + COMPILE::JS { + // otherwise let the flexbox layout handle matters on its own. + if (buttonWidths) { + var widthValue:* = buttonWidths[i]; + + if (_widthType == ButtonBarModel.PIXEL_WIDTHS) { + if (widthValue != null) UIBase(ir).width = Number(widthValue); + } + else if (_widthType == ButtonBarModel.PROPORTIONAL_WIDTHS) { + if (widthValue != null) UIBase(ir).element.style["flex-grow"] = String(widthValue); + } + else if (_widthType == ButtonBarModel.PERCENT_WIDTHS) { + if (widthValue != null) UIBase(ir).percentWidth = Number(widthValue); + } + } else { + UIBase(ir).width = useWidth; + } } xpos += UIBase(ir).width; }
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridLayout.as index a3bd4e8..cc37382 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridLayout.as @@ -23,6 +23,7 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.IBeadModel; import org.apache.flex.core.IBeadView; import org.apache.flex.core.IDataGridModel; + import org.apache.flex.core.ILayoutHost; import org.apache.flex.core.IStrand; import org.apache.flex.core.IUIBase; import org.apache.flex.core.UIBase; @@ -31,6 +32,7 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.html.ButtonBar; import org.apache.flex.html.beads.DataGridView; import org.apache.flex.html.beads.layouts.BasicLayout; + import org.apache.flex.html.beads.models.ButtonBarModel; import org.apache.flex.html.supportClasses.DataGridColumnList; import org.apache.flex.html.supportClasses.DataGridColumn; @@ -143,6 +145,7 @@ package org.apache.flex.html.beads.layouts /** * @copy org.apache.flex.core.IBeadLayout#layout */ + COMPILE::SWF public function layout():Boolean { if (columns == null || columns.length == 0) { @@ -157,8 +160,6 @@ package org.apache.flex.html.beads.layouts useHeight = host.height - _header.height; } - var thisisnothing:Number = -1234; - _listArea.x = 0; _listArea.y = 26; _listArea.width = useWidth; @@ -187,8 +188,8 @@ package org.apache.flex.html.beads.layouts } var bar:ButtonBar = header as ButtonBar; - var barLayout:ButtonBarLayout = bar.getBeadByType(ButtonBarLayout) as ButtonBarLayout; - barLayout.buttonWidths = buttonWidths; + bar.buttonWidths = buttonWidths; + bar.widthType = ButtonBarModel.PIXEL_WIDTHS; bar.dispatchEvent(new Event("layoutNeeded")); _header.x = 0; @@ -201,6 +202,60 @@ package org.apache.flex.html.beads.layouts } /** + * @copy org.apache.flex.core.IBeadLayout#layout + */ + COMPILE::JS + public function layout():Boolean + { + if (columns == null || columns.length == 0) { + return false; + } + var host:UIBase = _strand as UIBase; + + var sharedModel:IDataGridModel = host.model as IDataGridModel; + var buttonWidths:Array = []; + + if (_columns != null && _columns.length > 0) { + var listWidth:Number = host.width / _columns.length; + for (var i:int=0; i < _columns.length; i++) { + var list:DataGridColumnList = _columns[i] as DataGridColumnList; + list.element.style["position"] = null; + list.element.style["height"] = null; + + + var dataGridColumn:DataGridColumn = sharedModel.columns[i] as DataGridColumn; + var colWidth:Number = dataGridColumn.columnWidth; + if (!isNaN(colWidth)) list.width = colWidth; + else list.width = listWidth; + + buttonWidths.push(list.width); + } + } + + var bar:ButtonBar = header as ButtonBar; + bar.buttonWidths = buttonWidths; + bar.widthType = ButtonBarModel.PIXEL_WIDTHS; + bar.dispatchEvent(new Event("layoutNeeded")); + + host.element.style.display = "flex"; + host.element.style["flex-flow"] = "column"; + host.element.style["justify-content"] = "stretch"; + + _header.height = 25; + _header.percentWidth = 100; + + _listArea.element.style["flex-grow"] = "2"; + _listArea.element.style["position"] = null; + _listArea.element.style["height"] = null; + + var listView:ILayoutHost = UIBase(_listArea).view as ILayoutHost; + listView.contentView.element.style["display"] = "flex"; + listView.contentView.element.style["flex-flow"] = "row"; + + return true; + } + + /** * @private */ private function handleSizeChanges(event:Event):void http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridPercentageLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridPercentageLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridPercentageLayout.as index 7459a24..907cf9d 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridPercentageLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/DataGridPercentageLayout.as @@ -22,6 +22,7 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.IBeadLayout; import org.apache.flex.core.IBeadView; import org.apache.flex.core.IDataGridModel; + import org.apache.flex.core.ILayoutHost; import org.apache.flex.core.IStrand; import org.apache.flex.core.IUIBase; import org.apache.flex.core.UIBase; @@ -30,6 +31,8 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.html.ButtonBar; import org.apache.flex.html.beads.DataGridView; import org.apache.flex.html.beads.layouts.HorizontalLayout; + import org.apache.flex.html.beads.models.ButtonBarModel; + import org.apache.flex.html.supportClasses.DataGridColumnList; import org.apache.flex.html.supportClasses.DataGridColumn; /** @@ -82,14 +85,21 @@ package org.apache.flex.html.beads.layouts if (anylayout != null) { listArea.removeBead(anylayout); } - listArea.addBead(new HorizontalLayout()); + listArea.addBead(new BasicLayout()); host.addEventListener("widthChanged", handleSizeChanges); host.addEventListener("heightChanged", handleSizeChanges); host.addEventListener("sizeChanged", handleSizeChanges); host.addEventListener("layoutNeeded", handleSizeChanges); + + // listen for beadsAdded to signal that the strand is set with its size + // and beads. + host.addEventListener("beadsAdded", beadsAddedHandler); } + private var runNeeded:Boolean = false; + private var hostReady:Boolean = false; + private var _header:UIBase; /** @@ -139,71 +149,140 @@ package org.apache.flex.html.beads.layouts _listArea = value; } - /** - * @copy org.apache.flex.core.IBeadLayout#layout - */ + private function beadsAddedHandler(event:Event):void + { + var host:UIBase = _strand as UIBase; + + var useWidth:Number = host.width; + var useHeight:Number = host.height; + + hostReady = true; + if (runNeeded) { + runNeeded = false; + layout(); + } + } + + /** + * @copy org.apache.flex.core.IBeadLayout#layout + */ + COMPILE::SWF public function layout():Boolean { - if (columns == null || columns.length == 0) { + if (!hostReady) { + runNeeded = true; return false; } + if (columns == null || columns.length == 0) { + return false; + } var host:UIBase = _strand as UIBase; - var sw:Number = host.width; - var sh:Number = host.height; + var useWidth:Number = host.width; + var useHeight:Number = host.height; + + if (host.height > 0) { + useHeight = host.height - _header.height; + } - var columnHeight:Number = Math.floor(sh - header.height); - var columnWidth:Number = Math.floor(sw / columns.length); + _listArea.x = 0; + _listArea.y = 26; + _listArea.width = useWidth; + _listArea.height = useHeight; + + var sharedModel:IDataGridModel = host.model as IDataGridModel; + var buttonWidths:Array = []; + + if (_columns != null && _columns.length > 0) { + var xpos:Number = 0; + var listWidth:Number = host.width / _columns.length; + for (var i:int=0; i < _columns.length; i++) { + var list:DataGridColumnList = _columns[i] as DataGridColumnList; + list.x = xpos; + list.y = 0; + + var dataGridColumn:DataGridColumn = sharedModel.columns[i] as DataGridColumn; + var colWidth:Number = dataGridColumn.columnWidth; + if (!isNaN(colWidth)) { + list.percentWidth = colWidth; + colWidth = host.width * (colWidth/100.0); + } + else { + list.width = listWidth; + colWidth = listWidth; + } + + xpos += colWidth; + + buttonWidths.push(colWidth); + } + } - var xpos:Number = 0; - var ypos:Number = 26; + var bar:ButtonBar = header as ButtonBar; + bar.buttonWidths = buttonWidths; + bar.widthType = ButtonBarModel.PERCENT_WIDTHS; + bar.dispatchEvent(new Event("layoutNeeded")); _header.x = 0; _header.y = 0; - _header.width = sw; + _header.width = useWidth; _header.height = 25; + _header.dispatchEvent(new Event("layoutNeeded")); - if (sh > 0) { - sh = sh - _header.height; + return true; + } + + /** + * @copy org.apache.flex.core.IBeadLayout#layout + */ + COMPILE::JS + public function layout():Boolean + { + if (columns == null || columns.length == 0) { + return false; } + var host:UIBase = _strand as UIBase; + + var sharedModel:IDataGridModel = host.model as IDataGridModel; + var buttonWidths:Array = []; - // TODO: change the layout so that the model's DataGridColumn.columnWidth - // isn't used blindly, but is considered in the overall width. In other words, - // right now the width could exceed the strand's width. - var model:IDataGridModel = host.model as IDataGridModel; - - var buttonWidths:Array = new Array(); - - for(var i:int=0; i < columns.length; i++) { - var column:UIBase = columns[i] as UIBase; - column.percentHeight = 100; - - var dgc:DataGridColumn = model.columns[i]; - if (!isNaN(dgc.columnWidth)) { - column.percentWidth = dgc.columnWidth; - columnWidth = sw * (dgc.columnWidth/100.0); + if (_columns != null && _columns.length > 0) { + var listWidth:Number = host.width / _columns.length; + for (var i:int=0; i < _columns.length; i++) { + var list:DataGridColumnList = _columns[i] as DataGridColumnList; + list.element.style["position"] = null; + list.element.style["height"] = null; + + + var dataGridColumn:DataGridColumn = sharedModel.columns[i] as DataGridColumn; + var colWidth:Number = dataGridColumn.columnWidth; + if (!isNaN(colWidth)) list.percentWidth = colWidth; + else list.width = listWidth; + + buttonWidths.push(list.width); } - else column.explicitWidth = columnWidth; - - buttonWidths.push(columnWidth); } - _listArea.x = 0; - _listArea.y = 26; - _listArea.width = sw; - _listArea.height = sh; - _listArea.dispatchEvent(new Event("layoutNeeded")); - var bar:ButtonBar = header as ButtonBar; - var barLayout:ButtonBarLayout = bar.getBeadByType(ButtonBarLayout) as ButtonBarLayout; - barLayout.buttonWidths = buttonWidths; + bar.buttonWidths = buttonWidths; + bar.widthType = ButtonBarModel.PERCENT_WIDTHS; + bar.dispatchEvent(new Event("layoutNeeded")); + + host.element.style.display = "flex"; + host.element.style["flex-flow"] = "column"; + host.element.style["justify-content"] = "stretch"; - _header.x = 0; - _header.y = 0; - _header.width = sw; _header.height = 25; - _header.dispatchEvent(new Event("layoutNeeded")); + _header.percentWidth = 100; + + _listArea.element.style["flex-grow"] = "2"; + _listArea.element.style["position"] = null; + _listArea.element.style["height"] = null; + + var listView:ILayoutHost = UIBase(_listArea).view as ILayoutHost; + listView.contentView.element.style["display"] = "flex"; + listView.contentView.element.style["flex-flow"] = "row"; return true; } http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/FlexibleFirstChildHorizontalLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/FlexibleFirstChildHorizontalLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/FlexibleFirstChildHorizontalLayout.as index 13d4092..347c304 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/FlexibleFirstChildHorizontalLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/FlexibleFirstChildHorizontalLayout.as @@ -20,6 +20,7 @@ package org.apache.flex.html.beads.layouts { import org.apache.flex.core.IBeadLayout; import org.apache.flex.core.ILayoutChild; + import org.apache.flex.core.ILayoutObject; import org.apache.flex.core.ILayoutHost; import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IParentIUIBase; @@ -34,6 +35,7 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.geom.Rectangle; import org.apache.flex.html.supportClasses.Viewport; import org.apache.flex.utils.CSSContainerUtils; + import org.apache.flex.utils.CSSUtils; /** * The FlexibleFirstChildHorizontalLayout class is a simple layout @@ -129,117 +131,125 @@ package org.apache.flex.html.beads.layouts /** * @copy org.apache.flex.core.IBeadLayout#layout */ + COMPILE::SWF public function layout():Boolean - { - var layoutParent:ILayoutHost = (host as ILayoutParent).getLayoutHost(); - var contentView:IParentIUIBase = layoutParent.contentView as IParentIUIBase; - var padding:Rectangle = CSSContainerUtils.getPaddingMetrics(host); - var hostSizedToContent:Boolean = host.isHeightSizedToContent(); + { + var layoutHost:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = layoutHost.contentView; - var n:int = contentView.numElements; + var n:Number = contentView.numElements; + if (n == 0) return false; + + var maxWidth:Number = 0; + var maxHeight:Number = 0; + var hostSizedToContent:Boolean = host.isHeightSizedToContent(); + var hostWidth:Number = contentView.width; + var hostHeight:Number = hostSizedToContent ? 0 : contentView.height; + + var ilc:ILayoutChild; + var data:Object; + var canAdjust:Boolean = false; var marginLeft:Object; var marginRight:Object; var marginTop:Object; var marginBottom:Object; var margin:Object; - maxHeight = 0; - var verticalMargins:Array = []; - var xx:Number = contentView.width; - if (isNaN(xx) || xx <= 0) - return true; - xx -= padding.right + 1; // some browsers won't layout to the edge - - for (var i:int = n - 1; i >= 0; i--) + var paddingMetrics:Rectangle = CSSContainerUtils.getPaddingMetrics(host); + var borderMetrics:Rectangle = CSSContainerUtils.getBorderMetrics(host); + + var xpos:Number = hostWidth - borderMetrics.right - paddingMetrics.right; + var ypos:Number = borderMetrics.top + paddingMetrics.left; + var adjustedWidth:Number = 0; + + for(var i:int=(n-1); i >= 0; i--) { var child:IUIBase = contentView.getElementAt(i) as IUIBase; if (child == null || !child.visible) continue; + var top:Number = ValuesManager.valuesImpl.getValue(child, "top"); + var bottom:Number = ValuesManager.valuesImpl.getValue(child, "bottom"); margin = ValuesManager.valuesImpl.getValue(child, "margin"); - if (margin is Array) - { - if (margin.length == 1) - marginLeft = marginTop = marginRight = marginBottom = margin[0]; - else if (margin.length <= 3) - { - marginLeft = marginRight = margin[1]; - marginTop = marginBottom = margin[0]; - } - else if (margin.length == 4) - { - marginLeft = margin[3]; - marginBottom = margin[2]; - marginRight = margin[1]; - marginTop = margin[0]; - } - } - else if (margin == null) - { - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - } - else - { - marginLeft = marginTop = marginBottom = marginRight = margin; - } - var ml:Number; - var mr:Number; - var mt:Number; - var mb:Number; - var lastmr:Number; - mt = Number(marginTop); - if (isNaN(mt)) - mt = 0; - mb = Number(marginBottom); - if (isNaN(mb)) - mb = 0; + marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); + marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); + marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); + marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); + var ml:Number = CSSUtils.getLeftValue(marginLeft, margin, hostWidth); + var mr:Number = CSSUtils.getRightValue(marginRight, margin, hostWidth); + var mt:Number = CSSUtils.getTopValue(marginTop, margin, hostHeight); + var mb:Number = CSSUtils.getBottomValue(marginBottom, margin, hostHeight); if (marginLeft == "auto") ml = 0; - else - { - ml = Number(marginLeft); - if (isNaN(ml)) - ml = 0; - } if (marginRight == "auto") mr = 0; - else - { - mr = Number(marginRight); - if (isNaN(mr)) - mr = 0; + + ilc = child as ILayoutChild; + + var childYpos:Number = ypos + mt; // default y position + + if (!hostSizedToContent) { + var childHeight:Number = child.height; + if (ilc != null && !isNaN(ilc.percentHeight)) { + childHeight = (hostHeight-borderMetrics.top-borderMetrics.bottom-paddingMetrics.top-paddingMetrics.bottom) * ilc.percentHeight/100.0; + ilc.setHeight(childHeight); + } + // the following code middle-aligns the child + childYpos = hostHeight/2 - (childHeight + mt + mb)/2; + } + + if (ilc) { + if (!isNaN(ilc.percentWidth)) { + ilc.setWidth((contentView.width-borderMetrics.left-borderMetrics.right-paddingMetrics.left-paddingMetrics.right) * ilc.percentWidth / 100); + } } - child.y = mt + padding.top; - if (i == 0) - { - child.x = ml + padding.left; - child.width = xx - mr - child.x; - } - else - child.x = xx - child.width - mr; - maxHeight = Math.max(maxHeight, mt + child.height + mb); - xx -= child.width + mr + ml; - lastmr = mr; - var valign:Object = ValuesManager.valuesImpl.getValue(child, "vertical-align"); - verticalMargins.push({ marginTop: mt, marginBottom: mb, valign: valign }); + + if (i > 0) { + xpos -= child.width + mr; + adjustedWidth = child.width; + } else { + adjustedWidth = xpos - (borderMetrics.left + paddingMetrics.left + ml + mr); + xpos = borderMetrics.left + paddingMetrics.left + ml; + } + + if (ilc) { + ilc.setX(xpos); + ilc.setY(childYpos); + ilc.setWidth(adjustedWidth); + + } else { + child.x = xpos; + child.y = childYpos; + child.width = adjustedWidth; + } + + xpos -= ml; } - for (i = 0; i < n; i++) - { - var obj:Object = verticalMargins[0] - child = contentView.getElementAt(i) as IUIBase; - if (child == null || !child.visible) continue; - if (obj.valign == "middle") - child.y = (maxHeight - child.height) / 2; - else if (valign == "bottom") - child.y = maxHeight - child.height - obj.marginBottom; - else - child.y = obj.marginTop; + + host.dispatchEvent( new Event("layoutComplete") ); + + return true; + } + + COMPILE::JS + public function layout():Boolean + { + var viewBead:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = viewBead.contentView; + + // set the display on the contentView + contentView.element.style["display"] = "flex"; + contentView.element.style["flex-flow"] = "row"; + contentView.element.style["align-items"] = "center"; + + var n:int = contentView.numElements; + if (n == 0) return false; + + for(var i:int=0; i < n; i++) { + var child:UIBase = contentView.getElementAt(i) as UIBase; + child.element.style["flex-grow"] = (i == 0) ? "1" : "0"; + child.element.style["flex-shrink"] = "0"; } - if (hostSizedToContent) - ILayoutChild(contentView).setHeight(maxHeight + padding.top + padding.bottom, true); - return true; + return true; } } http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlexLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlexLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlexLayout.as index 1ca2e52..03a34a7 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlexLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlexLayout.as @@ -22,13 +22,14 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.ILayoutChild; import org.apache.flex.core.ILayoutHost; + import org.apache.flex.core.ILayoutObject; import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IStrand; + import org.apache.flex.core.IParentIUIBase; + import org.apache.flex.core.UIBase; COMPILE::SWF { - import org.apache.flex.core.UIBase; import org.apache.flex.core.IUIBase; - import org.apache.flex.core.IParentIUIBase; import org.apache.flex.core.ValuesManager; import org.apache.flex.events.Event; import org.apache.flex.events.IEventDispatcher; @@ -39,6 +40,14 @@ package org.apache.flex.html.beads.layouts public class HorizontalFlexLayout extends HorizontalLayout { + /** + * Constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.8 + */ public function HorizontalFlexLayout() { super(); @@ -55,27 +64,71 @@ package org.apache.flex.html.beads.layouts host = value as ILayoutChild; } + private var _grow:Number = -1; + + /** + * Sets the amount items grow in proportion to other items. + * The default is 0 which prevents the items from expanding to + * fit the space. Use a negative value to unset this property. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.8 + */ + public function get grow():Number { + return _grow; + } + public function set grow(value:Number):void { + _grow = value; + } + + private var _shrink:Number = -1; + + /** + * Sets the amount an item may shrink in proportion to other items. + * The default is 1 which allows items to shrink to fit into the space. + * Set this to 0 if you want to allow scrolling of the space. Use a + * negative value to unset this property. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.8 + */ + public function get shrink():Number { + return _shrink; + } + public function set shrink(value:Number):void { + _shrink = value; + } + /** * @copy org.apache.flex.core.IBeadLayout#layout * @flexjsignorecoercion org.apache.flex.core.ILayoutHost + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.8 */ override public function layout():Boolean { COMPILE::SWF { //return super.layout(); // this is where the layout is calculated - var layoutParent:ILayoutHost = (host as ILayoutParent).getLayoutHost(); - var contentView:IParentIUIBase = layoutParent.contentView; + var layoutHost:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = layoutHost.contentView; var n:Number = contentView.numElements; if (n == 0) return false; - - trace("HorizontalFlexLayout: contentView size: "+contentView.width+" x "+contentView.height+"; explicit: "+UIBase(contentView).explicitWidth+" x "+UIBase(contentView).explicitHeight); - + var spacing:String = "none"; var maxWidth:Number = 0; var maxHeight:Number = 0; + var growCount:Number = 0; + var remainingWidth:Number = contentView.width; var childData:Array = []; var ilc:ILayoutChild; @@ -98,11 +151,12 @@ package org.apache.flex.html.beads.layouts ilc = child as ILayoutChild; - var useWidth:Number = -1; - if (ilc) { - if (!isNaN(ilc.explicitWidth)) useWidth = ilc.explicitWidth; - else if (!isNaN(ilc.percentWidth)) useWidth = contentView.width * (ilc.percentWidth/100.0); - else canAdjust = true; + var flexGrow:Object = ValuesManager.valuesImpl.getValue(child, "flex-grow"); + var growValue:Number = -1; + if (flexGrow != null) { + growValue = Number(flexGrow); + if (!isNaN(growValue) && growValue > 0) growCount++; + else growValue = 0; } var useHeight:Number = -1; @@ -111,6 +165,14 @@ package org.apache.flex.html.beads.layouts else if (!isNaN(ilc.percentHeight)) useHeight = contentView.height * (ilc.percentHeight/100.0); else useHeight = contentView.height; } + if (useHeight > contentView.height) useHeight = contentView.height; + + var useWidth:Number = -1; + if (ilc) { + if (!isNaN(ilc.explicitWidth)) useWidth = ilc.explicitWidth; + else if (!isNaN(ilc.percentWidth)) useWidth = contentView.width * (ilc.percentWidth/100.0); + else useWidth = ilc.width; + } margin = ValuesManager.valuesImpl.getValue(child, "margin"); marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); @@ -129,7 +191,7 @@ package org.apache.flex.html.beads.layouts if (maxWidth < useWidth) maxWidth = useWidth; if (maxHeight < useHeight) maxHeight = useHeight; - childData.push({width:useWidth, height:useHeight, mt:mt, ml:ml, mr:mr, mb:mb, canAdjust:canAdjust}); + childData.push({width:useWidth, height:useHeight, mt:mt, ml:ml, mr:mr, mb:mb, grow:growValue, canAdjust:canAdjust}); } var xpos:Number = 0; @@ -142,15 +204,23 @@ package org.apache.flex.html.beads.layouts data = childData[i]; if (data.width == 0 || data.height == 0) continue; - useWidth = (data.width < 0 ? maxWidth : data.width); useHeight = (data.height < 0 ? maxHeight : data.height); + if (data.width > 0) { + if (data.grow > 0 && growCount > 0) { + useWidth = remainingWidth / growCount; + } else { + useWidth = data.width; + } + } else { + useWidth = child.width; + } ilc = child as ILayoutChild; if (ilc) { ilc.setX(xpos + data.ml); ilc.setY(ypos + data.mt); ilc.setHeight(useHeight - data.mt - data.mb); - if (data.width > 0) { + if (useWidth > 0) { ilc.setWidth(useWidth - data.ml - data.mr); } } else { @@ -162,7 +232,7 @@ package org.apache.flex.html.beads.layouts } } - xpos += child.width + data.ml + data.mr; + xpos += useWidth + data.ml + data.mr; trace("HorizontalFlexLayout: setting child "+i+" to "+child.width+" x "+child.height+" at "+child.x+", "+child.y); } @@ -176,11 +246,20 @@ package org.apache.flex.html.beads.layouts COMPILE::JS { var viewBead:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = viewBead.contentView; // set the display on the contentView - viewBead.contentView.width = host.width; - viewBead.contentView.element.style["display"] = "flex"; - viewBead.contentView.element.style["flex-flow"] = "row"; + contentView.element.style["display"] = "flex"; + contentView.element.style["flex-flow"] = "row"; + + var n:int = contentView.numElements; + if (n == 0) return false; + + for(var i:int=0; i < n; i++) { + var child:UIBase = contentView.getElementAt(i) as UIBase; + if (grow >= 0) child.element.style["flex-grow"] = String(grow); + if (shrink >= 0) child.element.style["flex-shrink"] = String(shrink); + } return true; } http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlowLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlowLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlowLayout.as index 8f3561a..066bc8b 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlowLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlowLayout.as @@ -21,6 +21,7 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.IBeadLayout; import org.apache.flex.core.ILayoutHost; import org.apache.flex.core.ILayoutParent; + import org.apache.flex.core.ILayoutObject; import org.apache.flex.core.IParentIUIBase; import org.apache.flex.core.IStrand; import org.apache.flex.core.IUIBase; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalLayout.as index 4230c5e..ec96c20 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalLayout.as @@ -22,6 +22,7 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.IBeadModel; import org.apache.flex.core.ILayoutChild; import org.apache.flex.core.ILayoutHost; + import org.apache.flex.core.ILayoutObject; import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IParentIUIBase; import org.apache.flex.core.IStrand; @@ -32,8 +33,10 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.geom.Rectangle; import org.apache.flex.utils.CSSContainerUtils; import org.apache.flex.utils.CSSUtils; - COMPILE::JS - { + COMPILE::SWF { + import org.apache.flex.core.UIBase; + } + COMPILE::JS { import org.apache.flex.core.WrappedHTMLElement; } @@ -98,117 +101,92 @@ package org.apache.flex.html.beads.layouts { COMPILE::SWF { - //trace(DOMPathUtil.getPath(host), event ? event.type : "fixed size"); - var layoutParent:ILayoutHost = (host as ILayoutParent).getLayoutHost(); //host.getBeadByType(ILayoutHost) as ILayoutHost; - var contentView:IParentIUIBase = layoutParent.contentView; - var padding:Rectangle = CSSContainerUtils.getPaddingMetrics(host); - - var n:int = contentView.numElements; - var hostSizedToContent:Boolean = host.isHeightSizedToContent(); - var ilc:ILayoutChild; - var marginLeft:Object; - var marginRight:Object; - var marginTop:Object; - var marginBottom:Object; - var margin:Object; - var maxHeight:Number = 0; - // asking for contentView.height can result in infinite loop if host isn't sized already - var h:Number = hostSizedToContent ? 0 : contentView.height; - var w:Number = contentView.width; - var verticalMargins:Array = []; - - for (var i:int = 0; i < n; i++) - { - var child:IUIBase = contentView.getElementAt(i) as IUIBase; - if (child == null || !child.visible) continue; - var top:Number = ValuesManager.valuesImpl.getValue(child, "top"); - var bottom:Number = ValuesManager.valuesImpl.getValue(child, "bottom"); - margin = ValuesManager.valuesImpl.getValue(child, "margin"); - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - var ml:Number = CSSUtils.getLeftValue(marginLeft, margin, w); - var mr:Number = CSSUtils.getRightValue(marginRight, margin, w); - var mt:Number = CSSUtils.getTopValue(marginTop, margin, h); - var mb:Number = CSSUtils.getBottomValue(marginBottom, margin, h); - - ilc = child as ILayoutChild; - var lastmr:Number; - if (marginLeft == "auto") - ml = 0; - if (marginRight == "auto") - mr = 0; - var xx:Number; - if (i == 0) - { - if (ilc) - ilc.setX(ml + padding.left); - else - child.x = ml + padding.left; - } - else - { - if (ilc) - ilc.setX(xx + ml + lastmr); - else - child.x = xx + ml + lastmr; - } - if (ilc) - { - if (!isNaN(ilc.percentWidth)) - ilc.setWidth(contentView.width * ilc.percentWidth / 100, !isNaN(ilc.percentHeight)); - } - lastmr = mr; - var marginObject:Object = {}; - verticalMargins[i] = marginObject; - var valign:* = ValuesManager.valuesImpl.getValue(child, "vertical-align"); - marginObject.valign = valign; - if (!hostSizedToContent) - { - // if host is sized by parent, - // we can position and size children horizontally now - setPositionAndHeight(child, top, mt, padding.top, bottom, mb, padding.bottom, h, valign); - maxHeight = Math.max(maxHeight, mt + child.height + mb); - } - else - { - if (!isNaN(top)) - { - mt = top; - marginObject.top = mt; - } - if (!isNaN(bottom)) - { - mb = bottom; - marginObject.bottom = mb; - } - maxHeight = Math.max(maxHeight, mt + child.height + mb); - } - xx = child.x + child.width; - } - if (hostSizedToContent) - { - ILayoutChild(contentView).setHeight(maxHeight, true); - if (host.isWidthSizedToContent()) - ILayoutChild(contentView).setWidth(xx, true); - for (i = 0; i < n; i++) - { - child = contentView.getElementAt(i) as IUIBase; - if (child == null || !child.visible) continue; - var obj:Object = verticalMargins[i]; - setPositionAndHeight(child, obj.top, obj.marginTop, padding.top, - obj.bottom, obj.marginBottom, padding.bottom, maxHeight, obj.valign); - } - } - - // Only return true if the contentView needs to be larger; that new - // size is stored in the model. - var sizeChanged:Boolean = true; - - host.dispatchEvent( new Event("layoutComplete") ); - - return sizeChanged; + var layoutHost:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = layoutHost.contentView; + + var n:Number = contentView.numElements; + if (n == 0) return false; + + var maxWidth:Number = 0; + var maxHeight:Number = 0; + var hostSizedToContent:Boolean = host.isHeightSizedToContent(); + var hostWidth:Number = contentView.width; + var hostHeight:Number = hostSizedToContent ? 0 : contentView.height; + + var ilc:ILayoutChild; + var data:Object; + var canAdjust:Boolean = false; + var marginLeft:Object; + var marginRight:Object; + var marginTop:Object; + var marginBottom:Object; + var margin:Object; + + var paddingMetrics:Rectangle = CSSContainerUtils.getPaddingMetrics(host); + var borderMetrics:Rectangle = CSSContainerUtils.getBorderMetrics(host); + + var xpos:Number = borderMetrics.left + paddingMetrics.left; + var ypos:Number = borderMetrics.top + paddingMetrics.left; + + // First pass determines the data about the child. + for(var i:int=0; i < n; i++) + { + var child:IUIBase = contentView.getElementAt(i) as IUIBase; + if (child == null || !child.visible) continue; + var top:Number = ValuesManager.valuesImpl.getValue(child, "top"); + var bottom:Number = ValuesManager.valuesImpl.getValue(child, "bottom"); + margin = ValuesManager.valuesImpl.getValue(child, "margin"); + marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); + marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); + marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); + marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); + var ml:Number = CSSUtils.getLeftValue(marginLeft, margin, hostWidth); + var mr:Number = CSSUtils.getRightValue(marginRight, margin, hostWidth); + var mt:Number = CSSUtils.getTopValue(marginTop, margin, hostHeight); + var mb:Number = CSSUtils.getBottomValue(marginBottom, margin, hostHeight); + if (marginLeft == "auto") + ml = 0; + if (marginRight == "auto") + mr = 0; + + ilc = child as ILayoutChild; + + xpos += ml; + + var childYpos:Number = ypos + mt; // default y position + + if (!hostSizedToContent) { + var childHeight:Number = child.height; + if (ilc != null && !isNaN(ilc.percentHeight)) { + childHeight = (hostHeight-borderMetrics.top-borderMetrics.bottom-paddingMetrics.top-paddingMetrics.bottom) * ilc.percentHeight/100.0; + ilc.setHeight(childHeight - mt - mb); + } + // the following code middle-aligns the child, but since HTML does not + // do this normally, this code is commented. (Use HorizontalFlexLayout for + // vertically centered elements in a horizontal row). +// childYpos = hostHeight/2 - (childHeight + mt + mb)/2; + } + + if (ilc) { + ilc.setX(xpos); + ilc.setY(childYpos); + + if (!isNaN(ilc.percentWidth)) { + var newWidth:Number = (contentView.width-borderMetrics.left-borderMetrics.right-paddingMetrics.left-paddingMetrics.right) * ilc.percentWidth / 100; + ilc.setWidth(newWidth - mr - ml); + } + + } else { + child.x = xpos; + child.y = childYpos; + } + + xpos += child.width + mr; + } + + host.dispatchEvent( new Event("layoutComplete") ); + + return true; } COMPILE::JS @@ -218,116 +196,27 @@ package org.apache.flex.html.beads.layouts var n:int; var viewBead:ILayoutHost = (host as ILayoutParent).getLayoutHost(); - var contentView:IParentIUIBase = viewBead.contentView; + var contentView:IParentIUIBase = viewBead.contentView as IParentIUIBase; + + contentView.element.style["white-space"] = "nowrap"; + children = contentView.internalChildren(); - var hasHeight:Boolean = !host.isHeightSizedToContent(); - var hasWidth:Boolean = !host.isWidthSizedToContent(); - var maxHeight:Number = 0; - var computedWidth:Number = 0; + + n = children.length; for (i = 0; i < n; i++) { var child:WrappedHTMLElement = children[i] as WrappedHTMLElement; if (child == null) continue; - child.flexjs_wrapper.internalDisplay = 'inline-block'; - if (child.style.display == 'none') - child.flexjs_wrapper.setDisplayStyleForLayout('inline-block'); - else - child.style.display = 'inline-block'; - maxHeight = Math.max(maxHeight, child.offsetHeight); - if (!hasWidth) { - var cv:Object = getComputedStyle(child); - var mls:String = cv['margin-left']; - var ml:Number = Number(mls.substring(0, mls.length - 2)); - var mrs:String = cv['margin-right']; - var mr:Number = Number(mrs.substring(0, mrs.length - 2)); - computedWidth += ml + child.offsetWidth + mr; - } - child.flexjs_wrapper.dispatchEvent('sizeChanged'); - } - // if there are children and maxHeight is ok, use it. - // maxHeight can be NaN if the child hasn't been rendered yet. - if (!hasHeight && n > 0 && !isNaN(maxHeight)) { - contentView.height = maxHeight; - } - if (!hasWidth && n > 0 && !isNaN(computedWidth)) { - contentView.width = computedWidth + 1; // some browser need one more pixel - } + child.flexjs_wrapper.setDisplayStyleForLayout('inline-block'); + if (child.style.display !== 'none') + { + child.style.display = 'inline-block'; + } + } host.dispatchEvent( new Event("layoutComplete") ); return true; } } - - COMPILE::SWF - private function setPositionAndHeight(child:IUIBase, top:Number, mt:Number, pt:Number, - bottom:Number, mb:Number, pb:Number, h:Number, - valign:*):void - { - var heightSet:Boolean = false; - - var hh:Number = h; - var ilc:ILayoutChild = child as ILayoutChild; - if (ilc) - { - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(h * ilc.percentHeight / 100, true); - } - if (valign == "top") - { - if (!isNaN(top)) - { - if (ilc) - ilc.setY(top + mt); - else - child.y = top + mt; - hh -= top + mt; - } - else - { - if (ilc) - ilc.setY(mt + pt); - else - child.y = mt + pt; - hh -= mt + pt; - } - if (ilc.isHeightSizedToContent()) - { - if (!isNaN(bottom)) - { - if (!isNaN(top)) - { - if (ilc) - ilc.setHeight(hh - bottom - mb, true); - else - { - child.height = hh - bottom - mb; - heightSet = true; - } - } - } - } - } - else if (valign == "bottom") - { - if (!isNaN(bottom)) - { - if (ilc) - ilc.setY(h - bottom - mb - child.height); - else - child.y = h - bottom - mb - child.height; - } - else - { - if (ilc) - ilc.setY(h - mb - child.height); - else - child.y = h - mb - child.height; - } - } - else - child.y = (h - child.height) / 2; - if (!heightSet) - child.dispatchEvent(new Event("sizeChanged")); - } } } http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildHorizontalLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildHorizontalLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildHorizontalLayout.as index ff09b9c..2f88b01 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildHorizontalLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildHorizontalLayout.as @@ -21,11 +21,13 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.IDocument; import org.apache.flex.core.ILayoutChild; import org.apache.flex.core.ILayoutHost; + import org.apache.flex.core.ILayoutObject; import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IParentIUIBase; import org.apache.flex.core.IStrand; import org.apache.flex.core.IUIBase; import org.apache.flex.core.ValuesManager; + import org.apache.flex.core.UIBase; import org.apache.flex.events.Event; import org.apache.flex.geom.Rectangle; import org.apache.flex.utils.CSSContainerUtils; @@ -157,185 +159,202 @@ package org.apache.flex.html.beads.layouts /** * @copy org.apache.flex.core.IBeadLayout#layout */ + COMPILE::JS public function layout():Boolean { - var layoutParent:ILayoutHost = (host as ILayoutParent).getLayoutHost(); //host.getBeadByType(ILayoutHost) as ILayoutHost; - var contentView:IParentIUIBase = layoutParent ? layoutParent.contentView : IParentIUIBase(host); - var padding:Rectangle = CSSContainerUtils.getPaddingMetrics(host); - actualChild = document[flexibleChild]; - - var ilc:ILayoutChild; + var viewBead:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = viewBead.contentView; + + actualChild = document[flexibleChild]; + + // set the display on the contentView + contentView.element.style["display"] = "flex"; + contentView.element.style["flex-flow"] = "row"; + contentView.element.style["align-items"] = "center"; + var n:int = contentView.numElements; + if (n == 0) return false; + + for(var i:int=0; i < n; i++) { + var child:UIBase = contentView.getElementAt(i) as UIBase; + child.element.style["flex-grow"] = (child == actualChild) ? "1" : "0"; + child.element.style["flex-shrink"] = "0"; + } + + return true; + } + + COMPILE::SWF + protected function childMargins(child:Object, hostWidth:Number, hostHeight:Number):Object + { + var margin:Object = ValuesManager.valuesImpl.getValue(child, "margin"); + var marginLeft:Object = ValuesManager.valuesImpl.getValue(child, "margin-left"); + var marginTop:Object = ValuesManager.valuesImpl.getValue(child, "margin-top"); + var marginRight:Object = ValuesManager.valuesImpl.getValue(child, "margin-right"); + var marginBottom:Object = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); + var ml:Number = CSSUtils.getLeftValue(marginLeft, margin, hostWidth); + var mr:Number = CSSUtils.getRightValue(marginRight, margin, hostWidth); + var mt:Number = CSSUtils.getTopValue(marginTop, margin, hostHeight); + var mb:Number = CSSUtils.getBottomValue(marginBottom, margin, hostHeight); + if (marginLeft == "auto") + ml = 0; + if (marginRight == "auto") + mr = 0; + + return {left:ml, top:mt, right:mr, bottom:mb}; + } + + COMPILE::SWF + public function layout():Boolean + { + var layoutHost:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = layoutHost.contentView; + var actualChild:IUIBase = document.hasOwnProperty(flexibleChild) ? document[flexibleChild] : null; + + var n:Number = contentView.numElements; + if (n == 0) return false; + + var maxWidth:Number = 0; + var maxHeight:Number = 0; + var hostSizedToContent:Boolean = host.isHeightSizedToContent(); + var hostWidth:Number = contentView.width; + var hostHeight:Number = hostSizedToContent ? 0 : contentView.height; + + var ilc:ILayoutChild; + var data:Object; + var canAdjust:Boolean = false; var marginLeft:Object; var marginRight:Object; var marginTop:Object; var marginBottom:Object; var margin:Object; - maxHeight = 0; - var verticalMargins:Array = new Array(n); + var ml:Number; + var mr:Number; + var mt:Number; + var mb:Number; + var margins:Object; - var ww:Number = contentView.width - padding.right; - var hh:Number = contentView.height; - var xx:int = padding.left; - var flexChildIndex:int; - var ml:Number; - var mr:Number; - var mt:Number; - var mb:Number; - var lastmr:Number; - var lastml:Number; - var valign:Object; - var hostSizedToContent:Boolean = host.isHeightSizedToContent(); - - for (var i:int = 0; i < n; i++) - { - var child:IUIBase = contentView.getElementAt(i) as IUIBase; + var paddingMetrics:Rectangle = CSSContainerUtils.getPaddingMetrics(host); + var borderMetrics:Rectangle = CSSContainerUtils.getBorderMetrics(host); + + var xpos:Number = borderMetrics.left - paddingMetrics.left; + var ypos:Number = borderMetrics.top + paddingMetrics.left; + var child:IUIBase; + var childHeight:Number; + var i:int; + var childYpos:Number; + var adjustLeft:Number = 0; + var adjustRight:Number = hostWidth - borderMetrics.right - paddingMetrics.right; + + // first work from left to right + for(i=0; i < n; i++) + { + child = contentView.getElementAt(i) as IUIBase; if (child == null || !child.visible) continue; - if (child == actualChild) - { - flexChildIndex = i; - break; - } - margin = ValuesManager.valuesImpl.getValue(child, "margin"); - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - mt = CSSUtils.getTopValue(marginTop, margin, hh); - mb = CSSUtils.getBottomValue(marginBottom, margin, hh); - mr = CSSUtils.getRightValue(marginRight, margin, ww); - ml = CSSUtils.getLeftValue(marginLeft, margin, ww); - child.y = mt + padding.top; - if (child is ILayoutChild) - { - ilc = child as ILayoutChild; - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(contentView.height * ilc.percentHeight / 100, true); - } - maxHeight = Math.max(maxHeight, mt + child.height + mb); - child.x = xx + ml; - xx += child.width + ml + mr; - lastmr = mr; - valign = ValuesManager.valuesImpl.getValue(child, "vertical-align"); - verticalMargins[i] = { marginTop: mt, marginBottom: mb, valign: valign }; - } - - if (n > 0 && n > flexChildIndex) - { - for (i = n - 1; i > flexChildIndex; i--) - { - child = contentView.getElementAt(i) as IUIBase; - if (child == null || !child.visible) continue; - margin = ValuesManager.valuesImpl.getValue(child, "margin"); - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - mt = CSSUtils.getTopValue(marginTop, margin, hh); - mb = CSSUtils.getTopValue(marginBottom, margin, hh); - mr = CSSUtils.getRightValue(marginRight, margin, ww); - ml = CSSUtils.getLeftValue(marginLeft, margin, ww); - child.y = mt + padding.top; - if (child is ILayoutChild) - { - ilc = child as ILayoutChild; - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(contentView.height * ilc.percentHeight / 100, true); - } - maxHeight = Math.max(maxHeight, mt + child.height + mb); - child.x = ww - child.width - mr; - ww -= child.width + ml + mr; - lastml = ml; - valign = ValuesManager.valuesImpl.getValue(child, "vertical-align"); - verticalMargins[i] = { marginTop: mt, marginBottom: mb, valign: valign }; - } - - child = contentView.getElementAt(flexChildIndex) as IUIBase; - margin = ValuesManager.valuesImpl.getValue(child, "margin"); - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - mt = CSSUtils.getTopValue(marginTop, margin, hh); - mb = CSSUtils.getTopValue(marginBottom, margin, hh); - mr = CSSUtils.getRightValue(marginRight, margin, ww); - ml = CSSUtils.getLeftValue(marginLeft, margin, ww); - if (child is ILayoutChild) - { - ilc = child as ILayoutChild; - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(contentView.height * ilc.percentHeight / 100, true); - } - child.x = xx + ml; - child.width = ww - child.x; - maxHeight = Math.max(maxHeight, mt + child.height + mb); - valign = ValuesManager.valuesImpl.getValue(child, "vertical-align"); - verticalMargins[flexChildIndex] = { marginTop: mt, marginBottom: mb, valign: valign }; - } - if (hostSizedToContent) - ILayoutChild(contentView).setHeight(maxHeight + padding.top + padding.bottom, true); - - for (i = 0; i < n; i++) + if (child == actualChild) break; + + margins = childMargins(child, hostWidth, hostHeight); + ilc = child as ILayoutChild; + + xpos += margins.left; + + childYpos = ypos + margins.top; // default y position + + if (!hostSizedToContent) { + childHeight = child.height; + if (ilc != null && !isNaN(ilc.percentHeight)) { + childHeight = (hostHeight-borderMetrics.top-borderMetrics.bottom-paddingMetrics.top-paddingMetrics.bottom) * ilc.percentHeight/100.0; + ilc.setHeight(childHeight); + } + // the following code middle-aligns the child + childYpos = hostHeight/2 - (childHeight + margins.top + margins.bottom)/2; + } + + if (ilc) { + ilc.setX(xpos); + ilc.setY(childYpos); + + if (!isNaN(ilc.percentWidth)) { + ilc.setWidth((contentView.width-borderMetrics.left-borderMetrics.right-paddingMetrics.left-paddingMetrics.right) * ilc.percentWidth / 100); + } + + } else { + child.x = xpos; + child.y = childYpos; + } + + xpos += child.width + margins.right; + adjustLeft = xpos; + } + + // then work from right to left + xpos = hostWidth - borderMetrics.right - paddingMetrics.right; + + for(i=(n-1); actualChild != null && i >= 0; i--) { - var obj:Object = verticalMargins[i] child = contentView.getElementAt(i) as IUIBase; if (child == null || !child.visible) continue; - setPositionAndHeight(child, obj.top, obj.marginTop, padding.top, - obj.bottom, obj.marginBottom, padding.bottom, maxHeight, obj.valign); + if (child == actualChild) break; + + margins = childMargins(child, hostWidth, hostHeight); + ilc = child as ILayoutChild; + + childYpos = ypos + margins.top; // default y position + + if (!hostSizedToContent) { + childHeight = child.height; + if (ilc != null && !isNaN(ilc.percentHeight)) { + childHeight = (hostHeight-borderMetrics.top-borderMetrics.bottom-paddingMetrics.top-paddingMetrics.bottom) * ilc.percentHeight/100.0; + ilc.setHeight(childHeight); + } + // the following code middle-aligns the child + childYpos = hostHeight/2 - (childHeight + margins.top + margins.bottom)/2; + } + + if (ilc) { + if (!isNaN(ilc.percentWidth)) { + ilc.setWidth((contentView.width-borderMetrics.left-borderMetrics.right-paddingMetrics.left-paddingMetrics.right) * ilc.percentWidth / 100); + } + } + + xpos -= child.width + margins.right; + + if (ilc) { + ilc.setX(xpos); + ilc.setY(childYpos); + } else { + child.x = xpos; + child.y = childYpos; + } + + xpos -= margins.left; + adjustRight = xpos; + } + + // now adjust the actualChild to fill the space. + if (actualChild != null) { + margins = childMargins(actualChild, hostWidth, hostHeight); + ilc = actualChild as ILayoutChild; + if (!hostSizedToContent) { + childHeight = actualChild.height; + if (ilc != null && !isNaN(ilc.percentHeight)) { + childHeight = (hostHeight-borderMetrics.top-borderMetrics.bottom-paddingMetrics.top-paddingMetrics.bottom) * ilc.percentHeight/100.0; + ilc.setHeight(childHeight); + } + } + actualChild.y = hostHeight/2 - (childHeight + margins.top + margins.bottom)/2; + actualChild.x = adjustLeft + margins.left; + if (ilc) { + ilc.setWidth((adjustRight-margins.right) - (adjustLeft+margins.left)); + } else { + actualChild.width = (adjustRight-margins.right) - (adjustLeft+margins.left); + } } + + host.dispatchEvent( new Event("layoutComplete") ); + return true; } - - private function setPositionAndHeight(child:IUIBase, top:Number, mt:Number, pt:Number, - bottom:Number, mb:Number, pb:Number, h:Number, valign:String):void - { - var heightSet:Boolean = false; // if we've set the height in a way that gens a change event - var ySet:Boolean = false; // if we've set the y yet. - - var hh:Number = h; - var ilc:ILayoutChild = child as ILayoutChild; - if (!isNaN(top)) - { - child.y = top + mt; - ySet = true; - hh -= top + mt; - } - else - { - hh -= mt; - } - if (!isNaN(bottom)) - { - if (!isNaN(top)) - { - if (ilc) - ilc.setHeight(hh - bottom - mb, true); - else - { - child.height = hh - bottom - mb; - heightSet = true; - } - } - else - { - child.y = h - bottom - mb - child.height - 1; // some browsers don't like going to the edge - ySet = true; - } - } - if (ilc) - { - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(h * ilc.percentHeight / 100, true); - } - if (valign == "middle") - child.y = (h - child.height) / 2; - else if (valign == "bottom") - child.y = h - child.height - mb; - else - child.y = mt + pt; - if (!heightSet) - child.dispatchEvent(new Event("sizeChanged")); - } public function setDocument(document:Object, id:String = null):void { http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/679eccb5/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as index a2ad24c..6099388 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as @@ -21,16 +21,18 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.IDocument; import org.apache.flex.core.ILayoutChild; import org.apache.flex.core.ILayoutHost; + import org.apache.flex.core.ILayoutObject; import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IParentIUIBase; import org.apache.flex.core.IStrand; import org.apache.flex.core.IStyleableObject; import org.apache.flex.core.IUIBase; - import org.apache.flex.core.UIBase; import org.apache.flex.core.ValuesManager; + import org.apache.flex.core.UIBase; import org.apache.flex.events.Event; import org.apache.flex.geom.Rectangle; import org.apache.flex.utils.CSSContainerUtils; + import org.apache.flex.utils.CSSUtils; /** * The OneFlexibleChildVerticalLayout class is a simple layout @@ -154,335 +156,206 @@ package org.apache.flex.html.beads.layouts { _maxHeight = value; } - - // TODO get rid of this - private function getActualChildById(contentView:IParentIUIBase, id:String):ILayoutChild + + COMPILE::SWF + protected function childMargins(child:Object, hostWidth:Number, hostHeight:Number):Object { - var result:ILayoutChild; - for (var i:int = 0; i < contentView.numElements; i++) - { - var child:IStyleableObject = contentView.getElementAt(i) as IStyleableObject; - if (child.id == id) - { - return child as ILayoutChild; - } - } - return null; + var margin:Object = ValuesManager.valuesImpl.getValue(child, "margin"); + var marginLeft:Object = ValuesManager.valuesImpl.getValue(child, "margin-left"); + var marginTop:Object = ValuesManager.valuesImpl.getValue(child, "margin-top"); + var marginRight:Object = ValuesManager.valuesImpl.getValue(child, "margin-right"); + var marginBottom:Object = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); + var ml:Number = CSSUtils.getLeftValue(marginLeft, margin, hostWidth); + var mr:Number = CSSUtils.getRightValue(marginRight, margin, hostWidth); + var mt:Number = CSSUtils.getTopValue(marginTop, margin, hostHeight); + var mb:Number = CSSUtils.getBottomValue(marginBottom, margin, hostHeight); + if (marginLeft == "auto") + ml = 0; + if (marginRight == "auto") + mr = 0; + + return {left:ml, top:mt, right:mr, bottom:mb}; } + /** * @copy org.apache.flex.core.IBeadLayout#layout */ + COMPILE::JS public function layout():Boolean { - var layoutParent:ILayoutHost = (host as ILayoutParent).getLayoutHost(); - var contentView:IParentIUIBase = layoutParent ? layoutParent.contentView : IParentIUIBase(host); - var padding:Rectangle = CSSContainerUtils.getPaddingMetrics(host); - if (document && document.hasOwnProperty(flexibleChild)) - { - actualChild = document[flexibleChild]; - } else - { - actualChild = getActualChildById(contentView, flexibleChild); - } - - var ilc:ILayoutChild; + var viewBead:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = viewBead.contentView; + + actualChild = document[flexibleChild]; + + // set the display on the contentView + contentView.element.style["display"] = "flex"; + contentView.element.style["flex-flow"] = "column"; + contentView.element.style["align-items"] = "center"; + var n:int = contentView.numElements; + if (n == 0) return false; + + for(var i:int=0; i < n; i++) { + var child:UIBase = contentView.getElementAt(i) as UIBase; + child.element.style["flex-grow"] = (child == actualChild) ? "1" : "0"; + child.element.style["flex-shrink"] = "0"; + } + + return true; + } + + COMPILE::SWF + public function layout():Boolean + { + var layoutHost:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:ILayoutObject = layoutHost.contentView; + var actualChild:IUIBase = document.hasOwnProperty(flexibleChild) ? document[flexibleChild] : null; + + var n:Number = contentView.numElements; + if (n == 0) return false; + + var maxWidth:Number = 0; + var maxHeight:Number = 0; + var hostSizedToContent:Boolean = host.isHeightSizedToContent(); + var hostWidth:Number = contentView.width; + var hostHeight:Number = hostSizedToContent ? 0 : contentView.height; + + var ilc:ILayoutChild; + var data:Object; + var canAdjust:Boolean = false; var marginLeft:Object; var marginRight:Object; var marginTop:Object; var marginBottom:Object; var margin:Object; - maxWidth = 0; - - var w:Number = contentView.width; - var hh:Number = contentView.height - padding.bottom; - var yy:int = padding.top; - var flexChildIndex:int; - var ml:Number; - var mr:Number; - var mt:Number; - var mb:Number; - var lastmb:Number; - var lastmt:Number; - var halign:Object; - var left:Number; - var right:Number; - - for (var i:int = 0; i < n; i++) - { - var child:IUIBase = contentView.getElementAt(i) as IUIBase; + var ml:Number; + var mr:Number; + var mt:Number; + var mb:Number; + var margins:Object; + + var paddingMetrics:Rectangle = CSSContainerUtils.getPaddingMetrics(host); + var borderMetrics:Rectangle = CSSContainerUtils.getBorderMetrics(host); + + var xpos:Number = borderMetrics.left - paddingMetrics.left; + var ypos:Number = borderMetrics.top + paddingMetrics.left; + var child:IUIBase; + var childWidth:Number; + var i:int; + var childXpos:Number; + var adjustTop:Number = 0; + var adjustBottom:Number = hostHeight - borderMetrics.top - paddingMetrics.bottom; + + // first work from top to bottom + for(i=0; i < n; i++) + { + child = contentView.getElementAt(i) as IUIBase; if (child == null || !child.visible) continue; - ilc = child as ILayoutChild; - left = ValuesManager.valuesImpl.getValue(child, "left"); - right = ValuesManager.valuesImpl.getValue(child, "right"); - if (child == actualChild) - { - flexChildIndex = i; - break; - } - margin = ValuesManager.valuesImpl.getValue(child, "margin"); - if (margin is Array) - { - if (margin.length == 1) - marginLeft = marginTop = marginRight = marginBottom = margin[0]; - else if (margin.length <= 3) - { - marginLeft = marginRight = margin[1]; - marginTop = marginBottom = margin[0]; - } - else if (margin.length == 4) - { - marginLeft = margin[3]; - marginBottom = margin[2]; - marginRight = margin[1]; - marginTop = margin[0]; - } - } - else if (margin == null) - { - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - } - else - { - marginLeft = marginTop = marginBottom = marginRight = margin; - } - mt = Number(marginTop); - if (isNaN(mt)) - mt = 0; - mb = Number(marginBottom); - if (isNaN(mb)) - mb = 0; - if (ilc) - { - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(contentView.height * ilc.percentHeight / 100, !isNaN(ilc.percentWidth)); - } - if (marginLeft == "auto") - ml = 0; - else - { - ml = Number(marginLeft); - if (isNaN(ml)) - ml = 0; - } - if (marginRight == "auto") - mr = 0; - else - { - mr = Number(marginRight); - if (isNaN(mr)) - mr = 0; - } - if (child is ILayoutChild) - { - ilc = child as ILayoutChild; - if (!isNaN(ilc.percentWidth)) - ilc.setWidth(contentView.width * ilc.percentWidth / 100, !isNaN(ilc.percentHeight)); - } - maxWidth = Math.max(maxWidth, ml + child.width + mr); - setPositionAndWidth(child, left, ml, padding.left, right, mr, padding.right, w); - child.y = yy + mt; - yy += child.height + mt + mb; - lastmb = mb; - } - - if (n > 0 && n > flexChildIndex) - { - for (i = n - 1; i > flexChildIndex; i--) - { - child = contentView.getElementAt(i) as IUIBase; - if (child == null || !child.visible) continue; - ilc = child as ILayoutChild; - left = ValuesManager.valuesImpl.getValue(child, "left"); - right = ValuesManager.valuesImpl.getValue(child, "right"); - margin = ValuesManager.valuesImpl.getValue(child, "margin"); - if (margin is Array) - { - if (margin.length == 1) - marginLeft = marginTop = marginRight = marginBottom = margin[0]; - else if (margin.length <= 3) - { - marginLeft = marginRight = margin[1]; - marginTop = marginBottom = margin[0]; - } - else if (margin.length == 4) - { - marginLeft = margin[3]; - marginBottom = margin[2]; - marginRight = margin[1]; - marginTop = margin[0]; - } - } - else if (margin == null) - { - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - } - else - { - marginLeft = marginTop = marginBottom = marginRight = margin; - } - mt = Number(marginTop); - if (isNaN(mt)) - mt = 0; - mb = Number(marginBottom); - if (isNaN(mb)) - mb = 0; - if (ilc) - { - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(contentView.height * ilc.percentHeight / 100, !isNaN(ilc.percentWidth)); - } - if (marginLeft == "auto") - ml = 0; - else - { - ml = Number(marginLeft); - if (isNaN(ml)) - ml = 0; - } - if (marginRight == "auto") - mr = 0; - else - { - mr = Number(marginRight); - if (isNaN(mr)) - mr = 0; - } - if (child is ILayoutChild) - { - ilc = child as ILayoutChild; - if (!isNaN(ilc.percentWidth)) - ilc.setWidth(contentView.width * ilc.percentWidth / 100, !isNaN(ilc.percentHeight)); - } - setPositionAndWidth(child, left, ml, padding.left, right, mr, padding.right, w); - maxWidth = Math.max(maxWidth, ml + child.width + mr); - child.y = hh - child.height - mb; - hh -= child.height + mt + mb; - lastmt = mt; - } - } - - child = contentView.getElementAt(flexChildIndex) as IUIBase; - ilc = child as ILayoutChild; - left = ValuesManager.valuesImpl.getValue(child, "left"); - right = ValuesManager.valuesImpl.getValue(child, "right"); - margin = ValuesManager.valuesImpl.getValue(child, "margin"); - if (margin is Array) - { - if (margin.length == 1) - marginLeft = marginTop = marginRight = marginBottom = margin[0]; - else if (margin.length <= 3) - { - marginLeft = marginRight = margin[1]; - marginTop = marginBottom = margin[0]; - } - else if (margin.length == 4) - { - marginLeft = margin[3]; - marginBottom = margin[2]; - marginRight = margin[1]; - marginTop = margin[0]; - } - } - else if (margin == null) - { - marginLeft = ValuesManager.valuesImpl.getValue(child, "margin-left"); - marginTop = ValuesManager.valuesImpl.getValue(child, "margin-top"); - marginRight = ValuesManager.valuesImpl.getValue(child, "margin-right"); - marginBottom = ValuesManager.valuesImpl.getValue(child, "margin-bottom"); - } - else - { - marginLeft = marginTop = marginBottom = marginRight = margin; - } - mt = Number(marginTop); - if (isNaN(mt)) - mt = 0; - mb = Number(marginBottom); - if (isNaN(mb)) - mb = 0; - if (ilc) - { - if (!isNaN(ilc.percentHeight)) - ilc.setHeight(contentView.height * ilc.percentHeight / 100, !isNaN(ilc.percentWidth)); - } - if (marginLeft == "auto") - ml = 0; - else - { - ml = Number(marginLeft); - if (isNaN(ml)) - ml = 0; - } - if (marginRight == "auto") - mr = 0; - else - { - mr = Number(marginRight); - if (isNaN(mr)) - mr = 0; - } - if (child is ILayoutChild) - { - ilc = child as ILayoutChild; - if (!isNaN(ilc.percentWidth)) - ilc.setWidth(contentView.width * ilc.percentWidth / 100, !isNaN(ilc.percentHeight)); - } - setPositionAndWidth(child, left, ml, padding.left, right, mr, padding.right, w); - maxWidth = Math.max(maxWidth, ml + child.width + mr); - child.y = yy + mt; - child.height = hh - mb - child.y; - - return true; + if (child == actualChild) break; + + margins = childMargins(child, hostWidth, hostHeight); + ilc = child as ILayoutChild; + + ypos += margins.top; + + childXpos = xpos + margins.left; // default y position + + if (!hostSizedToContent) { + childWidth = child.width; + if (ilc != null && !isNaN(ilc.percentWidth)) { + childWidth = (hostWidth-borderMetrics.left-borderMetrics.right-paddingMetrics.left-paddingMetrics.right) * ilc.percentWidth/100.0; + ilc.setWidth(childWidth); + } + // the following code middle-aligns the child + childXpos = hostWidth/2 - (childWidth + margins.left + margins.right)/2; + } + + if (ilc) { + ilc.setX(childXpos); + ilc.setY(ypos); + + if (!isNaN(ilc.percentHeight)) { + ilc.setHeight((contentView.height-borderMetrics.top-borderMetrics.bottom-paddingMetrics.top-paddingMetrics.bottom) * ilc.percentHeight / 100); + } + + } else { + child.x = childXpos; + child.y = ypos; + } + + ypos += child.height + margins.bottom; + adjustTop = ypos; + } + + // then work from bottom to top + ypos = hostHeight - borderMetrics.bottom - paddingMetrics.bottom; + + for(i=(n-1); actualChild != null && i >= 0; i--) + { + child = contentView.getElementAt(i) as IUIBase; + if (child == null || !child.visible) continue; + if (child == actualChild) break; + + margins = childMargins(child, hostWidth, hostHeight); + ilc = child as ILayoutChild; + + childXpos = xpos + margins.left; // default y position + + if (!hostSizedToContent) { + childWidth = child.width; + if (ilc != null && !isNaN(ilc.percentWidth)) { + childWidth = (hostWidth-borderMetrics.left-borderMetrics.right-paddingMetrics.left-paddingMetrics.right) * ilc.percentWidth/100.0; + ilc.setWidth(childWidth); + } + // the following code middle-aligns the child + childXpos = hostWidth/2 - (childWidth + margins.left + margins.right)/2; + } + + if (ilc) { + if (!isNaN(ilc.percentHeight)) { + ilc.setHeight((contentView.height-borderMetrics.top-borderMetrics.bottom-paddingMetrics.top-paddingMetrics.bottom) * ilc.percentHeight / 100); + } + } + + ypos -= child.height + margins.bottom; + + if (ilc) { + ilc.setX(childXpos); + ilc.setY(ypos); + } else { + child.x = childXpos; + child.y = ypos; + } + + ypos -= margins.top; + adjustBottom = ypos; + } + + // now adjust the actualChild to fill the space. + if (actualChild != null) { + margins = childMargins(actualChild, hostWidth, hostHeight); + ilc = actualChild as ILayoutChild; + if (!hostSizedToContent) { + childWidth = actualChild.width; + if (ilc != null && !isNaN(ilc.percentWidth)) { + childWidth = (hostWidth-borderMetrics.left-borderMetrics.right-paddingMetrics.left-paddingMetrics.right) * ilc.percentWidth/100.0; + ilc.width = childWidth; + } + } + actualChild.x = hostWidth/2 - (childWidth + margins.left + margins.right)/2; + actualChild.y = adjustTop + margins.top; + if (ilc) { + ilc.setHeight((adjustBottom-margins.bottom) - (adjustTop+margins.top)); + } else { + actualChild.height = (adjustBottom-margins.bottom) - (adjustTop+margins.top); + } + } + + host.dispatchEvent( new Event("layoutComplete") ); + + return true; } - - private function setPositionAndWidth(child:IUIBase, left:Number, ml:Number, pl:Number, - right:Number, mr:Number, pr:Number, w:Number):void - { - var widthSet:Boolean = false; - - var ww:Number = w; - var ilc:ILayoutChild = child as ILayoutChild; - if (!isNaN(left)) - { - child.x = left + ml; - ww -= left + ml; - } - else - { - if (isNaN(right)) - child.x = ml + pl; - ww -= ml; - } - if (!isNaN(right)) - { - if (!isNaN(left)) - { - if (ilc) - ilc.setWidth(ww - right - mr, true); - else - { - child.width = ww - right - mr; - widthSet = true; - } - } - else - child.x = w - right - mr - child.width - 1; // some browsers don't like going all the way to the edge - } - if (ilc) - { - if (!isNaN(ilc.percentWidth)) - ilc.setWidth(w * ilc.percentWidth / 100, true); - } - if (!widthSet) - child.dispatchEvent(new Event("sizeChanged")); - } public function setDocument(document:Object, id:String = null):void {
