[data grid] View rows side-by-side in List View.

[TheOneTheOnlyJJ]

Summary

I want to be able to view Data Grid rows side-by-side in List View mode. This would allow me to better illustrate rows that emphasize an image rather than the data itself while getting all the pagination/filtering benefits of the Data Grid.

Examples

This image illustrates exactly what I'm trying to achieve. Instead of "Product" I would have Cards with dynamic content based on the data.

Motivation

While the List View mode allows placing more emphasis on the individual rows, I would like to place more of these emphasized rows in a single view while maintaining the versatility of the List View. My target devices are desktops, and having List View rows stretch the entire screen is a waste of space. The best solution would be to have List View rows side-by-side in a grid pattern, like in the image above.

If there are already ways to solve this, please point me to them.

Search keywords: data grid list view rows side by

[michelengelen]

The overall purpose of the list view is to make the grid data be accessible for mobile devices. If you are targeting desktop devices you should probably try a different component like the ImageList.

[TheOneTheOnlyJJ]

The overall purpose of the list view is to make the grid data be accessible for mobile devices. If you are targeting desktop devices you should probably try a different component like the ImageList.

The docs are not clear about supporting Card as ImageListItem components. Also, there is no built-in pagination, sorting or filtering on the ImageList. I've opened this issue with this example in mind, as this is the design I'm aiming for. The utility of allowing more columns to be displayed for larger screens would be great.

[michelengelen]

All right ... I will handle this as a feature request then! 👍🏼