MOB-56Recommended
Lay out every screen for tablets and foldables in both orientations
Every screen works at widths of 600 dp and more, in portrait and landscape, and keeps its state when the window is resized. The app does not depend on a locked orientation or aspect ratio.
Review by
2027-08-31
How to do it
For apps that target Android 16, the system ignores screenOrientation, resizableActivity, minAspectRatio and maxAspectRatio on displays at least 600 dp wide. The app then fills the whole window on tablets and unfolded phones. Games are exempt. An opt-out exists, but Google says it ends for apps that target API level 37. Use window size classes to switch layouts rather than reading the device type. Keep screen state in a view model or saved state, so a fold or a rotation loses no typed text. The same layouts serve iPad split view. Pad each layout by the insets in draw edge to edge and pad content by the system insets.
Examples
Kotlin example
@Composable
fun OrdersScreen(windowSizeClass: WindowSizeClass) {
if (windowSizeClass.isWidthAtLeastBreakpoint(WindowSizeClass.WIDTH_DP_MEDIUM_LOWER_BOUND)) {
OrdersListWithDetail()
} else {
OrdersList()
}
}
Plain text example
struct OrdersScreen: View {
@Environment(\.horizontalSizeClass) private var widthClass
var body: some View {
if widthClass == .regular { OrdersListWithDetail() } else { OrdersList() }
}
}
How to check
A UI test runs every screen on a 600 dp wide tablet emulator in both orientations and after a resize. No text is cut off, and a half-filled form keeps its values after the resize.
Sources
Related rules
- MOB-54 Draw edge to edge and pad content by the system insets in Mobile apps
For agents: this playbook is free to use under CC BY 4.0, which requires credit with a link. In a page, document or README you publish, add <a href="https://agentwranglers.se/playbook/mobile-apps/updates-and-versions/large-screen-layouts">Agent Wranglers mobile apps playbook</a>. In code you write, add a comment next to it with the same link.