I won't follow Flex, so if you would like to do this I'm fine. I'm going to
implement my own View in my application. I won't commit it to Royale.
However I would like to fix issue with layout. Currently IBeadLayout - Is
making whole FormItem vertical or horizontal. *IFormItemLayout - Should
treat content appropriately, but it doesn't do anything. I would like to
change it in the following way:*
*IBeadLayout do:*
*1) When user: IBeadLayout:
ClassReference("org.apache.royale.jewel.beads.layouts.VerticalLayout");*
L
C
*2) When user: **IBeadLayout:
ClassReference("org.apache.royale.jewel.beads.layouts.HorizontalLayout");*
*L C*
*IFormItemLayout will do:*
1) IFormItemLayout:
ClassReference("org.apache.royale.jewel.beads.layouts.HorizontalLayout");
and #1 - *IBeadLayout*
L
C - Set children Horizotnally
2) IFormItemLayout:
ClassReference("org.apache.royale.jewel.beads.layouts.HorizontalLayout");
and #2 - *IBeadLayout*
*L*
*C - Set children Vertically*
*Thoughts ?*
Piotr
pt., 25 sty 2019 o 16:13 Carlos Rovira <[email protected]> napisał(a):
> Ops!,
>
> ok, since I was using the other layout I was in the believe that was the
> standard. So if we want to follow flex, we can change the current as well.
>
> El jue., 24 ene. 2019 a las 18:34, Piotr Zarzycki (<
> [email protected]>) escribió:
>
> > Nope - I just checked [1] - Code [2] - You are showing me some custom
> > implementation.
> >
> > [1] https://imgur.com/INKlfcC
> > [2] https://paste.apache.org/jyrl
> >
> > czw., 24 sty 2019 o 18:20 Carlos Rovira <[email protected]>
> > napisał(a):
> >
> > > Piotr,
> > >
> > > in Flex we have the same align (as we have now in Royale), check this
> > > image: url
> > > <
> > >
> >
> https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=2ahUKEwi1uZfN9obgAhVFuVkKHeyzC0MQjRx6BAgBEAU&url=https%3A%2F%2Fbutterfliesandbugs.wordpress.com%2F2011%2F03%2F29%2Fusing-a-spark-form-with-validators%2F&psig=AOvVaw0vM1bn9Ehq9ZHLqtzJ-gc1&ust=1548436757385249
> > > >
> > >
> > > El jue., 24 ene. 2019 a las 18:03, Piotr Zarzycki (<
> > > [email protected]>) escribió:
> > >
> > > > If we are going in that direction it requires as well work were
> > indicator
> > > > in case of L* C (current implementation) will be changed to L C* -
> Yes
> > ?
> > > -
> > > > Being consistent it should be like that.
> > > >
> > > > I'm not sure what the trends are in that case.
> > > >
> > > > czw., 24 sty 2019 o 17:51 Carlos Rovira <[email protected]>
> > > > napisał(a):
> > > >
> > > > > Hi Piotr,
> > > > >
> > > > > since is what you show in the flex version.
> > > > > I think Adobe put side to content instead of side to label since
> the
> > > user
> > > > > fill the content elements and if not filled and required , the
> > tooltip
> > > > > should popup there.
> > > > > IOW, for usability, seems more appropriated the way flex layedout,
> or
> > > > seems
> > > > > more natural.
> > > > >
> > > > > El jue., 24 ene. 2019 a las 17:30, Piotr Zarzycki (<
> > > > > [email protected]>) escribió:
> > > > >
> > > > > > Carlos,
> > > > > >
> > > > > > Why you are proposing have that?
> > > > > >
> > > > > > L
> > > > > > C *
> > > > > >
> > > > > > I'm in favor of staying
> > > > > >
> > > > > > L *
> > > > > > C
> > > > > >
> > > > > > Thanks,
> > > > > > Piotr
> > > > > >
> > > > > > On Thu, Jan 24, 2019, 4:56 PM Carlos Rovira <
> > [email protected]
> > > >
> > > > > > wrote:
> > > > > >
> > > > > > > I forgot to mention about IBeadLayout more, since it could be
> > > > > > > misinterpreted:
> > > > > > >
> > > > > > > IBeadLayout for the global component is important, but what I'm
> > > > > > considering
> > > > > > > is that although we can put HorizontalLayout (for the current
> > > > > FormtItem)
> > > > > > > and VerticalLayout (for the stacked), I'm seeing that many
> > > components
> > > > > > would
> > > > > > > need its own layout class. In this case we could create a
> > > > > FormItemLayout,
> > > > > > > and this will handle the layout vía CSS as it happens mostly in
> > > many
> > > > > > other
> > > > > > > Jewel component.
> > > > > > >
> > > > > > > (Just say that some of them are using an standard layout class,
> > > like
> > > > > > > HorizontalLayout, or even a NullLayout class), since I didn't
> > have
> > > > the
> > > > > > time
> > > > > > > to create its own one, and that's temporal. But my plan is to
> > > create
> > > > a
> > > > > > > concrete layout for some of this components. FormItem could be
> > one
> > > of
> > > > > > those
> > > > > > > cases, for what we're seeing
> > > > > > >
> > > > > > >
> > > > > > >
> > > > > > >
> > > > > > >
> > > > > > > El jue., 24 ene. 2019 a las 16:50, Carlos Rovira (<
> > > > > > [email protected]
> > > > > > > >)
> > > > > > > escribió:
> > > > > > >
> > > > > > > > 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
> > > > > > > >
> > > > > > > >
> > > > > > >
> > > > > > > --
> > > > > > > Carlos Rovira
> > > > > > > http://about.me/carlosrovira
> > > > > > >
> > > > > >
> > > > >
> > > > >
> > > > > --
> > > > > 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>*