Hi Carlos,

This one gave me a lot of trouble but it's now working as expected.

Accordion seems to be tied to the bead TitleBarModel that adds a title to
the Accordion ItemRenderer.
Not very flexible.

I extended TitleBarModel to IconTitleBarModel and add a string property for
the MaterialIcon.
Then I created an ItemRenderer that extends from AccordionItemRenderer and
add the MaterialIcon at the first position and played with Spacer.
The final result was what I wanted.

I already checked the Jewel List before started with basic Accordion
however for my menu I need a look and feel more like Accordion than a List.
With a lot of css this Accordion is now pixel perfect as I wanted.

Thank you.

Carlos Rovira <[email protected]> escreveu no dia quarta, 15/07/2020
à(s) 15:53:

> Hi Hugo,
>
> don't understand the problem completely, but if you want to add something
> to a model just extend it and use the extension
> But model should only have the data, not the visuals.
> Don't know much more about Basic Accordion
> Other option is to use a List and create an item renderer that collapse
>
> El mié., 15 jul. 2020 a las 2:38, Hugo Ferreira (<[email protected]>)
> escribió:
>
> > How to add an icone to TitleBarModel, or even better, how to apply an
> > itemrenderer:
> >
> > <js:Container id="panel1" width="100%">
> > <js:beads>
> > <js:TitleBarModel title="Panel 1" />
> > <js:VerticalLayout />
> > </js:beads>
> > <js:Label text="Top Line 1" className="menuItem" />
> > <js:Label text="Middle Line 1" className="menuItem" />
> > <js:Label text="Last Line 1" className="menuItem" />
> > </js:Container>
> >
> > The goal is to build my own menu based on Accordion.
> >
>
>
> --
> Carlos Rovira
> http://about.me/carlosrovira
>

Reply via email to