Ok David, So think on Grid as a "row", then you add inside GridCells, 1 per column Since you want 3 columns on desktop and tablet you must put the numerator/denominator for both to 1/3 while for mobile will be 1/1 ok? That's just for main responsiveness of columns in different devices Now you need to add to each GridCell the content. As I said, don't use FormItem for now, use here HGroup or VGroup and inside a Label and a control.
You need to start playing with it to see how it looks and then start to find the best layout that fits what you want. You'll see that responsiveness is a world itself, but the main thing is to try to find a few things that work for your use case. HTH El vie, 12 feb 2021 a las 11:06, David Slotemaker de Bruine (< [email protected]>) escribió: > Hi Carlos, > > Thanks, yes I meant column instead of row. I will have a look at the > examples you sent and try them out! > > David > > On Fri, 12 Feb 2021 at 10:10, Carlos Rovira <[email protected]> > wrote: > >> Hi David, >> >> First, please avoid FormItem use for now, I still need to do a major >> refactor since the actual layout is not ok from many points of view. As a >> temporal solution you can yse better a VGroup or HGroup for now. >> >> HorizontalFlow should be only be used for layouts like "tag clouds" or >> similar where you want to "cascade" things to the next row or column, but >> gaps are not usable for that kind of layout. TileHorizonalLayout is a >> better implementation since is based on Flex Tile Layout and I think works >> ok. I used it here [1] >> >> About "I would like the form take up 2 (or 3 rows) on the desktop and 1 >> on Mobile.", maybe you want to say "columns" instead of "rows"? >> >> About Grid/GridCell. Please check this [2]. >> >> About hiding columns in DataGrid, check [3] at the end "Column >> swapping", to remove a column or add it. So I think you could combine with >> a "ResponsiveResizeListener" in order to add/remove columns at a certain >> screen break point (mobile, tablet, desktop,...) >> >> HTH >> >> Carlos >> >> [1] https://github.com/codeoscopic/avant2-website >> [2] https://github.com/apache/royale-asjs/issues/1070 >> [3] https://royale.apache.org/tourdejewel/#!datagrid_panel >> >> >> >> El jue, 11 feb 2021 a las 17:24, David Slotemaker de Bruine (< >> [email protected]>) escribió: >> >>> Hi All, >>> >>> The app I am building has a lot of states and most states contain a >>> large form, I am using Jewel. >>> >>> I would like to have a app header and footer and I would like the form >>> take up 2 (or 3 rows) on the desktop and 1 on Mobile. >>> >>> Looking at Tour de Jewel I see that there is a HorizontalFlow and >>> HorizontalTile Containers, also the example seems to use a GridCell tag >>> with some properties: >>> >>> <j:GridCell desktopNumerator="1" desktopDenominator="2" >>> tabletNumerator="1" tabletDenominator="2" phoneNumerator="1" >>> phoneDenominator="1"> >>> >>> are these specific to different user system (desktop, tablet, mobil)? >>> How does it work? >>> >>> I tried putting the FormItems first in aHorizontalFlow and then in a >>> HorizontalTile container, but didn't get the result I wanted (nothing >>> flowed). I then tried putting the FormItems in two different Card >>> Containers and this flowed well, but when there was a lot of horizontal >>> space available the cards didn't expand to fill them. >>> >>> Below some of the forms is a Datagrid, is there a way to hide columns >>> based on the size of the screen? >>> >>> Any pointers? >>> >>> Cheers, >>> >>> David >>> >> >> >> -- >> >> Carlos Rovira >> >> Presidente Ejecutivo >> >> M: +34 607 22 60 05 >> >> http://www.codeoscopic.com >> >> >> AVISO LEGAL: La información contenida en este correo electrónico, y en su >> caso en los documentos adjuntos, es información privilegiada para uso >> exclusivo de la persona y/o personas a las que va dirigido. No está >> permitido el acceso a este mensaje a cualquier otra persona distinta a los >> indicados. Si Usted no es uno de los destinatarios, cualquier duplicación, >> reproducción, distribución, así como cualquier uso de la información >> contenida en él o cualquiera otra acción u omisión tomada en relación con >> el mismo, está prohibida y puede ser ilegal. En dicho caso, por favor, >> notifíquelo al remitente y proceda a la eliminación de este correo >> electrónico, así como de sus adjuntos si los hubiere. En cumplimiento de la >> legislación española vigente en materia de protección de datos de carácter >> personal y del RGPD 679/2016 le informamos que sus datos están siendo >> objeto de tratamiento por parte de CODEOSCOPIC S.A. con CIF A85677342, con >> la finalidad del mantenimiento y gestión de relaciones comerciales y >> administrativas. La base jurídica del tratamiento es el interés legítimo de >> la empresa. No se prevén cesiones de sus datos, salvo que exista una >> obligación legal. Para ejercitar sus derechos puede dirigirse a CODEOSCOPIC >> S.A., domiciliada en Paseo de la Habana, 9-11, 28036 de Madrid (MADRID), o >> bien por email a [email protected], con el fin de ejercer sus derechos >> de acceso, rectificación, supresión (derecho al olvido), limitación de >> tratamiento, portabilidad de los datos, oposición, y a no ser objeto de >> decisiones automatizadas, indicando como Asunto: “Derechos Ley Protección >> de Datos”, y adjuntando fotocopia de su DNI. Delegado de protección de >> datos: [email protected] >> >> > > -- > > *David Slotemaker de Bruïne* > *Head of Educational Robotics* > > > > Av. Sarriá, 130 - 08017 Barcelona > <https://maps.google.com/?q=Av.+Sarri%C3%A1,+130+-+08017+Barcelona&entry=gmail&source=g> > > > T. +34 932 523 729 ext. 135 > > [email protected] > -- Carlos Rovira Apache Member & Apache Royale PMC *Apache Software Foundation* http://about.me/carlosrovira
