Hi Piotr,
looking at the screen shot, seems the required indicator is positioned to
the right side of the element, what seems coherent, although could be a bit
problematic depending on the width of the component. we assume a fixed
width (to the widest element) and align all required (or not a put the
required indicator just before the element, anyway this seems something to
be solved as we have some real implementation.
In order to implement it:
We have 3 parts:
- L (this is the label)
- * (this is the required indicator)
- C (this is the element(s) that the user adds)
* Actual FormItem is :
L * C
* We want for the new
L
C *
So it seems to me that
a) IBeadLayout: ClassReference(
"org.apache.royale.jewel.beads.layouts.HorizontalLayout")
Does not has much sense to me
b) IFormItemLayout: ClassReference(
"org.apache.royale.jewel.beads.layouts.VerticalLayout")
This is the one important to me (to configure), so user can change layout
of the content part
c) IBeadView: ClassReference(
"org.apache.royale.jewel.beads.views.FormItemView")
IFormItemContentArea: ClassReference("org.apache.royale.jewel.Group")
These are the parts important to me.
I think we really want to change only the IBeadView, so we can have a
FormItemView and a StackedFormItemView, and could change it vía className
(for example)
Let me know your thought about it
thanks
Carlos
El jue., 24 ene. 2019 a las 16:08, Piotr Zarzycki (<
[email protected]>) escribió:
> Carlos,
>
> I have analyzed FormItem in Flex and here is how it is done there.
> StackedFormItemSkin is using FormItemLayout which is constrained into 3
> columns (sequenceCol, contentCol and helpCol) and 2 rows. [1][2]
>
> When you look into the screenshot [2] you may think that reuired indicator
> is part of the content, but it's not. It's not even part of the layout
> cause it has includeInLayout="false". [3]
> In Royale we don't have concept that something doesn't belong to layout and
> is not calculated and indicator default is being placed in different area.
> Do you have some idea apart what I have proposed how to resolve that ?
>
> [1] https://paste.apache.org/9Imj
> [2] https://imgur.com/GGOtzEU
> [3] https://paste.apache.org/kqlP
>
> Thanks,
> Piotr
>
>
> śr., 23 sty 2019 o 18:08 Piotr Zarzycki <[email protected]>
> napisał(a):
>
> > That's more clear to me. I will check and get back to you.
> >
> > Thank you!
> >
> >
> > śr., 23 sty 2019 o 18:03 Carlos Rovira <[email protected]>
> > napisał(a):
> >
> >> No,
> >>
> >> I was asking you about how flex solves visualy the problem in their
> >> stacked
> >> version. The required icon is setup next to the label? is in other
> place?
> >> if we had an image of how it is designed (and like it), we can copy it.
> I
> >> still not proposing a technical solution. Just that I don't have clear
> how
> >> we should layout it
> >>
> >> El mié., 23 ene. 2019 a las 17:29, Piotr Zarzycki (<
> >> [email protected]>) escribió:
> >>
> >> > Carlos,
> >> >
> >> > Your suggestion is to have new form item (StackedFormItem) with new
> >> > StackedFormItemView - cause problem is inside FormitemView, not inside
> >> > layout itself. Current layout is doing what it should do - apart of
> the
> >> > problem - it's making children to be Horizontal/Vertical.
> >> >
> >> > If I'm correct what you are saying - that's ok, but if you have had
> >> > different idea by saying above let me know.
> >> >
> >> > Thanks, Piotr
> >> >
> >> > śr., 23 sty 2019 o 17:14 Carlos Rovira <[email protected]>
> >> > napisał(a):
> >> >
> >> > > Ok, I understand now.
> >> > >
> >> > > In Flex I think we had that layout and was called....StackedFormItem
> >> or
> >> > > something like that?
> >> > > Could you check how Flex solve this? If we continue liking the way
> >> > stacked
> >> > > form layout in flex looks, we can do the same for our Royale version
> >> > >
> >> > >
> >> > > El mié., 23 ene. 2019 a las 16:38, Piotr Zarzycki (<
> >> > > [email protected]>) escribió:
> >> > >
> >> > > > I'm not sure how Serkan is doing that on users forum, but I see
> all
> >> > hist
> >> > > > pasted images. Anyway here you go:
> >> > > >
> >> > > > What I wanted to achieve: https://snag.gy/DmH7yk.jpg
> >> > > > What I got from Jewel FormItem: https://snag.gy/Slfbt9.jpg
> >> > > >
> >> > > > śr., 23 sty 2019 o 16:28 Carlos Rovira <[email protected]>
> >> > > > napisał(a):
> >> > > >
> >> > > > > Piotr,
> >> > > > >
> >> > > > > remember that images pasted in list are not shared, you must
> share
> >> > with
> >> > > > > some image service
> >> > > > >
> >> > > > > El mié., 23 ene. 2019 a las 16:14, Piotr Zarzycki (<
> >> > > > > [email protected]>) escribió:
> >> > > > >
> >> > > > > > There is one more problem with Layout. Currently default in
> >> > framework
> >> > > > we
> >> > > > > > have [1]. It means that:
> >> > > > > >
> >> > > > > > My content of FormItem will be vertical and IBeadLayout is
> >> > basically
> >> > > > > > ignored at some point. If I specify beads - HorizontalLayout
> as
> >> it
> >> > is
> >> > > > in
> >> > > > > > above example it will be taken as a primary and I have my
> >> content
> >> > > > laying
> >> > > > > > out horizontally. The question is - what is for
> >> IFormItemLayout in
> >> > > > > > default.css? Is it a bug?
> >> > > > > >
> >> > > > > > [1] https://paste.apache.org/rV0K
> >> > > > > >
> >> > > > > > śr., 23 sty 2019 o 15:46 Piotr Zarzycki <
> >> [email protected]
> >> > >
> >> > > > > > napisał(a):
> >> > > > > >
> >> > > > > >> Hi Carlos,
> >> > > > > >>
> >> > > > > >> I'm was trying to change FormItem to be Vertical oriented. In
> >> > > general
> >> > > > I
> >> > > > > >> would like to have following view. Label of FormItem is on
> the
> >> top
> >> > > and
> >> > > > > in
> >> > > > > >> the bottom is content.
> >> > > > > >>
> >> > > > > >> [image: image.png]
> >> > > > > >>
> >> > > > > >> Code for that will looks like that [1]. Results is following:
> >> > > > > >>
> >> > > > > >> [image: image.png]
> >> > > > > >>
> >> > > > > >> It happened cause Label and required star label are different
> >> > > > components
> >> > > > > >> - everything is being laying out vertically. What is your
> >> > suggestion
> >> > > > to
> >> > > > > fix
> >> > > > > >> that ?
> >> > > > > >>
> >> > > > > >> Mine is wrapping "First name" and "*" into one Group with
> >> > > > > >> HorizontalLayout.
> >> > > > > >>
> >> > > > > >> More thoughts are welcome. I hope you see screenshots. :)
> >> > > > > >>
> >> > > > > >> [1] https://paste.apache.org/5odt
> >> > > > > >>
> >> > > > > >> Thanks,
> >> > > > > >> --
> >> > > > > >>
> >> > > > > >> Piotr Zarzycki
> >> > > > > >>
> >> > > > > >> Patreon: *https://www.patreon.com/piotrzarzycki
> >> > > > > >> <https://www.patreon.com/piotrzarzycki>*
> >> > > > > >>
> >> > > > > >
> >> > > > > >
> >> > > > > > --
> >> > > > > >
> >> > > > > > Piotr Zarzycki
> >> > > > > >
> >> > > > > > Patreon: *https://www.patreon.com/piotrzarzycki
> >> > > > > > <https://www.patreon.com/piotrzarzycki>*
> >> > > > > >
> >> > > > >
> >> > > > >
> >> > > > > --
> >> > > > > Carlos Rovira
> >> > > > > http://about.me/carlosrovira
> >> > > > >
> >> > > >
> >> > > >
> >> > > > --
> >> > > >
> >> > > > Piotr Zarzycki
> >> > > >
> >> > > > Patreon: *https://www.patreon.com/piotrzarzycki
> >> > > > <https://www.patreon.com/piotrzarzycki>*
> >> > > >
> >> > >
> >> > >
> >> > > --
> >> > > Carlos Rovira
> >> > > http://about.me/carlosrovira
> >> > >
> >> >
> >> >
> >> > --
> >> >
> >> > Piotr Zarzycki
> >> >
> >> > Patreon: *https://www.patreon.com/piotrzarzycki
> >> > <https://www.patreon.com/piotrzarzycki>*
> >> >
> >>
> >>
> >> --
> >> Carlos Rovira
> >> http://about.me/carlosrovira
> >>
> >
> >
> > --
> >
> > Piotr Zarzycki
> >
> > Patreon: *https://www.patreon.com/piotrzarzycki
> > <https://www.patreon.com/piotrzarzycki>*
> >
>
>
> --
>
> Piotr Zarzycki
>
> Patreon: *https://www.patreon.com/piotrzarzycki
> <https://www.patreon.com/piotrzarzycki>*
>
--
Carlos Rovira
http://about.me/carlosrovira
