Android foldable support on Uno Platform

Craig Dunn

Hello XAML developers!

The Uno Platform has supported Microsoft Surface Duo since early 2020 – the Uno Platform team even shared get started tips on this blog. This support was based on the DuoSDK NuGet, which exposes the Microsoft DisplayMask API in C#. The Uno Platform implements the TwoPaneView control on all supported platforms, and by adding the Uno.UI.DualScreen NuGet it will ‘light up’ on Surface Duo, detecting the hinge and laying out the two panes accordingly.

At UnoConf 2021 this week, we announced that we’ve been working with the Uno Platform team to support the new Jetpack Window Manager API and extend Uno’s foldable to support to other devices. The updated support replaces the old package and provides foldable enhancements for apps running on Surface Duo as well as other foldables that support Jetpack Window Manager.

Check out the Uno Platform 4.0 announcement blog and watch the conference recording below for more details:

Uno.UI.Foldable

The updated foldable support is available via the new Uno.UI.Foldable NuGet, which replaces the DualScreen NuGet in your Uno Platform projects. The new library implements the same interfaces as the earlier version, so no user-code changes are required – the hinge angle sensor and TwoPaneView control will both automatically work on foldable devices with Jetpack Window Manager support.

You can check out foldable Uno app samples on GitHub:

Screenshot of Uno Platform SamplesApp running on Surface Duo 2, showing the TwoPaneView test page
Figure 1: Uno Platform SamplesApp showing TwoPaneView

Screenshot of Uno Platform SimpleCalculator app running on Surface Duo 2 across both screens
Figure 2: SimpleCalculator enhanced with TwoPaneView

Contributing to the Uno Platform open-source project

Because the Uno Platform is open source (Apache 2.0 license), we were able to view and understand the existing implementation, and ultimately contribute updated code via GitHub. These are the steps we followed:

1. Create an issue

A great first step when contributing to any open-source project is to raise an issue to describe the bug you want to fix or the feature you’d like to add. This gives the project maintainers a chance to understand your suggestion, de-duplicate it from any other similar work, and provide you with tips, hints, or ideas about how to approach the code. Getting agreement and approval from maintainers ensures you are on the right track from the start!

The foldable update started with issue #6507 Update implementation to use Window Manager.

2. Build a prototype

To prove that Jetpack Window Manager library could be referenced from Uno applications, I created a simple prototype using a C# binding for the Java API. The WindowJava NuGet that exposes the Window Manager APIs in C# is itself built from an open-source project. The prototype contained two screens that test the hinge angle sensor, the folding feature detection, and the TwoPaneView API.

Prototype Jetpack Window Manager sample running on Surface Duo and another foldable device
Figure 3: FoldingFeature properties showing on Surface Duo and 7.6” folding emulator

Uno’s dependency injection meant that once I had implemented the existing IApplicationViewSpanningRects interface, the control automatically inherited the updated behavior and was able to detect the fold on devices and emulators beyond Surface Duo.

TwoPaneView sample running on Surface Duo and another foldable device
Figure 4: TwoPaneView showing on a Surface Duo and a 7.6” folding emulator

Building the prototype outside of the Uno Platform codebase proved to be a fast and easy way to validate the approach would work, and also exposed areas where Uno could be extended to make implementation easier (e.g. adding activity lifecycle events). You can view these discussions in the issue history.

3. Submit a pull request

Once the prototype was working and the overall approach agreed on with the maintainers, a fork and pull request was created #7365 feat: DualScreen support for multiple device models. Another best practice is to keep your contribution focused on the agreed features, ensuring the code you add is easy to read (adheres to project standards) and bug free! Avoid the temptation to move code around, apply a different coding style, or anything that isn’t directly related to your proposal – this makes it harder for the maintainers to understand, review, and ultimately accept your pull request.

When adding code to a project, it’s usually a good idea to also make sure you add tests according to the repo’s approach. In this case, since we were swapping out an implementation to an existing interface, there were conveniently already tests in place that could be used to validate the code.

Uno Platform continuous integration results (showing all passing tests)
Figure 5: Continuous integration results

Finally, getting the pull request approved for merging can take a few tries. Projects with sophisticated CI systems (like Uno) run builds and tests and can warn you of problems (and sometimes how to fix them). Once your implementation is done and you get green builds, use the pull request or issue discussion to communicate with the maintainers, get approval for your work, and see it merged into main!

Resources and feedback

Visit the UnoConf 2021 website to watch the session recordings, and use the feedback forum or message us on Twitter @surfaceduodev to share your app ideas or if you have any questions about building foldable apps with Uno, or any other platform.

Finally, please join us for our dual screen developer livestream at 11am (Pacific time) each Friday – mark it in your calendar and check out the archives on YouTube.

2 comments

Comments are closed. Login to edit/delete your existing comments

  • Masoud Moghaddam

    Hello
    I want to use Uno today.
    I have a question: does Microsoft not intend to combine Maui and Uno?

    • Craig DunnMicrosoft employee

      Hey Masoud,

      Uno Platform is an open-source platform sponsored by an independent company (NVentive).

      .NET MAUI is also open-source and is run by Microsoft.

      Uno supports the same XAML syntax and user interface that Windows developers are used to (WinUI). .NET MAUI uses a custom XAML syntax based on the Xamarin platform. They both use .NET and C# and support the key mobile platforms (Android and iOS) as well as Windows and other desktop platforms.

      As the platforms are maintained by different companies, they won’t be combined by Microsoft. I recommend choosing the platform based on your XAML preferences or perhaps if you have legacy code to migrate. There are also some differences in cross-platform targets (.NET MAUI and Uno Platform take different approaches to supporting website deployments, eg. via WASM).