Repository: flex-asjs
Updated Branches:
  refs/heads/develop 1df874ab9 -> 3c600227e


Adding new HorizontalFlowLayout bead. Modified TextFieldViewBase to accommodate 
multiline text.


Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/3c600227
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/3c600227
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/3c600227

Branch: refs/heads/develop
Commit: 3c600227e85d9d519076ff9fd20485c3dbb1a32b
Parents: 1df874a
Author: Peter Ent <p...@apache.org>
Authored: Thu Dec 1 11:43:37 2016 -0500
Committer: Peter Ent <p...@apache.org>
Committed: Thu Dec 1 11:43:37 2016 -0500

----------------------------------------------------------------------
 .../flex/html/beads/MultilineTextFieldView.as   |   2 +-
 .../apache/flex/html/beads/TextFieldViewBase.as |   8 +
 .../html/beads/layouts/HorizontalFlowLayout.as  | 266 +++++++++++++++++++
 .../HTML/src/main/resources/basic-manifest.xml  |   1 +
 4 files changed, 276 insertions(+), 1 deletion(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3c600227/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/MultilineTextFieldView.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/MultilineTextFieldView.as
 
b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/MultilineTextFieldView.as
index 72dc588..5ee7c6a 100644
--- 
a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/MultilineTextFieldView.as
+++ 
b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/MultilineTextFieldView.as
@@ -44,7 +44,7 @@ package org.apache.flex.html.beads
                public function MultilineTextFieldView()
                {
                        super();
-                       
+                                               
                        textField.selectable = false;
                        textField.type = TextFieldType.DYNAMIC;
                        textField.mouseEnabled = false;

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3c600227/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/TextFieldViewBase.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/TextFieldViewBase.as
 
b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/TextFieldViewBase.as
index 0fb9542..769ddb0 100644
--- 
a/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/TextFieldViewBase.as
+++ 
b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/TextFieldViewBase.as
@@ -399,6 +399,14 @@ package org.apache.flex.html.beads
                 textField.autoSize = "none";
                 textField.width = host.width;
             }
+                       
+                       if (autoWidth) {
+                               (host as UIBase).setWidth(textField.textWidth, 
true);
+                       }
+                       if (autoHeight) {
+                               (host as 
UIBase).setHeight(textField.textHeight, true);
+                       }
+                       
         }
     }
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3c600227/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
new file mode 100644
index 0000000..345bcfc
--- /dev/null
+++ 
b/frameworks/projects/HTML/src/main/flex/org/apache/flex/html/beads/layouts/HorizontalFlowLayout.as
@@ -0,0 +1,266 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+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.IParentIUIBase;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.core.IUIBase;
+       import org.apache.flex.core.UIBase;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.IEventDispatcher;
+
+       /**
+        *  The HorizontalFlowLayout class bead sizes and positions the 
elements it manages into rows
+        *  and columns. It does this by seeing how many elements will fit 
horizontally and then flow
+        *  the remainder onto the next lines. If an element does not already 
have an explicit or percentage
+        *  size, a size is chosen for it based on the defaultColumnCount 
property which divides the
+        *  layout space into equal number of cells as a default measurement.
+        * 
+        *  The height of each row is determined by the tallest element in the 
row. The next row flows
+        *  below that.
+        *
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class HorizontalFlowLayout implements IBeadLayout
+       {
+               /**
+                *  constructor.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function HorizontalFlowLayout()
+               {
+               }
+
+               private var _strand:IStrand;
+
+               /**
+                *  @copy org.apache.flex.core.IBead#strand
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+
+               private var _defaultColumnCount:Number = 4;
+               private var _computedColumnWidth:Number = Number.NaN;
+               private var _columnGap:int = 4;
+               private var _rowGap:int = 4;
+               
+               /**
+                *  The amount of spacing between the columns.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get columnGap():int
+               {
+                       return _columnGap;
+               }
+               public function set columnGap(value:int):void
+               {
+                       _columnGap = value;
+               }
+               
+               /**
+                *  Amount of spacing between the rows.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get rowGap():int
+               {
+                       return _rowGap;
+               }
+               public function set rowGap(value:int):void
+               {
+                       _rowGap = value;
+               }
+
+               /**
+                *  The default number of columns the layout should assume 
should any or
+                *  all of the elements not have explicit or percentage widths. 
This value is
+                *  used to divide the layout width into equal-width columns. 
An element's 
+                *  own width overrides this computed width, allowing for a 
ragged grid
+                *  arrangement.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get defaultColumnCount():Number
+               {
+                       return _defaultColumnCount;
+               }
+               public function set defaultColumnCount(value:Number):void
+               {
+                       _defaultColumnCount = value;
+               }
+
+               /**
+                *  The calculated width of each column, in pixels. If left 
unspecified, the
+                *  columnWidth is determined by dividing the 
defaultColumnCount into the
+                *  strand's bounding box width.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get computedColumnWidth():Number
+               {
+                       return _computedColumnWidth;
+               }
+               public function set computedColumnWidth(value:Number):void
+               {
+                       _computedColumnWidth = value;
+               }
+
+        /**
+         * @copy org.apache.flex.core.IBeadLayout#layout
+         */
+               public function layout():Boolean
+               {
+                       COMPILE::SWF
+                       {
+                               // this is where the layout is calculated
+                               var host:UIBase = _strand as UIBase;
+                               var p:ILayoutHost = (host as 
ILayoutParent).getLayoutHost();
+                               var area:UIBase = p.contentView as UIBase;
+                               
+                               var n:Number = area.numElements;
+                               if (n == 0) return false;
+                               
+                               // if a computedColumnWidth hasn't been preset, 
calculate it
+                               // based on the default column count, giving 
equal-width columns.
+                               if (isNaN(computedColumnWidth)) {
+                                       _computedColumnWidth = area.width / 
defaultColumnCount;
+                               }
+                               
+                               var maxWidth:Number = area.width;
+                               var maxHeight:Number = 0;
+                               var xpos:Number = columnGap/2;
+                               var ypos:Number = rowGap/2;
+                               var useWidth:Number = 0;
+                               
+                               for(var i:int=0; i < n; i++)
+                               {
+                                       var child:UIBase = area.getElementAt(i) 
as UIBase;
+                                       if (child == null || !child.visible) 
continue;
+                                       
+                                       if (!isNaN(child.explicitWidth)) 
useWidth = child.explicitWidth;
+                                       else if (!isNaN(child.percentWidth)) 
useWidth = maxWidth * (child.percentWidth/100.0);
+                                       else useWidth = _computedColumnWidth;
+                                       
+                                       if (xpos+useWidth > maxWidth) {
+                                               ypos += maxHeight + rowGap;
+                                               xpos = columnGap/2;
+                                               maxHeight = 0;
+                                       }
+                                       
+                                       child.x = xpos;
+                                       child.y = ypos;
+                                       child.setWidth(useWidth)
+                                       //child.explicitWidth = useWidth;
+                                       //child.width = useWidth; // to trigger 
child layout
+                                       //child.dispatchEvent(new 
Event("layoutNeeded"));
+                                       
+                                       var childWidth:Number = child.width;
+                                       var childHeight:Number = child.height;
+                                       maxHeight = Math.max(maxHeight, 
childHeight);
+                                       
+                                       xpos += childWidth + columnGap;
+                               }
+                               
+                               IEventDispatcher(_strand).dispatchEvent( new 
Event("layoutComplete") );
+                               
+                               return true;
+                       }
+                       COMPILE::JS
+                       {
+                               var children:Array;
+                               var i:int;
+                               var n:int;
+                               var child:UIBase;
+                               var xpos:Number;
+                               var ypos:Number;
+                               var useWidth:Number;
+                               var useHeight:Number;
+
+                               var host:UIBase = _strand as UIBase;
+                               var viewBead:ILayoutHost = (host as 
ILayoutParent).getLayoutHost();
+                               var area:IParentIUIBase = viewBead.contentView 
as IParentIUIBase;
+                               children = area.internalChildren();
+                               n = children.length;
+                               if (n === 0) return false;
+
+                               area.width = host.width;
+                               
+                               var element:HTMLElement = area.element as 
HTMLElement;
+                               element.style["flexFlow"] = "row wrap";
+                               element.style["display"] = "flex";
+                               
+                               // if a computedColumnWidth hasn't been preset, 
calculate it
+                               // based on the default column count, giving 
equal-width columns.
+                               if (isNaN(computedColumnWidth)) {
+                                       _computedColumnWidth = host.width / 
defaultColumnCount;
+                               }
+
+                               for (i = 0; i < n; i++)
+                               {
+                                       child = children[i].flexjs_wrapper;
+                                       if (!child.visible) continue;
+                                       
+                                       if (!isNaN(child.explicitWidth)) 
useWidth = child.explicitWidth;
+                                       else if (!isNaN(child.percentWidth)) 
useWidth = host.width * (child.percentWidth/100.0);
+                                       else useWidth = _computedColumnWidth;
+                                       
+                                       child.width = useWidth;
+                                       children[i].style["margin-top"] = 
String(_rowGap/2)+"px";
+                                       children[i].style["margin-bottom"] = 
String(_rowGap/2)+"px";
+                                       children[i].style["margin-left"] = 
String(_columnGap/2)+"px";
+                                       children[i].style["margin-right"] = 
String(_columnGap/2)+"px";
+                               }
+                               
+                               IEventDispatcher(_strand).dispatchEvent( new 
Event("layoutComplete") );
+                               
+                               return true;
+                       }
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3c600227/frameworks/projects/HTML/src/main/resources/basic-manifest.xml
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/src/main/resources/basic-manifest.xml 
b/frameworks/projects/HTML/src/main/resources/basic-manifest.xml
index 8b6b657..53a439f 100644
--- a/frameworks/projects/HTML/src/main/resources/basic-manifest.xml
+++ b/frameworks/projects/HTML/src/main/resources/basic-manifest.xml
@@ -61,6 +61,7 @@
     <component id="BasicLayout" 
class="org.apache.flex.html.beads.layouts.BasicLayout"/>
     <component id="VerticalLayout" 
class="org.apache.flex.html.beads.layouts.VerticalLayout"/>
     <component id="HorizontalLayout" 
class="org.apache.flex.html.beads.layouts.HorizontalLayout"/>
+    <component id="HorizontalFlowLayout" 
class="org.apache.flex.html.beads.layouts.HorizontalFlowLayout" />
     <component id="TileLayout" 
class="org.apache.flex.html.beads.layouts.TileLayout"/>
     <component id="ListView" class="org.apache.flex.html.beads.ListView"/>
     <component id="AccordionView" 
class="org.apache.flex.html.beads.AccordionView"/>

Reply via email to