- Dev Blogs
- Surface Duo Blog
Surface Duo Blog
Build great Android experiences, from AI to foldable and large-screens.
Latest posts

Snackbar for dual-screens
Hello Android developers! We are excited to announce the release of our latest Android component: SnackbarContainer. The new SnackbarContainer allows you to place a Snackbar on a specific display area on foldable devices, while keeping the original Snackbar behaviour in conventional single screen devices. The SnackbarContainer will help you to show a Snackbar at the bottom of the first screen, second screen, or across the entire display area. This additional flexibility allows you place the Snackbar where the user is currently focused to create a better user experience, especially on devices w...

Foldable ExoPlayer video… plus trivia

Hello Android developers! Video is an important element of many different types of mobile apps, including those designed for viewing TV and movie shows, livestreaming, social sharing, voice calling, meetings, training, and anything in-between. Large screen and foldable devices are ideal for this type of content because there’s more space to see the video and also to interact with the content and with others. Last year we shared two samples – Folding video and Folding video + chat – which demonstrate how to incorporate the ExoPlayer component into foldable layouts for Microsoft Surface Duo and ot...

Write foldable tests quickly with Test Kit

Hello Android developers! This week, we’re super excited to announce that we’ve released the first version of our foldable Test Kit. The Test Kit currently includes two testing utility libraries, one for layouts built with views and another for layouts built with Jetpack Compose, and we’re looking forward to adding more testing capabilities in the future! Library overview The goal of these testing libraries is to make it easier to write UI tests for foldables. We’ve included several different helper methods for creating mock folding features, simulating spanning gestures, and other useful uti...

Microsoft Surface Duo Android Emulator update

Hello Android developers, We’re excited to announce the release of an updated Surface Duo Emulator that is based on Android 11 and runs as an Android Virtual Device (AVD), supporting different screen sizes for both Surface Duo and Surface Duo 2 devices. Download now You can download the Surface Duo Emulator package from the Microsoft Download Center. We now support both Android 10 and Android 11 on Windows, Mac, and Linux platforms. You can choose the right one from the following list based on your development environment: Figure 1. Download file list in Microsoft Download Center As...

Microsoft Edge dual-screen web APIs
Hello dual-screen web developers! Microsoft Edge version 97 included the dual-screen web APIs that have been in preview since last year. Now Microsoft Surface Duo users with the latest Edge will get an enhanced web experience automatically when sites have implemented the CSS or JavaScript dual-screen APIs. Visit the dual-screen web documentation for more information on the APIs, as well as how to test on devices, emulators, and using desktop browser developer tools! Today’s post discusses the APIs you can use to adapt your content to dual-screen devices using either CSS or JavaScript. Dual-...

Jetpack Compose UI testing

Hello Jetpack Compose developers! We’re excited to announce that UI tests have been added to all our Compose samples! We learned a lot throughout the process of adding these tests, so we hope this week’s blog post makes it easier for you to start testing your own Compose layouts, especially when testing for compatibility with large screen and foldable devices. Compose testing basics Like with any other testing framework, the first step in writing UI tests with Compose is to import testing libraries and create an instrumented test class. For basic Compose tests, you need the following d...

Foldable Flutter follow-up

How else to start this article other than saying Hello Flutter developers! This is an update on the foldable support we are contributing to Flutter, along with samples and other goodies for you to try out. Before we dive in, here is a video presenting most of what you are about to read. This is from the Flutter Vikings conference which lasted for two days, but don't worry, our updates only take 30 minutes of your time. The last part of the video shows me enhancing an existing application. The current state of PRs In our last update, we invited you to have a look at the PRs we opened on the Flutter Framew...

Foldable Navigation component update
Hello Android developers! We’re excited to announce the release of our latest SDK component, Foldable Navigation Component, which is an extension of Jetpack Navigation Component and is now available for foldable devices. How to add Foldable Navigation Component to your project How it works Jetpack Navigation Component is a set of tools, libraries, and guidance to help developers create quality apps, simplifies the navigation between fragments or activities, and provides a way to visualize the navigation flow for the entire app. Instead of having only a single fragment on the display a...

Dual-screen app design walkthrough

Hello designers, This week we are excited to share with you our journey that inspires, educates, and showcases real world usage of various design patterns and provides designers a sense of exploring foldables with working examples of how to make use of the dual-screen/folding form factors in different ways when an application is spanning both displays. The experience of this sample application is centered around the needs of a travelling salesperson who visits various stores across the city that buy the salesperson’s products. The sample app helps the salesperson select and navigate to m...