Repository: flex-asjs Updated Branches: refs/heads/develop ac3b2e055 -> 9fe79fdf9
Updated HorizontalFlexLayout and VerticalFlexLayout with SWF platform code. Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/9fe79fdf Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/9fe79fdf Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/9fe79fdf Branch: refs/heads/develop Commit: 9fe79fdf998c6fe2e1e83b82bc6b55e3e5783e91 Parents: ac3b2e0 Author: Peter Ent <p...@apache.org> Authored: Fri Feb 24 14:17:30 2017 -0500 Committer: Peter Ent <p...@apache.org> Committed: Fri Feb 24 14:17:30 2017 -0500 ---------------------------------------------------------------------- .../src/main/flex/MyInitialView.mxml | 12 +- .../html/beads/layouts/HorizontalFlexLayout.as | 123 +++++++++++++++++- .../html/beads/layouts/VerticalFlexLayout.as | 125 ++++++++++++++++++- 3 files changed, 251 insertions(+), 9 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fe79fdf/examples/flexjs/DataBindingExample/src/main/flex/MyInitialView.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DataBindingExample/src/main/flex/MyInitialView.mxml b/examples/flexjs/DataBindingExample/src/main/flex/MyInitialView.mxml index 9677b5f..9adb77d 100644 --- a/examples/flexjs/DataBindingExample/src/main/flex/MyInitialView.mxml +++ b/examples/flexjs/DataBindingExample/src/main/flex/MyInitialView.mxml @@ -85,7 +85,6 @@ limitations under the License. } .symbolInput { - width: 50%; } .rightSide { @@ -96,7 +95,6 @@ limitations under the License. .quoteButton { margin-top: 10px; margin-bottom: 10px; - width: 50%; } </fx:Style> <js:states> @@ -111,17 +109,17 @@ limitations under the License. <js:Label text="Enter Stock Symbol or choose from list:" /> - <js:Container className="inner"> + <js:Container className="inner" width="400"> <js:beads> <js:HorizontalFlexLayout /> </js:beads> <js:Container className="leftSide"> <js:beads> - <js:VerticalFlexLayout /> + <js:VerticalLayout /> </js:beads> - <js:TextInput id="symbolTI" text="{MyModel(applicationModel).stockSymbol}" className="symbolInput" /> - <js:TextButton text="Get Quote" className="quoteButton" + <js:TextInput id="symbolTI" text="{MyModel(applicationModel).stockSymbol}" className="symbolInput" width="50%" /> + <js:TextButton text="Get Quote" className="quoteButton" width="50%" click="_symbol = symbolTI.text; dispatchEvent(new CustomEvent('buttonClicked'))" /> <js:Label id="field" text="{fieldText}"/> <js:Label className="output" height="24" text="{MyModel(applicationModel).responseText}" /> @@ -131,7 +129,7 @@ limitations under the License. <js:beads> <js:VerticalFlexLayout /> </js:beads> - <js:DropDownList id="list" + <js:DropDownList id="list" width="50%" change="_symbol = list.selectedItem as String; dispatchEvent(new CustomEvent('listChanged'))" dataProvider="{MyModel(applicationModel).strings}" /> <js:RadioButton id="radio1" text="Price" value="Ask" groupName="group1" change="radioChanged(event)"/> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fe79fdf/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 f014dc4..1ca2e52 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 @@ -25,6 +25,18 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IStrand; + 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; + import org.apache.flex.geom.Rectangle; + import org.apache.flex.utils.CSSUtils; + import org.apache.flex.utils.CSSContainerUtils; + } + public class HorizontalFlexLayout extends HorizontalLayout { public function HorizontalFlexLayout() @@ -50,7 +62,116 @@ package org.apache.flex.html.beads.layouts override public function layout():Boolean { COMPILE::SWF { - return super.layout(); + //return super.layout(); + // this is where the layout is calculated + var layoutParent:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:IParentIUIBase = layoutParent.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 childData:Array = []; + + 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; + + // 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) { + childData.push({width:0, height:0, mt:0, ml:0, mr:0, mb:0, canAdjust:false}); + continue; + } + + 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 useHeight:Number = -1; + if (ilc) { + if (!isNaN(ilc.explicitHeight)) useHeight = ilc.explicitHeight; + else if (!isNaN(ilc.percentHeight)) useHeight = contentView.height * (ilc.percentHeight/100.0); + else useHeight = contentView.height; + } + + 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, contentView.width); + var mr:Number = CSSUtils.getRightValue(marginRight, margin, contentView.width); + var mt:Number = CSSUtils.getTopValue(marginTop, margin, contentView.height); + var mb:Number = CSSUtils.getBottomValue(marginBottom, margin, contentView.height); + if (marginLeft == "auto") + ml = 0; + if (marginRight == "auto") + mr = 0; + + 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}); + } + + var xpos:Number = 0; + var ypos:Number = 0; + + // Second pass sizes and positions the children based on the data gathered. + for(i=0; i < n; i++) + { + child = contentView.getElementAt(i) as IUIBase; + 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); + + 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) { + ilc.setWidth(useWidth - data.ml - data.mr); + } + } else { + child.x = xpos + data.ml; + child.y = ypos + data.mt; + child.height = useHeight - data.mt - data.b; + if (data.width > 0) { + child.width = useWidth - data.mr - data.ml; + } + } + + xpos += child.width + data.ml + data.mr; + + trace("HorizontalFlexLayout: setting child "+i+" to "+child.width+" x "+child.height+" at "+child.x+", "+child.y); + } + + IEventDispatcher(host).dispatchEvent( new Event("layoutComplete") ); + + trace("HorizontalFlexLayout: complete"); + + return true; } COMPILE::JS { http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fe79fdf/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/VerticalFlexLayout.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/VerticalFlexLayout.as b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/VerticalFlexLayout.as index c0afc1f..2365991 100644 --- a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/VerticalFlexLayout.as +++ b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/VerticalFlexLayout.as @@ -25,6 +25,18 @@ package org.apache.flex.html.beads.layouts import org.apache.flex.core.ILayoutParent; import org.apache.flex.core.IStrand; + 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; + import org.apache.flex.geom.Rectangle; + import org.apache.flex.utils.CSSUtils; + import org.apache.flex.utils.CSSContainerUtils; + } + public class VerticalFlexLayout extends VerticalLayout { public function VerticalFlexLayout() @@ -50,7 +62,118 @@ package org.apache.flex.html.beads.layouts override public function layout():Boolean { COMPILE::SWF { - return super.layout(); + //return super.layout(); + var layoutParent:ILayoutHost = (host as ILayoutParent).getLayoutHost(); + var contentView:IParentIUIBase = layoutParent.contentView; + + var n:Number = contentView.numElements; + if (n == 0) return false; + + trace("VerticalFlexLayout: 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 childData:Array = []; + + 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; + + // 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) { + childData.push({width:0, height:0, mt:0, ml:0, mr:0, mb:0, canAdjust:false}); + continue; + } + + 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 useWidth = contentView.width; + } + if (useWidth > contentView.width) useWidth = contentView.width; + + var useHeight:Number = -1; + if (ilc) { + if (!isNaN(ilc.explicitHeight)) useHeight = ilc.explicitHeight; + else if (!isNaN(ilc.percentHeight)) useHeight = contentView.height * (ilc.percentHeight/100.0); + else { + canAdjust = true; + } + } + + 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, contentView.width); + var mr:Number = CSSUtils.getRightValue(marginRight, margin, contentView.width); + var mt:Number = CSSUtils.getTopValue(marginTop, margin, contentView.height); + var mb:Number = CSSUtils.getBottomValue(marginBottom, margin, contentView.height); + if (marginLeft == "auto") + ml = 0; + if (marginRight == "auto") + mr = 0; + + 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}); + } + + var xpos:Number = 0; + var ypos:Number = 0; + + // Second pass sizes and positions the children based on the data gathered. + for(i=0; i < n; i++) + { + child = contentView.getElementAt(i) as IUIBase; + 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); + + ilc = child as ILayoutChild; + if (ilc) { + ilc.setX(xpos + data.ml); + ilc.setY(ypos + data.mt); + ilc.setWidth(useWidth - data.ml - data.mr); + if (data.height > 0) { + ilc.setHeight(useHeight - data.mt - data.mb); + } + } else { + child.x = xpos + data.ml; + child.y = ypos + data.mt; + child.width = useWidth - data.ml - data.mr; + if (data.height > 0) { + child.height = useHeight - data.mt - data.mb; + } + } + + ypos += child.height + data.mt + data.mb; + + trace("VerticalFlexLayout: setting child "+i+" to "+child.width+" x "+child.height+" at "+child.x+", "+child.y); + } + + IEventDispatcher(host).dispatchEvent( new Event("layoutComplete") ); + + trace("VerticalFlexLayout: complete"); + + return true; } COMPILE::JS {
