This is an automated email from the ASF dual-hosted git repository.
pent 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 a96126f DataGrid (and TreeGrid) is better at understanding percentage
sizes. Gave DataGrid a default size. Updated DataGridExample.
a96126f is described below
commit a96126f2bd88a5421814e3cadb9a931bd6752d37
Author: Peter Ent <[email protected]>
AuthorDate: Mon Jan 22 10:14:41 2018 -0500
DataGrid (and TreeGrid) is better at understanding percentage sizes. Gave
DataGrid a default size. Updated DataGridExample.
---
.../src/main/royale/MyInitialView.mxml | 43 ++++++++++++++--------
.../main/royale/org/apache/royale/html/DataGrid.as | 4 ++
.../royale/html/beads/layouts/DataGridLayout.as | 14 ++++++-
.../royale/html/beads/layouts/TreeGridLayout.as | 14 ++++++-
4 files changed, 56 insertions(+), 19 deletions(-)
diff --git a/examples/royale/DataGridExample/src/main/royale/MyInitialView.mxml
b/examples/royale/DataGridExample/src/main/royale/MyInitialView.mxml
index 92dbece..6a1e827 100644
--- a/examples/royale/DataGridExample/src/main/royale/MyInitialView.mxml
+++ b/examples/royale/DataGridExample/src/main/royale/MyInitialView.mxml
@@ -74,6 +74,14 @@ limitations under the License.
IBeadLayout:
ClassReference("org.apache.royale.html.beads.layouts.DataGridPercentageLayout");
border: 1px solid #ACACAC;
}
+
+ .OuterGroup {
+ background-color: orange;
+ padding: 10px;
+ }
+ .OuterGroup .DataGrid {
+ position: relative;
+ }
</fx:Style>
@@ -89,23 +97,28 @@ limitations under the License.
<!-- The default configuration of the DataGrid, using only Array as the
dataProvider. A style class
- has been added to add the DataGridPercentageView bead that lets
the columns' widths be
+ has been added to add the DataGridPercentageLayout bead that lets
the columns' widths be
specified by percentages.
-->
- <js:DataGrid id="dataGrid" x="20" y="50" width="400" height="350"
change="dataGridChange(dataGrid, output1)"
- rowHeight="40"
className="PercentageColumnWidths DataGrid">
- <js:beads>
- <js:ConstantBinding
- sourceID="applicationModel"
- sourcePropertyName="productArray"
- destinationPropertyName="dataProvider" />
- </js:beads>
- <js:columns>
- <js:DataGridColumn label="Image" dataField="image"
columnWidth="15" itemRenderer="products.ProductItemRenderer"/>
- <js:DataGridColumn label="Title" dataField="title"
columnWidth="60" />
- <js:DataGridColumn label="Sales" dataField="sales"
columnWidth="25" />
- </js:columns>
- </js:DataGrid>
+ <js:HContainer x="20" y="50" width="400" height="350"
className="OuterGroup">
+
+ <!-- demonstrates how to place a DataGrid into a Container that has
padding. -->
+ <js:DataGrid id="dataGrid" width="100%" height="100%"
change="dataGridChange(dataGrid, output1)"
+ rowHeight="40"
className="PercentageColumnWidths DataGrid">
+ <js:beads>
+ <js:ConstantBinding
+ sourceID="applicationModel"
+ sourcePropertyName="productArray"
+ destinationPropertyName="dataProvider"
/>
+ </js:beads>
+ <js:columns>
+ <js:DataGridColumn label="Image"
dataField="image" columnWidth="15" itemRenderer="products.ProductItemRenderer"/>
+ <js:DataGridColumn label="Title"
dataField="title" columnWidth="60" />
+ <js:DataGridColumn label="Sales"
dataField="sales" columnWidth="25" />
+ </js:columns>
+ </js:DataGrid>
+
+ </js:HContainer>
<!-- A dynamic DataGrid, responding to additions and deletions, using
the .DynamicDataGrid style class
-->
diff --git
a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/DataGrid.as
b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/DataGrid.as
index 1557691..0557c7b 100644
---
a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/DataGrid.as
+++
b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/DataGrid.as
@@ -60,6 +60,10 @@ package org.apache.royale.html
super();
className = "DataGrid";
+
+ // set a reasonable default size
+ width = 200;
+ height = 200;
}
/**
diff --git
a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/DataGridLayout.as
b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/DataGridLayout.as
index a420bcd..ca2640f 100644
---
a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/DataGridLayout.as
+++
b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/DataGridLayout.as
@@ -140,12 +140,22 @@ package org.apache.royale.html.beads.layouts
header.x = borderMetrics.left;
header.y = borderMetrics.top;
- header.width = useWidth;
+ COMPILE::SWF {
+ header.width = useWidth;
+ }
+ COMPILE::JS {
+ (header as UIBase).percentWidth = 100;
+ }
// header's height is set in CSS
listArea.x = borderMetrics.left;
listArea.y = header.height + header.y;
- listArea.width = useWidth;
+ COMPILE::SWF {
+ listArea.width = useWidth;
+ }
+ COMPILE::JS {
+ (listArea as UIBase).percentWidth = 100;
+ }
listArea.height = useHeight - header.height;
header.dispatchEvent(new Event("layoutNeeded"));
diff --git
a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/TreeGridLayout.as
b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/TreeGridLayout.as
index 5a56813..4070739 100644
---
a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/TreeGridLayout.as
+++
b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/layouts/TreeGridLayout.as
@@ -120,7 +120,12 @@ package org.apache.royale.html.beads.layouts
// size and position the header
header.x = borderMetrics.left;
header.y = borderMetrics.top;
- header.width = useWidth;
+ COMPILE::SWF {
+ header.width = useWidth;
+ }
+ COMPILE::JS {
+ (header as UIBase).percentWidth = 100;
+ }
// header's height is set in CSS
// size and position the elements that make up the
content
@@ -158,7 +163,12 @@ package org.apache.royale.html.beads.layouts
// size and position the contentArea
contentArea.x = borderMetrics.left;
contentArea.y = header.height + header.y;
- contentArea.width = useWidth;
+ COMPILE::SWF {
+ contentArea.width = useWidth;
+ }
+ COMPILE::JS {
+ (contentArea as UIBase).percentWidth = 100;
+ }
contentArea.height = useHeight - header.height;
return true;
--
To stop receiving notification emails like this one, please contact
[email protected].
