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 2020/08/13 14:22:53 UTC
[royale-docs] branch master updated: add datacontainer start
This is an automated email from the ASF dual-hosted git repository.
carlosrovira pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/royale-docs.git
The following commit(s) were added to refs/heads/master by this push:
new ea0ac36 add datacontainer start
ea0ac36 is described below
commit ea0ac363371d478189ae55fdf81734922c3f026d
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Thu Aug 13 16:22:40 2020 +0200
add datacontainer start
---
component-sets/jewel/jewel-container.md | 8 ++---
component-sets/jewel/jewel-datacontainer.md | 47 +++++++++++++++++++++++++++--
2 files changed, 49 insertions(+), 6 deletions(-)
diff --git a/component-sets/jewel/jewel-container.md b/component-sets/jewel/jewel-container.md
index 1164322..8c980a5 100644
--- a/component-sets/jewel/jewel-container.md
+++ b/component-sets/jewel/jewel-container.md
@@ -30,7 +30,7 @@ Available since version __0.9.4__.
| Class | Extends | Implements |
|------------------------------ |---------------------------------- |--------------------------------- |
-| [org.apache.royale.jewel.Container](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/Container){:target='_blank'} | [Jewel ContainerBase](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.supportClasses.group/ContainerBase){:target='_blank'} | [org.apache.royale.core.IMXMLDocument](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IMXMLDocument){:target='_blank'} |
+| [org.apache.royale.jewel.Container](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/Container){:target='_blank'} | [Jewel ContainerBase](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.supportClasses.container/ContainerBase){:target='_blank'} | [org.apache.royale.core.IMXMLDocument](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IMXMLDocument){:target='_blank'} |
<sup>_Note: This component is currently only available for JavaScript._</sup>
@@ -64,12 +64,12 @@ In __MXML__ declare a `Container` like this:
In __ActionScript__ we can do the same in the following way:
```as3
-var Container:Container = new Container();
+var container:Container = new Container();
// add a button to the Container
var button:Button = new Button();
-Container.addElement(button);
+container.addElement(button);
// add the Container to the parent
-parent.addElement(Container);
+parent.addElement(container);
```
where `parent` is the container where the control will be added.
diff --git a/component-sets/jewel/jewel-datacontainer.md b/component-sets/jewel/jewel-datacontainer.md
index 7a26d66..c52942c 100644
--- a/component-sets/jewel/jewel-datacontainer.md
+++ b/component-sets/jewel/jewel-datacontainer.md
@@ -23,6 +23,49 @@ permalink: /component-sets/jewel/datacontainer
# Jewel DataContainer
-subtitle
-text
+## Reference
+
+Available since version __0.9.4__.
+
+| Class | Extends | Implements |
+|------------------------------ |---------------------------------- |--------------------------------- |
+| [org.apache.royale.jewel.DataContainer](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/DataContainer){:target='_blank'} | [Jewel ContainerBase](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.supportClasses.container/DataContainerBase){:target='_blank'} | [Jewel IListWithPresentationModel](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.supportClasses.list/IListWithPresentationModel){:target='_blank'} |
+
+<sup>_Note: This component is currently only available for JavaScript._</sup>
+
+## Overview
+
+The Jewel DataContainer class is a component that displays multiple data items.
+
+This component gets the data through its `dataProvider` property that receives an `ArrayList` of data objects. To represent each item the component use an [ItemRenderer](/features/item-renderers) class that can be configured and customized. The component generate dynamically as many instances of ItemRenderer as items in the data provider array and fill each instance with the appropiate data. By default it uses `StringItemRenderer` as the item renderer.
+
+By default items are layout vertically using Jewel `VerticalLayout`. This component has a `Viewport` that clip generated items.
+
+## Example of use
+
+In __MXML__ declare a `DataContainer` like this:
+
+```mxml
+<j:DataContainer width="100%" height="250">
+ <js:ArrayList localId="avengers" source="[Iron Man, Hulk, Thor, Captain America, Black Widow]"/>
+</j:DataContainer>
+```
+
+> Notice that we can nest the ArrayList directly to the DataContainer tag because "dataProvider" is its [DefaultProperty](features/as3/metadata#default-property).
+
+In __ActionScript__ we can do the same in the following way:
+
+```as3
+var dc:DataContainer = new DataContainer();
+dc.dataProvider = new ArrayList(["Iron Man", "Hulk", "Thor", "Captain America", "Black Widow", "Hawkeye"]);
+// add the Container to the parent
+parent.addElement(dc);
+```
+
+where `parent` is the container where the control will be added.
+
+## Relevant Properties and Methods
+
+> Check the Reference of [org.apache.royale.jewel.DataContainer](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/DataContainer){:target='_blank'} for a more detailed list of properties and methods.
+