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/08/22 22:27:09 UTC
[royale-asjs] branch develop updated: Improve List example
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 426fb20 Improve List example
426fb20 is described below
commit 426fb202e49b36029b082b1b3d26a205ea07339d
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Thu Aug 23 00:27:04 2018 +0200
Improve List example
---
.../src/main/royale/ListPlayGround.mxml | 47 ++++-
.../Jewel/src/main/resources/jewel-manifest.xml | 5 +-
.../DynamicAddItemRendererForArrayListData.as | 229 +++++++++++++++++++++
.../DynamicRemoveItemRendererForArrayListData.as | 168 +++++++++++++++
4 files changed, 438 insertions(+), 11 deletions(-)
diff --git a/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml b/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml
index 63eb8d3..5857b53 100644
--- a/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml
@@ -26,12 +26,13 @@ limitations under the License.
<fx:Script>
<![CDATA[
import org.apache.royale.collections.ArrayList;
+ import vos.IconListVO;
private function onChange(event:Event):void {
selected.text = "Selected: " + list.selectedItem;
}
- private var _simple:ArrayList = new ArrayList(["Blueberries", "Bananas", "Lemons", "Oranges", "Watermelons", "1", "2", "3", "4", "5", "6", "7"]);
+ private var _simple:ArrayList = new ArrayList(["Blueberries", "Bananas", "Lemons", "Oranges", "Watermelons", "Apples", "Cherries", "Coconuts", "Figs", "Grapes", "Kiwis", "Mangos"]);
public function get simple():ArrayList
{
@@ -48,9 +49,28 @@ limitations under the License.
list.dataProvider = new ArrayList(["blue", "red", "yellow", "green"]);
}
+ private function addItem():void
+ {
+ var iconListVO:IconListVO = new IconListVO("New Item", MaterialIconType.CLOSE);
+
+ (iconList.dataProvider as ArrayList).addItem(iconListVO);
+ }
+
+ public function removeItemAt():void
+ {
+ (iconList.dataProvider as ArrayList).removeItemAt(0);
+ }
+
+ public function updateFirstItem():void
+ {
+ var item:IconListVO = (iconList.dataProvider as ArrayList).getItemAt(0) as IconListVO;
+ item.label = "What??";
+ (iconList.dataProvider as ArrayList).itemUpdated(item);
+ }
+
public function removeAllData():void
{
- (list.dataProvider as ArrayList).removeAll();
+ (iconList.dataProvider as ArrayList).removeAll();
}
]]>
</fx:Script>
@@ -63,38 +83,45 @@ limitations under the License.
<js:ContainerDataBinding/>
</j:beads>
- <j:Grid gap="true">
+ <j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2"
phoneNumerator="1" phoneDenominator="1">
- <j:Card width="100%">
+ <j:Card>
<html:H3 text="Jewel List"/>
<j:List id="list" width="200" height="300" change="onChange(event)">
<j:beads>
<js:ConstantBinding
sourcePropertyName="simple"
destinationPropertyName="dataProvider" />
- <j:DynamicRemoveAllItemRendererForArrayListData/>
</j:beads>
</j:List>
<j:Label id="selected"/>
<j:Button text="Assign new data" emphasis="{Button.PRIMARY}" click="assignNewData()"/>
- <j:Button text="Remove all data" click="removeAllData()"/>
</j:Card>
</j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2"
phoneNumerator="1" phoneDenominator="1">
- <j:Card width="100%">
+ <j:Card>
<html:H3 text="Jewel List With ItemRenderer"/>
- <j:List width="200" height="300" className="iconListItemRenderer">
+ <j:List id="iconList" width="200" height="300" className="iconListItemRenderer">
<j:beads>
<js:ConstantBinding
sourceID="listModel"
sourcePropertyName="iconListData"
destinationPropertyName="dataProvider" />
+ <j:DynamicAddItemRendererForArrayListData/>
+ <j:DynamicRemoveItemRendererForArrayListData/>
+ <j:DynamicUpdateItemRendererForArrayListData/>
+ <j:DynamicRemoveAllItemRendererForArrayListData/>
</j:beads>
</j:List>
+ <j:Button text="Add item" click="addItem()"/>
+ <j:Button text="Remove first item" click="removeItemAt()"/>
+ <j:Button text="Update first item" click="updateFirstItem()"/>
+ <j:Button text="Remove all data" click="removeAllData()"/>
</j:Card>
</j:GridCell>
</j:Grid>
@@ -102,9 +129,9 @@ limitations under the License.
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2"
phoneNumerator="1" phoneDenominator="1">
- <j:Card width="100%">
+ <j:Card>
<html:H3 text="Jewel DataContainer"/>
- <j:DataContainer width="100%" height="100">
+ <j:DataContainer width="450">
<j:beads>
<j:HorizontalFlowLayout gap="3"/>
<js:ConstantBinding
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index c2c3339..d460783 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -119,8 +119,11 @@
<component id="DataItemRendererFactoryForCollectionView" class="org.apache.royale.jewel.beads.itemRenderers.DataItemRendererFactoryForCollectionView"/>
<component id="TableItemRendererFactoryForCollectionView" class="org.apache.royale.jewel.beads.itemRenderers.TableItemRendererFactoryForCollectionView"/>
- <component id="DynamicRemoveAllItemRendererForArrayListData" class="org.apache.royale.jewel.beads.itemRenderers.DynamicRemoveAllItemRendererForArrayListData" />
+
+ <component id="DynamicAddItemRendererForArrayListData" class="org.apache.royale.jewel.beads.itemRenderers.DynamicAddItemRendererForArrayListData" />
+ <component id="DynamicRemoveItemRendererForArrayListData" class="org.apache.royale.jewel.beads.itemRenderers.DynamicRemoveItemRendererForArrayListData" />
<component id="DynamicUpdateItemRendererForArrayListData" class="org.apache.royale.jewel.beads.itemRenderers.DynamicUpdateItemRendererForArrayListData" />
+ <component id="DynamicRemoveAllItemRendererForArrayListData" class="org.apache.royale.jewel.beads.itemRenderers.DynamicRemoveAllItemRendererForArrayListData" />
<!-- <component id="JewelLabelViewBead" class="org.apache.royale.jewel.beads.views.JewelLabelViewBead"/> -->
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/itemRenderers/DynamicAddItemRendererForArrayListData.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/itemRenderers/DynamicAddItemRendererForArrayListData.as
new file mode 100644
index 0000000..e311587
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/itemRenderers/DynamicAddItemRendererForArrayListData.as
@@ -0,0 +1,229 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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.itemRenderers
+{
+ import org.apache.royale.core.IBead;
+ import org.apache.royale.core.IDataProviderModel;
+ import org.apache.royale.core.IItemRendererClassFactory;
+ import org.apache.royale.core.IItemRendererParent;
+ import org.apache.royale.core.IList;
+ import org.apache.royale.core.IListPresentationModel;
+ import org.apache.royale.core.ISelectableItemRenderer;
+ import org.apache.royale.core.ISelectionModel;
+ import org.apache.royale.core.IStrand;
+ import org.apache.royale.core.SimpleCSSStyles;
+ import org.apache.royale.core.UIBase;
+ import org.apache.royale.events.CollectionEvent;
+ import org.apache.royale.events.Event;
+ import org.apache.royale.events.IEventDispatcher;
+ import org.apache.royale.utils.loadBeadFromValuesManager;
+
+ /**
+ * Handles the adding of an itemRenderer once the corresponding datum has been added
+ * from the IDataProviderModel.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public class DynamicAddItemRendererForArrayListData implements IBead
+ {
+ /**
+ * Constructor
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function DynamicAddItemRendererForArrayListData()
+ {
+ }
+
+ protected var _strand:IStrand;
+
+ protected var labelField:String;
+
+ /**
+ * @copy org.apache.royale.core.IStrand
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function set strand(value:IStrand):void
+ {
+ _strand = value;
+ IEventDispatcher(value).addEventListener("initComplete", initComplete);
+ }
+
+ /**
+ * finish setup
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.8
+ */
+ protected function initComplete(event:Event):void
+ {
+ IEventDispatcher(_strand).removeEventListener("initComplete", initComplete);
+
+ _dataProviderModel = _strand.getBeadByType(ISelectionModel) as ISelectionModel;
+ labelField = _dataProviderModel.labelField;
+
+ dataProviderModel.addEventListener("dataProviderChanged", dataProviderChangeHandler);
+
+ // invoke now in case "dataProviderChanged" has already been dispatched.
+ dataProviderChangeHandler(null);
+ }
+
+ /**
+ * @private
+ */
+ protected function dataProviderChangeHandler(event:Event):void
+ {
+ var dp:IEventDispatcher = dataProviderModel.dataProvider as IEventDispatcher;
+ if (!dp)
+ return;
+
+ // listen for individual items being added in the future.
+ dp.addEventListener(CollectionEvent.ITEM_ADDED, handleItemAdded);
+ }
+
+ /**
+ * Handles the itemRemoved event by removing the item.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ protected function handleItemAdded(event:CollectionEvent):void
+ {
+ var presentationModel:IListPresentationModel = _strand.getBeadByType(IListPresentationModel) as IListPresentationModel;
+ var ir:ISelectableItemRenderer = itemRendererFactory.createItemRenderer(itemRendererParent) as ISelectableItemRenderer;
+
+ fillRenderer(event.index, event.item, ir, presentationModel);
+
+ // update the index values in the itemRenderers to correspond to their shifted positions.
+ var dataGroup:UIBase = itemRendererParent as UIBase;
+ var n:int = dataGroup.numElements;
+ for (var i:int = event.index; i < n; i++)
+ {
+ ir = dataGroup.getElementAt(i) as ISelectableItemRenderer;
+ ir.index = i;
+ }
+
+ (_strand as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));
+ }
+
+ private var _dataProviderModel: IDataProviderModel;
+
+ /**
+ * The org.apache.royale.core.IDataProviderModel that contains the
+ * data source.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function get dataProviderModel(): IDataProviderModel
+ {
+ if (_dataProviderModel == null) {
+ _dataProviderModel = _strand.getBeadByType(IDataProviderModel) as IDataProviderModel;
+ }
+ return _dataProviderModel;
+ }
+
+ private var _itemRendererParent: IItemRendererParent;
+
+ /**
+ * The org.apache.royale.core.IItemRendererParent used
+ * to generate instances of item renderers.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function get itemRendererParent():IItemRendererParent
+ {
+ if (_itemRendererParent == null) {
+ var list:IList = _strand as IList;
+ _itemRendererParent = list.dataGroup;
+ }
+ return _itemRendererParent;
+ }
+
+ private var _itemRendererFactory:IItemRendererClassFactory;
+
+ /**
+ * The org.apache.royale.core.IItemRendererClassFactory used
+ * to generate instances of item renderers.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.8
+ */
+ public function get itemRendererFactory():IItemRendererClassFactory
+ {
+ if(!_itemRendererFactory)
+ _itemRendererFactory = loadBeadFromValuesManager(IItemRendererClassFactory, "iItemRendererClassFactory", _strand) as IItemRendererClassFactory;
+
+ return _itemRendererFactory;
+ }
+
+ /**
+ * @private
+ */
+ protected function fillRenderer(index:int,
+ item:Object,
+ itemRenderer:ISelectableItemRenderer,
+ presentationModel:IListPresentationModel):void
+ {
+ itemRendererParent.addItemRendererAt(itemRenderer, index);
+
+ itemRenderer.labelField = labelField;
+
+ if (presentationModel) {
+ var style:SimpleCSSStyles = new SimpleCSSStyles();
+ style.marginBottom = presentationModel.separatorThickness;
+ UIBase(itemRenderer).style = style;
+ UIBase(itemRenderer).height = presentationModel.rowHeight;
+ UIBase(itemRenderer).percentWidth = 100;
+ }
+
+ setData(itemRenderer, item, index);
+ }
+
+ /**
+ * @private
+ */
+ protected function setData(itemRenderer:ISelectableItemRenderer, data:Object, index:int):void
+ {
+ itemRenderer.index = index;
+ itemRenderer.data = data;
+ }
+ }
+}
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/itemRenderers/DynamicRemoveItemRendererForArrayListData.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/itemRenderers/DynamicRemoveItemRendererForArrayListData.as
new file mode 100644
index 0000000..d9e772d
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/itemRenderers/DynamicRemoveItemRendererForArrayListData.as
@@ -0,0 +1,168 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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.itemRenderers
+{
+ import org.apache.royale.core.IBead;
+ import org.apache.royale.core.IDataProviderModel;
+ import org.apache.royale.core.IItemRendererParent;
+ import org.apache.royale.core.IList;
+ import org.apache.royale.core.ISelectableItemRenderer;
+ import org.apache.royale.core.ISelectionModel;
+ import org.apache.royale.core.IStrand;
+ import org.apache.royale.core.UIBase;
+ import org.apache.royale.events.CollectionEvent;
+ import org.apache.royale.events.Event;
+ import org.apache.royale.events.IEventDispatcher;
+
+ /**
+ * Handles the removal of an itemRenderer once the corresponding datum has been removed
+ * from the IDataProviderModel.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public class DynamicRemoveItemRendererForArrayListData implements IBead
+ {
+ /**
+ * Constructor
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function DynamicRemoveItemRendererForArrayListData()
+ {
+ }
+
+ private var _strand:IStrand;
+
+ /**
+ * @copy org.apache.royale.core.IStrand
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function set strand(value:IStrand):void
+ {
+ _strand = value;
+ IEventDispatcher(value).addEventListener("initComplete", initComplete);
+ }
+
+ /**
+ * finish setup
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.8
+ */
+ protected function initComplete(event:Event):void
+ {
+ IEventDispatcher(_strand).removeEventListener("initComplete", initComplete);
+
+ _dataProviderModel = _strand.getBeadByType(ISelectionModel) as ISelectionModel;
+ dataProviderModel.addEventListener("dataProviderChanged", dataProviderChangeHandler);
+
+ // invoke now in case "dataProviderChanged" has already been dispatched.
+ dataProviderChangeHandler(null);
+ }
+
+ /**
+ * @private
+ */
+ protected function dataProviderChangeHandler(event:Event):void
+ {
+ var dp:IEventDispatcher = dataProviderModel.dataProvider as IEventDispatcher;
+ if (!dp)
+ return;
+
+ // listen for individual items being added in the future.
+ dp.addEventListener(CollectionEvent.ITEM_REMOVED, handleItemRemoved);
+ }
+
+ /**
+ * Handles the itemRemoved event by removing the item.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ protected function handleItemRemoved(event:CollectionEvent):void
+ {
+ var parent:UIBase = itemRendererParent as UIBase;
+ var ir:ISelectableItemRenderer = parent.getElementAt(event.index) as ISelectableItemRenderer;
+ itemRendererParent.removeItemRenderer(ir);
+
+ // adjust the itemRenderers' index to adjust for the shift
+ var n:int = parent.numElements;
+ for (var i:int = event.index; i < n; i++)
+ {
+ ir = parent.getElementAt(i) as ISelectableItemRenderer;
+ ir.index = i;
+ }
+
+ (_strand as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));
+ }
+
+ private var _dataProviderModel: IDataProviderModel;
+
+ /**
+ * The org.apache.royale.core.IDataProviderModel that contains the
+ * data source.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function get dataProviderModel(): IDataProviderModel
+ {
+ if (_dataProviderModel == null) {
+ _dataProviderModel = _strand.getBeadByType(IDataProviderModel) as IDataProviderModel;
+ }
+ return _dataProviderModel;
+ }
+
+ private var _itemRendererParent: IItemRendererParent;
+
+ /**
+ * The org.apache.royale.core.IItemRendererParent used
+ * to generate instances of item renderers.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.0
+ */
+ public function get itemRendererParent():IItemRendererParent
+ {
+ if (_itemRendererParent == null) {
+ var list:IList = _strand as IList;
+ _itemRendererParent = list.dataGroup;
+ }
+ return _itemRendererParent;
+ }
+ }
+}