The base component for the mxml is a FlexContainer.

I have attached it to this mail. You can have a look.


On Wed, Jan 12, 2022 at 4:19 PM Harbs <[email protected]> wrote:

> How are you assigning the ArrayList? What’s the base component for the
> MXML?
>
> You might need to add ContainerDataBinding.
>
> On Jan 12, 2022, at 5:08 PM, Roman Isitua <[email protected]> wrote:
>
> I have tested it again. No errors.
>
>
>
> On Wed, Jan 12, 2022 at 3:54 PM Harbs <[email protected]> wrote:
>
>> Do you get an error of some kind?
>>
>> On Jan 12, 2022, at 4:29 PM, Roman Isitua <[email protected]> wrote:
>>
>> Sorry, what I meant to say is that the arrayList does not render.
>>
>> For example when I use Array as follows
>>
>> <sp:FlexContainer className="home_side_area" wrap="false">
>>       <sp:Icon> </sp:Icon>
>>       <sp:Button text="Add New" flavor="cta"></sp:Button>
>>       <sp:List id="navLinks" className="home_side_nav" labelField=
>> "description" dataProvider="{menuItemList}"
>>        change="onSelectMenu(event)"/>
>>       <sp:Button text="Log Out" click="logOut(event)"></sp:Button>
>>   </sp:FlexContainer>
>>
>> The side menu renders
>>
>> <image.png>
>>
>>
>> However, when I use array List as follows
>>
>> <sp:FlexContainer className="home_side_area" wrap="false">
>>       <sp:Icon> </sp:Icon>
>>       <sp:Button text="Add New" flavor="cta"></sp:Button>
>>       <sp:List id="navLinks" className="home_side_nav" labelField=
>> "description"
>>       dataProvider="{newMenuItemList}" change="onSelectMenu(event)">
>>        <sp:beads>
>>            <js:ArrayListSelectionModel />
>>            <js:DataItemRendererFactoryForArrayList/>
>>         </sp:beads>
>>       </sp:List>
>>       <sp:Button text="Log Out" click="logOut(event)"></sp:Button>
>>   </sp:FlexContainer>
>>
>>
>> it does not render. see Below
>>
>> <image.png>
>>
>>
>>
>>
>>
>> On Wed, Jan 12, 2022 at 3:18 PM Harbs <[email protected]> wrote:
>>
>>>  It's not working.
>>>
>>>
>>> What’s not working?
>>>
>>> Did I apply it correctly ?
>>>
>>>
>>> Looks like it.
>>>
>>> Another question, which one do you use for your apps in production ?
>>>
>>>
>>> I usually use Arrays. The css code was copied from one of my apps which
>>> uses an ArrayList in a Spectrum List..
>>>
>>> On Jan 12, 2022, at 4:00 PM, Roman Isitua <[email protected]> wrote:
>>>
>>> I have attempted the second approach. It's not working. I am not sure I
>>> am applying it correctly. See how I defined it.
>>>
>>> <!-- <sp:FlexContainer className="home_side_area" wrap="false">
>>>       <sp:Icon> </sp:Icon>
>>>       <sp:Button text="Add New" flavor="cta"></sp:Button>
>>>       <sp:List id="navLinks" className="home_side_nav"
>>> labelField="description" dataProvider="{menuItemList}"
>>>        change="onSelectMenu(event)"/>
>>>       <sp:Button text="Log Out" click="logOut(event)"></sp:Button>
>>>   </sp:FlexContainer> -->
>>>
>>>   <sp:FlexContainer className="home_side_area" wrap="false">
>>>       <sp:Icon> </sp:Icon>
>>>       <sp:Button text="Add New" flavor="cta"></sp:Button>
>>>       <sp:List id="navLinks" className="home_side_nav" labelField=
>>> "description"
>>>       dataProvider="{newMenuItemList}" change="onSelectMenu(event)">
>>>        <sp:beads>
>>>            <js:ArrayListSelectionModel />
>>>            <js:DataItemRendererFactoryForArrayList/>
>>>         </sp:beads>
>>>       </sp:List>
>>>       <sp:Button text="Log Out" click="logOut(event)"></sp:Button>
>>>   </sp:FlexContainer>
>>>
>>>
>>> Note: in the commented out code above, I supplied an array. It works
>>> fine.
>>>
>>> Did I apply it correctly ?
>>>
>>> Another question, which one do you use for your apps in production ?
>>>
>>>
>>> On Wed, Jan 12, 2022 at 2:09 PM Harbs <[email protected]> wrote:
>>>
>>>> Any one of those three should work.
>>>>
>>>> On Jan 12, 2022, at 3:09 PM, Harbs <[email protected]> wrote:
>>>>
>>>> CSS:
>>>> #uploadsList{
>>>>   IBeadModel:
>>>> ClassReference("org.apache.royale.html.beads.models.ArrayListSelectionModel");
>>>>   IDataProviderItemRendererMapper:
>>>> ClassReference("org.apache.royale.html.beads.DataItemRendererFactoryForArrayList");
>>>> }
>>>>
>>>> MXML:
>>>>   <sp:beads>
>>>>     <js:ArrayListSelectionModel/>
>>>>     <js:DataItemRendererFactoryForArrayList/>
>>>>   </sp:beads>
>>>>
>>>> ActionScript:
>>>>   addBead(new ArrayListSelectionModel());
>>>>   addBead(new DataItemRendererFactoryForArrayList());
>>>>
>>>> On Jan 12, 2022, at 2:44 PM, Roman Isitua <[email protected]>
>>>> wrote:
>>>>
>>>> How can this be applied let say for example on an sp:List ? As a bead ?
>>>>
>>>>  Let's say I want to use arrayList  as data provider.
>>>>
>>>>
>>>> On Wed, 12 Jan 2022, 13:41 Harbs, <[email protected]> wrote:
>>>>
>>>>> Yes.The default IDataProviderItemRendererMapper is
>>>>> DataItemRendererFactoryForArrayData.
>>>>>
>>>>> If you are using collections you should
>>>>> use DataItemRendererFactoryForArrayList or
>>>>> DataItemRendererFactoryForCollectionView instead.
>>>>>
>>>>> HTH,
>>>>> Harbs
>>>>>
>>>>> On Jan 12, 2022, at 1:35 PM, Roman Isitua <[email protected]>
>>>>> wrote:
>>>>>
>>>>> Hence the reason, I need to confirm from Harbs the array data type
>>>>> that is supported in spectrum.
>>>>>
>>>>>
>>>>>
>>>>> On Tue, 11 Jan 2022, 21:33 Maria Jose Esteve, <[email protected]>
>>>>> wrote:
>>>>>
>>>>>> Hi,
>>>>>>
>>>>>> From what I see in the "ListModel.as" code it allows Object, IArray
>>>>>> and IArrayList.
>>>>>>
>>>>>>
>>>>>>
>>>>>> Hiedra
>>>>>>
>>>>>>
>>>>>>
>>>>>> *De:* Roman Isitua <[email protected]>
>>>>>> *Enviado el:* martes, 11 de enero de 2022 20:40
>>>>>> *Para:* [email protected]
>>>>>> *Asunto:* Re: Spectrum UI components
>>>>>>
>>>>>>
>>>>>>
>>>>>> It is now displaying. The issue was not related to the sp:List as I
>>>>>> initially thought.
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> <sp:Group>
>>>>>>
>>>>>>
>>>>>>
>>>>>> <sp:beads>
>>>>>>
>>>>>>         <js:ContainerDataBinding />
>>>>>>
>>>>>>     </sp:beads>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>   <sp:FlexContainer className="home_side_area" wrap="false">
>>>>>>
>>>>>>       <sp:Icon> </sp:Icon>
>>>>>>
>>>>>>       <sp:Button text="Add New" flavor="cta"></sp:Button>
>>>>>>
>>>>>>       <sp:List id="navLinks" className="home_side_nav" labelField=
>>>>>> "description" dataProvider="{menuItemList}"
>>>>>>
>>>>>>        change="onSelectMenu(event)"/>
>>>>>>
>>>>>>       <sp:Button text="Log Out" click="logOut(event)"></sp:Button>
>>>>>>
>>>>>>
>>>>>>   </sp:FlexContainer>
>>>>>>
>>>>>>
>>>>>>
>>>>>>    <sp:Container id="mainArea">
>>>>>>
>>>>>>       <sp:Label text="Overview area"></sp:Label>
>>>>>>
>>>>>>    </sp:Container>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> </sp:Group>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> I changed the parent component from flex container to group. Though
>>>>>> that had nothing to do  with the issue I was having.
>>>>>>
>>>>>>
>>>>>>
>>>>>> My current question
>>>>>>
>>>>>>
>>>>>>
>>>>>> is Array data type the only collection class that is supported in
>>>>>> spectrum ?
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> On Tue, Jan 11, 2022 at 6:30 PM Roman Isitua <[email protected]>
>>>>>> wrote:
>>>>>>
>>>>>> Hi,
>>>>>>
>>>>>>
>>>>>>
>>>>>> I am trying to populate my first List <sp:List> for some reason it is
>>>>>> not being populated. Here is my code snippet.
>>>>>>
>>>>>>
>>>>>>
>>>>>> <sp:beads>
>>>>>>
>>>>>>         <js:ContainerDataBinding />
>>>>>>
>>>>>>     </sp:beads>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>   <sp:FlexContainer className="home_side_area" wrap="false">
>>>>>>
>>>>>>       <sp:Icon> </sp:Icon>
>>>>>>
>>>>>>       <sp:Button text="Add New" flavor="cta"></sp:Button>
>>>>>>
>>>>>>       <sp:List id="navLinks" className="home_side_nav" dataProvider=
>>>>>> "{newMenuItemList}"
>>>>>>
>>>>>>       labelField="description" change="onSelectMenu(event)"/>
>>>>>>
>>>>>>       <sp:Button text="Log Out" click="logOut(event)"></sp:Button>
>>>>>>
>>>>>>       <sp:beads> <js:ContainerDataBinding />  </sp:beads>
>>>>>>
>>>>>>   </sp:FlexContainer>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> I have the following questions
>>>>>>
>>>>>> 1. what is the expected data provider ? Array,
>>>>>> or org.apache.royale.collections.ArrayList ?
>>>>>>
>>>>>> I have tried both none of them works.
>>>>>>
>>>>>>
>>>>>>
>>>>>> 2.  Did I register data binding correctly ?
>>>>>>
>>>>>> The above ui is wrapped by a FlexContainer.
>>>>>>
>>>>>>
>>>>>>
>>>>>> my data source is supposed to be an arrayList of data transfer
>>>>>> objects (MenuItemDTO) with get set functions for each field.
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> On Sat, Jan 8, 2022 at 5:47 PM Harbs <[email protected]> wrote:
>>>>>>
>>>>>> Use a <sp:PasswordField>
>>>>>>
>>>>>> > On Jan 8, 2022, at 4:34 PM, Roman Isitua <[email protected]>
>>>>>> wrote:
>>>>>> >
>>>>>> > Hi Harbs,
>>>>>> >
>>>>>> > I am trying to create a login form. How do I hide the password in
>>>>>> >
>>>>>> > <sp:TextField placeholder="Enter password"/>
>>>>>> >
>>>>>> >  could it be that it does not support password hiding ? Do I have
>>>>>> to resort to using royale basic text field ?
>>>>>>
>>>>>>
>>>>>
>>>>
>>>>
>>>
>>
>

Attachment: Home2.mxml
Description: Binary data

Reply via email to