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 2019/12/28 01:11:18 UTC
[royale-asjs] branch develop updated: jewel-datagrid: make layout
work for different heights and rows. Scrolling appear depending of
visualization need.
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 91d4f3a jewel-datagrid: make layout work for different heights and rows. Scrolling appear depending of visualization need.
91d4f3a is described below
commit 91d4f3aadbbea3e7d044ccb5394b4d78228fbe1a
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sat Dec 28 02:11:06 2019 +0100
jewel-datagrid: make layout work for different heights and rows. Scrolling appear depending of visualization need.
---
.../src/main/royale/DataGridPlayGround.mxml | 4 ++--
.../projects/Jewel/src/main/resources/defaults.css | 2 +-
.../apache/royale/jewel/beads/views/DataGridView.as | 19 +++++++++++++++++--
.../Jewel/src/main/sass/components/_datagrid.sass | 2 +-
4 files changed, 21 insertions(+), 6 deletions(-)
diff --git a/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml b/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml
index 89c98c9..281f99e 100644
--- a/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml
@@ -143,7 +143,7 @@ limitations under the License.
<j:Label text="Using specific column widths, rowHeight=40"/>
- <j:DataGrid height="246"
+ <j:DataGrid localId="datagrid4" height="246"
rowHeight="40" emphasis="emphasized"
change="dataGridIconListChange(event.target as DataGrid, datagrid4_lb)"
dataProvider="{listModel.iconListData}">
@@ -155,7 +155,7 @@ limitations under the License.
</j:DataGrid>
<j:Label id="datagrid4_lb" text="DataGrid selection will be shown here"/>
- <j:Button text="Refresh Grid" click="refreshGrid(datagrid2)" emphasis="primary"/>
+ <j:Button text="Refresh Grid" click="refreshGrid(datagrid4)" emphasis="primary"/>
</j:Card>
</j:GridCell>
</j:Grid>
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css b/frameworks/projects/Jewel/src/main/resources/defaults.css
index f510348..753cba1 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -494,7 +494,7 @@ j|ComboBoxPopUp {
.jewel.datagrid {
width: 220px;
- height: 220px;
+ height: 240px;
display: flex;
position: relative;
}
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DataGridView.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DataGridView.as
index 2206e99..238466c 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DataGridView.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DataGridView.as
@@ -118,10 +118,12 @@ package org.apache.royale.jewel.beads.views
// columns
var listAreaClass:Class = ValuesManager.valuesImpl.getValue(host, "listAreaClass") as Class;
_listArea = new listAreaClass() as IUIBase;
+
+ _dg.height = 240;// must be the same as in CSS default (get from CSS)
_listArea.height = _dg.height - _header.height;
COMPILE::JS
{
- (_listArea as UIBase).element.style.top = _header.height + "px";
+ (_listArea as UIBase).positioner.style.top = _header.height + "px";
}
_dg.strandChildren.addElement(_listArea as IChild);
@@ -187,11 +189,24 @@ package org.apache.royale.jewel.beads.views
*/
protected function handleDataProviderChanged(event:Event):void
{
+ var presentationModel:IDataGridPresentationModel = _dg.presentationModel as IDataGridPresentationModel;
+
for (var i:int=0; i < _lists.length; i++)
{
var list:IDataGridColumnList = _lists[i] as IDataGridColumnList;
list.dataProvider = _sharedModel.dataProvider;
+
+ if(_sharedModel.dataProvider && _sharedModel.dataProvider.length * presentationModel.rowHeight < _dg.height)
+ {
+ (list as UIBase).positioner.style.height = "inherit";
+ _listArea.positioner.style.overflow = "hidden";
+ } else
+ {
+ (list as UIBase).positioner.style.height = null;
+ _listArea.positioner.style.overflow = null;
+ }
}
+
host.dispatchEvent(new Event("layoutNeeded"));
}
@@ -274,7 +289,7 @@ package org.apache.royale.jewel.beads.views
var dataGridColumn:IDataGridColumn = _sharedModel.columns[i] as IDataGridColumn;
var list:IDataGridColumnList = new columnClass();
- list.emphasis = (_dg as IEmphasis).emphasis;;
+ list.emphasis = (_dg as IEmphasis).emphasis;
if (i == 0)
{
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_datagrid.sass b/frameworks/projects/Jewel/src/main/sass/components/_datagrid.sass
index 560d60a..8707e0e 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_datagrid.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_datagrid.sass
@@ -23,7 +23,7 @@ $border-radius: .25rem
// DataGrid variables
.jewel.datagrid
width: 220px
- height: 220px
+ height: 240px
display: flex
position: relative
// overflow: hidden