Designing UIs for large screens and foldables
In recent years and with the release of Material 3, there has been an increased focus on tablets and foldable devices. As such, we, as developers, must make our apps work well on these devices. In this section, we will look at how we can make our apps work well on large screens and foldables. We need to ensure our apps adapt to the different screen sizes. Making our apps responsive provides a good user experience.
Material 3 offers canonical layouts to serve as guidelines for creating UIs for large screens and foldables. These layouts are as follows:
- List-detail view: Here, we place a list of items on the left and, on the right, we show the details of a single item.
- Feed: Here, we arrange content elements such as cards in a customizable grid, which provides a good view of a large amount of content.
- Supporting pane: Here, we organize app content into primary and secondary display areas. The primary area shows the main...