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
