Create distinctive experiences on Pixel’s new watches and foldables

Posted by Maru Ahues Bouza – Product Administration Director

Pixel simply introduced the most recent gadgets coming to the Android ecosystem, together with Pixel 9 Pro Fold and Pixel Watch 3. These gadgets carry innovation to the foldable and wearable areas, with bigger display screen sizes and distinctive efficiency.

Not solely are these gadgets thrilling for customers, however they’re additionally vital for builders to contemplate when constructing their apps. To arrange you for the brand new Pixel gadgets and all of the improvements in large screens and wearables, we’re diving into every little thing you could find out about constructing adaptive UIs, creating nice Put on OS 5 experiences, and enhancing your app for bigger watch shows.

Constructing for Pixel 9 Professional Fold with Adaptive UIs

Pixel unveiled their new foldable, Pixel 9 Professional Fold with Gemini, at Made By Google. This machine has the most important internal show on a telephone¹ and is 80% brighter than final 12 months’s Pixel Fold. When it’s folded, it’s identical to an everyday telephone, with a 6.3-inch entrance show. Customers have choices for tips on how to interact and multitask based mostly on the display screen they’re utilizing and the folded state of their machine – which means there are a number of totally different experiences that builders needs to be contemplating when constructing their apps.

Builders will help their app look nice throughout the 4 totally different postures – internal, entrance, tabletop, and tent – accessible on Pixel 9 Professional Fold by making their app adaptive. By dynamically adjusting their layouts—swapping elements and exhibiting or hiding content material based mostly on the accessible window dimension slightly than merely stretching UI parts—adaptive apps take full benefit of the accessible window dimension to offer an awesome consumer expertise.

When constructing an adaptive app, our core steering stays the identical – use WindowSizeClasses to outline particular breakpoints in your UI. Window dimension lessons allow you to vary your app structure because the show house accessible to your app adjustments, for instance, when a tool folds or unfolds, the machine orientation adjustments, or the app window is resized in multi‑window mode.

Announced at Google I/O 2024, we’ve launched APIs that, below the hood, make the most of these WindowSizeClasses for you. These APIs present a brand new approach to implement widespread adaptive layouts in Compose. The three elements within the library – NavigationSuiteScaffold, ListDetailPaneScaffold, and SupportingPaneScaffold – are designed that will help you construct an adaptive app with UI that appears nice throughout window sizes.

Lastly, builders who need to construct a really distinctive expertise for foldables ought to take into account supporting tabletop mode, the place the telephone sits on a floor, the hinge is in a horizontal place, and the foldable display screen is half opened. You need to use the Jetpack WindowManager library, leveraging FoldingFeature.State and FoldingFeature.Orientation to find out whether or not the machine is in tabletop mode. As soon as you understand the posture the machine is in, replace your app structure accordingly. For instance, media apps that adapt to tabletop mode sometimes present audio data or a video above the fold and embrace controls and supplementary content material slightly below the fold for a hands-free viewing or listening expertise.

Even video games are making use of foldable options: from racing video games like Asphalt Legends Unite and Disney Speedstorm to motion video games like Trendy Fight 5 and Dungeon Hunter 5, Gameloft optimized their video games so that you could play not simply in full-screen but in addition in split-view tabletop mode which gives a handheld sport console expertise. With useful options like detailed sport maps and enhanced controls for extra immersive gameplay, you’ll be drifting round corners, leveling up your character, and beating the dangerous guys in file time!

Making ready for Pixel Watch 3: Put on OS 5 and Bigger Shows

Pixel Watch 3 is the most recent smartwatch engineered by Google, designed for efficiency inside and outside. With this new machine, there are additionally new issues for builders. Pixel Watch 3 rings within the secure launch of Wear OS 5, the most recent platform model, and has the most important show ever from the Pixel Watch collection – which means builders ought to take into consideration the updates launched in Put on OS 5 and the way their UI will look on diversified show sizes.

Put on OS 5 is predicated on Android 14, so builders ought to be aware of the system habits adjustments particular to Android 14. The system consists of help for the privacy dashboard, giving customers a centralized view of the information utilization for all apps operating on Put on OS 5. For apps which have up to date their goal SDK model to Android 14, there are a number of extra adjustments. For instance, the system strikes always-on apps to the background after they’re seen in ambient mode for a sure time period. Moreover, watches that launch with Put on OS 5 or increased will solely help watch faces that use the Watch Face Format, so we suggest that builders migrate to utilizing the format. You may see all the behavior changes you must put together your app for.

One other vital consideration for builders is that the Pixel Watch 3 is on the market in two sizes, 41 mm and 45 mm. Each sizes provide extra show house than ever², having 16% smaller bezels, which supplies the 41 mm watch 10% extra display screen space and the 45 mm watch 40% extra display screen space than on the Pixel Watch 2! As a developer, evaluate and apply the rules on building adaptive layouts to offer customers an optimum expertise. We created instruments and steering on tips on how to develop apps and tiles for various display screen sizes. This steering will assist to construct responsive layouts on the wrist utilizing the most recent Jetpack libraries, and make use of Android Studio’s preview help and screenshot testing to substantiate that your app works nicely throughout all screens.

Study extra about all these thrilling updates within the Building for the future of Wear OS technical session, shared throughout this 12 months’s Google I/O occasion.

Study extra about tips on how to get began getting ready your app

With these new bulletins from Pixel, it’s a good time to ensure your app appears to be like nice on all of the screens your customers love most. Get your app ready for large screens by building adaptive layouts and study extra about all issues Put on OS on our Wear OS developer site. For sport builders, you should definitely learn our large screen game optimization guide and verify the sample project to study the perfect practices for leveling up your sport for big display screen and foldable gadgets.

For much more of the most recent from Android, tune into the Android Present on August twenty seventh. We’ll discuss Put on OS, adaptive apps, Jetpack Compose, and extra!

1 Amongst foldable telephones in the US. Primarily based on internal show. 

2 In contrast with Pixel Watch 2.