Google aims to make app development easier for large-screen devices
It’s a well-known fact that the Android experience on large-screen devices is far from perfect. Those who have used an Android tablet in the last few years would agree that Android doesn’t scale well on large displays. UI elements make poor use of all the extra screen real estate, and most apps are not optimized for the form factor. Google aims to change that with Android 12L. To help developers get their apps ready for the update, the company has shared new tools and guidelines.
At the Android Dev Summit today, Google announced new Material Design guidelines to help developers design adaptive apps that scale well on any screen size. The guidelines cover common layout patterns prevalent in the ecosystem to inspire developers and help them optimize their apps to behave nicely on both small and large screens. In addition, the guidelines outline how developers can provide the best possible navigation experience across screen sizes.
In a blog post, Google notes: “The recommended navigation patterns include using a navigation bar for compact screens and a navigation rail for medium-width device classes and larger (600dp+). For expanded-width devices, there are several ideas on larger screen layouts within our newly released Material Design guidance such as a List/Detail structure that can be implemented, using SlidingPaneLayout.”
It further adds, “While updating the navigation pattern and using a SlidingPaneLayout is a great way to apply a large screen optimized layout to an existing application with fragments, we know many of you have applications based on multiple activities. For those apps, the new activity embedding APIs released in Jetpack WindowManager 1.0 beta 03 make it easy to support new UI paradigms, such as a TwoPane view.”
Google also urges developers to use the Jetpack Compose toolkit to build the UI for their apps. The company explains that using Jetpack Compose can help developers easily optimize the UI, as all UI is described in code. This makes it easy to adjust it to the available screen size at runtime. If you’re interested in using Jetpack Compose, you can check out Google’s Build adaptive layouts in Compose guide to get started.
Google has introduced new WindowManager APIs to help developers build responsive UIs that adjust to any screen size. The WindowManage library provides a backward-compatible way to work with windows in your app and build responsive UI for all devices. It includes:
Activity embedding helps developers take advantage of the extra screen real estate on large-screen devices by showing multiple activities simultaneously. Using Activity embedding, developers can define how their apps display activities — side by side or stacked — by creating an XML configuration file or making Jetpack WindowManager API calls. Google claims that Activity embedding works seamlessly on foldable, stacking, and unstacking activities as the device folds and unfolds. You can try Activity Embedding APIs in Jetpack WindowManager 1.0 Beta 03 and later.
Window Size Classes
The new WindowSizeClass APIs define a set of opinionated viewport breakpoints to help developers design, develop and test resizeable app layouts. The Window Size Class breakpoints are split into three categories: compact, medium, and expanded. These categories are designed to balance layout simplicity and offer the flexibility to optimize apps for the most use cases. The WindowSizeClass APIs will be available in Jetpack WindowManager 1.1.
Make apps fold-aware
WindowManager also offers a common API surface for window features like folds and hinges. Developers can use the API to build fold-aware apps that automatically adapt to avoid folds and hinges or take advantage of them. Check out this guide to make your apps fold aware.
Android Studio changes
Google has introduced four new Reference devices in Android Studio to help developers build responsive apps that adapt to various screen sizes. These reference devices are available across tools where developers design, build and test the UI and layout of their apps. The four reference designs represent phones, large foldable inner displays, tablets, and desktops. Developers can also use these reference devices to ensure their apps work across popular WindowSizeClass breakpoints.
Google is working on a new tool in Android Studio Chipmunk to help developers identify potential issues impacting large screen devices. The visual linting tool proactively surfaces UI warnings and suggestions in Layout Validation and helps developers identify the affected reference devices.
Android Studio Chipmunk also brings a new resizable emulator that helps developers test UI scaling at runtime. The resizable emulator lets developers quickly switch between the four new reference devices and validate their app’s UI layout. To use the new resizable emulator, create a new Virtual Device using the Device Manager in Android Studio and select the Resizable device definition with Android 12L (API level 32).
Google Play on large screens
Lastly, Google has also announced some changes for Google Play on large screen devices like tablets and Chromebooks. The company has added new checks to assess each app’s quality against the new large screen app quality guidelines. Google Play will automatically recommend apps that pass this assessment on large screen devices and bring up a warning when an app isn’t optimized for large screens. In addition, Google will introduce large screen-specific app ratings on the Play Store. These changes will roll out next year.
For more information about user-facing changes coming in Android 12L, check out our announcement post.