You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2018/05/26 13:31:47 UTC
[royale-asjs] branch develop updated: TileLayout in Jewel,
still needs to be updated to use CSS rules
This is an automated email from the ASF dual-hosted git repository.
carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git
The following commit(s) were added to refs/heads/develop by this push:
new c1e2167 TileLayout in Jewel, still needs to be updated to use CSS rules
c1e2167 is described below
commit c1e216783678afc5b7630b37dfe25b9bdefd01c8
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sat May 26 15:31:29 2018 +0200
TileLayout in Jewel, still needs to be updated to use CSS rules
---
.../Jewel/src/main/resources/jewel-manifest.xml | 2 +
.../projects/Jewel/src/main/royale/JewelClasses.as | 1 +
.../royale/jewel/beads/layouts/TileLayout.as | 247 +++++++++++++++++++++
3 files changed, 250 insertions(+)
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index 097e6bd..acfb15b 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -45,10 +45,12 @@
<component id="TextPrompt" class="org.apache.royale.jewel.beads.controls.textinput.TextPrompt"/>
<component id="BasicLayout" class="org.apache.royale.jewel.beads.layouts.BasicLayout"/>
+ <component id="TileLayout" class="org.apache.royale.jewel.beads.layouts.TileLayout"/>
<component id="HorizontalLayout" class="org.apache.royale.jewel.beads.layouts.HorizontalLayout"/>
<component id="VerticalLayout" class="org.apache.royale.jewel.beads.layouts.VerticalLayout"/>
<component id="HorizontalLayoutWithPaddingAndGap" class="org.apache.royale.jewel.beads.layouts.HorizontalLayoutWithPaddingAndGap"/>
<component id="VerticalLayoutWithPaddingAndGap" class="org.apache.royale.jewel.beads.layouts.VerticalLayoutWithPaddingAndGap"/>
+
<component id="HorizontalLayoutSpaceBetween" class="org.apache.royale.jewel.beads.layouts.HorizontalLayoutSpaceBetween"/>
<component id="ListItemRenderer" class="org.apache.royale.jewel.itemRenderers.ListItemRenderer"/>
diff --git a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
index b2ec58b..683b0b5 100644
--- a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
+++ b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
@@ -62,6 +62,7 @@ package
}
import org.apache.royale.jewel.beads.layouts.BasicLayout; BasicLayout;
+ import org.apache.royale.jewel.beads.layouts.TileLayout; TileLayout;
import org.apache.royale.jewel.beads.layouts.HorizontalLayout; HorizontalLayout;
import org.apache.royale.jewel.beads.layouts.VerticalLayout; VerticalLayout;
import org.apache.royale.jewel.beads.layouts.HorizontalLayoutWithPaddingAndGap; HorizontalLayoutWithPaddingAndGap;
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TileLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TileLayout.as
new file mode 100644
index 0000000..2a8c7fa
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TileLayout.as
@@ -0,0 +1,247 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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.royale.jewel.beads.layouts
+{
+ import org.apache.royale.core.LayoutBase;
+ import org.apache.royale.core.IBeadLayout;
+ import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+ import org.apache.royale.core.IParentIUIBase;
+ import org.apache.royale.core.IUIBase;
+ import org.apache.royale.core.layout.EdgeData;
+ import org.apache.royale.core.UIBase;
+ import org.apache.royale.core.ValuesManager;
+
+ /**
+ * The TileLayout class bead sizes and positions the elements it manages into rows and columns.
+ * The size of each element is determined either by setting TileLayout's columnWidth and rowHeight
+ * properties, or having the tile size determined by factoring the numColumns into the area assigned
+ * for the layout.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.0
+ */
+ public class TileLayout extends LayoutBase implements IBeadLayout
+ {
+ /**
+ * constructor.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.0
+ */
+ public function TileLayout()
+ {
+ super();
+ }
+
+ private var _numColumns:Number = 4;
+ private var _columnWidth:Number = Number.NaN;
+ private var _rowHeight:Number = Number.NaN;
+
+ /**
+ * The number of tiles to fit horizontally into the layout.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.0
+ */
+ public function get numColumns():Number
+ {
+ return _numColumns;
+ }
+ public function set numColumns(value:Number):void
+ {
+ _numColumns = value;
+ }
+
+ /**
+ * The width of each column, in pixels. If left unspecified, the
+ * columnWidth is determined by dividing the numColumns into the
+ * strand's bounding box width.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.0
+ */
+ public function get columnWidth():Number
+ {
+ return _columnWidth;
+ }
+ public function set columnWidth(value:Number):void
+ {
+ _columnWidth = value;
+ }
+
+ /**
+ * The height of each row, in pixels. If left unspecified, the
+ * rowHeight is determine by dividing the possible number of rows
+ * into the strand's bounding box height.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.0
+ */
+ public function get rowHeight():Number
+ {
+ return _rowHeight;
+ }
+ public function set rowHeight(value:Number):void
+ {
+ _rowHeight = value;
+ }
+
+ /**
+ * @copy org.apache.royale.core.IBeadLayout#layout
+ * @royaleignorecoercion org.apache.royale.core.IBorderPaddingMarginValuesImpl
+ */
+ override public function layout():Boolean
+ {
+ // var paddingMetrics:EdgeData = (ValuesManager.valuesImpl as IBorderPaddingMarginValuesImpl).getPaddingMetrics(host);
+
+ COMPILE::SWF
+ {
+ var borderMetrics:EdgeData = (ValuesManager.valuesImpl as IBorderPaddingMarginValuesImpl).getBorderMetrics(host);
+ var area:UIBase = layoutView as UIBase;
+
+ var xpos:Number = 0;
+ var ypos:Number = 0;
+ var useWidth:Number = columnWidth;
+ var useHeight:Number = rowHeight;
+ var n:Number = area.numElements;
+ if (n == 0) return false;
+
+ var adjustedWidth:Number = Math.floor(host.width - borderMetrics.left - borderMetrics.right);
+ var adjustedHeight:Number = Math.floor(host.height - borderMetrics.top - borderMetrics.bottom);
+
+ var realN:Number = n;
+ for(var j:int=0; j < n; j++)
+ {
+ var testChild:IUIBase = area.getElementAt(i) as IUIBase;
+ if (testChild == null || !testChild.visible) realN--;
+ }
+
+ if (isNaN(useWidth)) useWidth = Math.floor(adjustedWidth / numColumns); // + gap
+ if (isNaN(useHeight)) {
+ // given the width and total number of items, how many rows?
+ var numRows:Number = Math.ceil(realN/numColumns);
+ if (host.isHeightSizedToContent()) useHeight = 30; // default height
+ else useHeight = Math.floor(adjustedHeight / numRows);
+ }
+
+ var maxWidth:Number = useWidth;
+ var maxHeight:Number = useHeight;
+
+ for(var i:int=0; i < n; i++)
+ {
+ var child:IUIBase = area.getElementAt(i) as IUIBase;
+ if (child == null || !child.visible) continue;
+ child.width = useWidth;
+ child.height = useHeight;
+ child.x = xpos;
+ child.y = ypos;
+
+ xpos += useWidth;
+ maxWidth = Math.max(maxWidth,xpos);
+
+ var test:Number = (i+1)%numColumns;
+
+ if (test == 0) {
+ xpos = 0;
+ ypos += useHeight;
+ maxHeight = Math.max(maxHeight,ypos);
+ }
+ }
+
+ maxWidth = Math.max(maxWidth, numColumns*useWidth);
+ maxHeight = Math.max(maxHeight, numRows*useHeight);
+
+ // Only return true if the contentView needs to be larger; that new
+ // size is stored in the model.
+ var sizeChanged:Boolean = true;
+
+ return sizeChanged;
+ }
+ 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 contentView:IParentIUIBase = layoutView as IParentIUIBase;
+
+ children = contentView.internalChildren();
+ n = children.length;
+ if (n === 0) return false;
+
+ contentView.element.style["display"] = "flex";
+ contentView.element.style["flexFlow"] = "row wrap";
+ contentView.element.style["alignContent"] = "flex-start";
+ var realN:int = n;
+ for (i = 0; i < n; i++)
+ {
+ child = children[i].royale_wrapper;
+ if (!child.visible) realN--;
+ }
+
+ xpos = 0;
+ ypos = 0;
+ useWidth = columnWidth;
+ useHeight = rowHeight;
+ var needWidth:Boolean = isNaN(useWidth);
+ var needHeight:Boolean = isNaN(useHeight);
+ if(needHeight || needWidth){
+ var borderMetrics:EdgeData = (ValuesManager.valuesImpl as IBorderPaddingMarginValuesImpl).getBorderMetrics(host);
+ var adjustedWidth:Number = Math.floor(host.width - borderMetrics.left - borderMetrics.right);
+ var adjustedHeight:Number = Math.floor(host.height - borderMetrics.top - borderMetrics.bottom);
+ if (needWidth)
+ useWidth = Math.floor(adjustedWidth / numColumns); // + gap
+
+ if (needHeight)
+ {
+ // given the width and total number of items, how many rows?
+ var numRows:Number = Math.ceil(realN / numColumns);
+ if (host.isHeightSizedToContent()) useHeight = 30; // default height
+ else useHeight = Math.floor(adjustedHeight / numRows);
+ }
+ }
+
+ for (i = 0; i < n; i++)
+ {
+ child = children[i].royale_wrapper;
+ if (!child.visible) continue;
+ child.setDisplayStyleForLayout('inline-block');
+ child.width = useWidth;
+ child.height = useHeight;
+ }
+ return true;
+ }
+ }
+ }
+}
--
To stop receiving notification emails like this one, please contact
carlosrovira@apache.org.