Enhancement request: Allow different gridRow and gridColumn values in sap.ui.layout.cssgrid.GridItemLayoutData depending on screen size (S, M, L, XL)

[JuanjoPP]

OpenUI5 version: 1.62.0

Browser/version (+device/version): Not browser dependent

Steps to reproduce the problem:

1. Try to specify a gridRow or gridColumn value in a GridItem of a CSS Grid that varies when the screen size (S M, L, XL) changes.

What is the expected result? The API should allow the developer to do this as it already does with the span for a Grid Item in sap.ui.layout.GridData

What happens instead? No such option exists

[niyap]

Hello @JuanjoPP ,

Thanks for sharing your findings. You could achieve the same result, using customLayout aggregation of sap.f.GridList. Here is a sample: https://openui5.hana.ondemand.com/#/sample/sap.f.sample.GridListBreakPoints/preview It is also implemented as an aggregation in the CSSGrid and could be used in the same way. Here is a sample: https://openui5.hana.ondemand.com/#/sample/sap.ui.layout.sample.GridResponsiveness/preview

Regards, Niya

[JuanjoPP]

Hello,

Yes, you can set different layouts per screen size to the entire grid, this is obvious.

But you cannot do it to a single element in the grid. In this example:

Suppose that I wanted to make the element A and only that element to occupy 4 columns if we move from size L to size M. Currently there is no way to do this as far as I know.

This is something that can be done in sap.ui.layout.GridData, but not sap.ui.layout.cssgrid.GridItemLayoutData (note that this is why I referenced this class instead of sap.ui.layout.cssgrid.CSSGrid, since that one already has these options).

[niyap]

Hello @JuanjoPP ,

Thank you for share your enhancement proposal. I've created an feature request 1979 . The status of the issue will be updated here in GitHub.

Regards, Niya

[sblessing]

Hey there!

What is the current status of this feature request? The GridResponsiveLayout is very basic, and is basically not useable for grids that have items of different sizes.

I think this would be a major improvement to being able to write responsive applications in UI5.

Best, Sebastian

[olannyv]

Hi,

No, the https://sapui5untested.int.sap.eu2.hana.ondemand.com/#/api/sap.ui.layout.cssgrid.GridResponsiveLayout%23constructor applies to the whole CSS grid.

For individual CSS grid items, the flexibility is to configure number of allocated rows and columns per-item via GridItemLayoutData - but those are NOT responsive

We would need to discuss this with UX/VD responsible (which is tricky nowadays)