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 515ed43 finish datacontainer
515ed43 is described below
commit 515ed4320c5c47021efa8e97635c33134866883e
Author: Carlos Rovira <[email protected]>
AuthorDate: Thu Aug 13 16:57:21 2020 +0200
finish datacontainer
---
component-sets/jewel/jewel-datacontainer.md | 91 ++++++++++++++++++++++++++++-
1 file changed, 90 insertions(+), 1 deletion(-)
diff --git a/component-sets/jewel/jewel-datacontainer.md
b/component-sets/jewel/jewel-datacontainer.md
index c52942c..6ab3059 100644
--- a/component-sets/jewel/jewel-datacontainer.md
+++ b/component-sets/jewel/jewel-datacontainer.md
@@ -48,7 +48,7 @@ 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]"/>
+ <js:ArrayList localId="avengers" source="[Iron Man, Hulk, Thor, Captain
America, Black Widow, Hawkeye]"/>
</j:DataContainer>
```
@@ -69,3 +69,92 @@ where `parent` is the container where the control will be
added.
> 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.
+### Properties
+
+| PROPERTY | Type | Description
|
+|------------------- |--------------|
------------------------------------------------------------------------------------------------------|
+| __currentState__ | _String_ | The name of the current state.
|
+| __itemRenderer__ | _String_ | The class or factory used to display
each item. |
+| __labelField__ | _String_ | The name of field within the data
used for display. |
+| __dataProvider__ | _Object_ | The data being display by the List.
Is the [DefaultProperty](features/as3/metadata#default-property). In Jewel an
[ArrayList](https://royale.apache.org/asdoc/index.html#!org.apache.royale.collections/ArrayList){:target='_blank'}
|
+| __numElements__ | _int_ | The number of element children that can
be laid out. |
+| __states__ | _Array_ | The array of view states. These
should be instances of
[org.apache.royale.states.State](https://royale.apache.org/asdoc/index.html#!org.apache.royale.states/State){:target='_blank'}|
+| __strandChildren__ |
_[IParent](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IParent){:target='_blank'}_
| An object to access the immediate children of the strand. |
+
+### Methods
+
+| Method | Parameters
|Description |
+|----------------------|----------------------------------------------------------------|-------------------------------------------------------|
+| __addElement__ | c(IChild), dispatchEvent(Boolean=true)
| Add a component to the parent. |
+| __addElementAt__ | c(IChild), index(int), dispatchEvent(Boolean=true)
| Add a component to the parent at the specified index. |
+| __getElementIndex__ | c(IChild)
| Gets the index of this subcomponent. |
+| __getElementAt__ | index(int)
| Get a component from the parent at specified index. |
+| __removeElement__ | c(IChild), dispatchEvent(Boolean=true)
| Remove a component from the parent. |
+
+## Relevant Events
+
+The most important event is `initComplete`, which indicates that the
initialization of the container is complete.
+
+Is needed when some action coded in a callback function need to be triggered
as the data container is ready to use after initialization.
+
+You can attach callback listeners to the _initComplete_ event in __MXML__ as
follows:
+
+```mxml
+<j:DataContainer initComplete="initCompleteHandler(event)"/>
+```
+
+the _initComplete_ event will use the `initCompleteHandler` callback function
you provide in __ActionScript__:
+
+```mxml
+<fx:Script>
+ <![CDATA[
+ private function initCompleteHandler(event:Event):void {
+ trace("Container is ready!");
+ }
+ ]]>
+</fx:Script>
+```
+
+When the data container is initialized the message _"Container is ready!"_
appears in the console log.
+
+In __ActionScript__ we can add an event handler this way:
+
+```as3
+var dc:DataContainer = new DataContainer();
+dc.addEventListener('initComplete', initCompleteHandler);
+parent.addElement(dc);
+```
+
+## Relevant Beads
+
+| Bead Type | Implementation |
Description |
+|----------------- |------------------------------------------------
|------------------------------------------------ |
+|
[DataProviderModel](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.beads.models/DataProviderModel){:target='_blank'}
|
[org.apache.royale.core.IBeadModel](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IBeadModel){:target='_blank'}
| This is the default model bead. |
+|
[DataContainerView](https://royale.apache.org/asdoc/index.html#!org.apache.royale.html.beads/DataContainerView){:target='_blank'}
|
[org.apache.royale.core.IBeadView](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IBeadView){:target='_blank'}
| This is the default view bead. |
+|
[VerticalLayout](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.beads.layouts/VerticalLayout){:target='_blank'}
|
[org.apache.royale.core.IBeadLayout](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IBeadLayout){:target='_blank'}
| This is the default layout bead. |
+|
[DataItemRendererFactoryForCollectionView](https://royale.apache.org/asdoc/index.html#!org.apache.royale.html.beads/DataItemRendererFactoryForCollectionView){:target='_blank'}
|
[org.apache.royale.core.IDataProviderItemRendererMapper](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IDataProviderItemRendererMapper){:target='_blank'}
| Map data to itemrenders. |
+|
[ItemRendererClassFactory](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/ItemRendererClassFactory){:target='_blank'}
|
[org.apache.royale.core.IItemRendererClassFactory](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IItemRendererClassFactory){:target='_blank'}
| The factory of itemrenders. |
+|
[StringItemRenderer](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.itemRenderers/StringItemRenderer){:target='_blank'}
|
[org.apache.royale.core.IItemRenderer](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IItemRenderer){:target='_blank'}
| The itemrenders class to instantiate. |
+|
[DataContainerItemRendererInitializer](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.beads.itemRenderers/StringItemRenderer){:target='_blank'}
|
[org.apache.royale.core.IItemRendererInitializer](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IItemRendererInitializer){:target='_blank'}
| Configuration of itemrenders to instantiate. |
+|
[Viewport](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel.supportClasses/Viewport){:target='_blank'}
|
[org.apache.royale.core.IViewport](https://royale.apache.org/asdoc/index.html#!org.apache.royale.core/IViewport){:target='_blank'}
| Define the area that display content. |
+
+### Common Beads
+
+Jewel `DataContainer` can use any of the layout beads available in Jewel
library. Also you can check [Related
controls](component-sets/jewel/container.html#related-controls) section to see
some advanced or preconfigured data containers.
+
+## More examples
+
+* [Adding an item to a Jewel
List](https://royale.codeoscopic.com/adding-an-item-to-a-jewel-list/){:target='_blank'}
+* [Using an Item Renderer with a
List](https://royale.codeoscopic.com/using-an-item-renderer-with-a-list/){:target='_blank'}
+* [Using Jewel
TileHorizontalLayout](https://royale.codeoscopic.com/using-jewel-tilehorizontallayout/){:target='_blank'}
+
+## Related controls {#related-controls}
+
+Other useful Jewel containers components are:
+
+*
[DataGroup](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/DataGroup){:target='_blank'}
+*
[List](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/List){:target='_blank'}
+*
[DropDownList](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/DropDownList){:target='_blank'}
+*
[Table](https://royale.apache.org/asdoc/index.html#!org.apache.royale.jewel/Table){:target='_blank'}
+
+
