DEV Community

tonygeorgiev
tonygeorgiev

Posted on • Updated on

Introduction to Uno Platform

Alt text of image
Image resource from https://www.freecodecamp.org/news/uno-platform/

The Uno Platform is a Universal Windows Platform Bridge that allows UWP-based code (C# and XAML) to run on iOS, Android, and WebAssembly. Uno has been developed for around 5 years now. It’s an open-source project which tries to replicate the whole UWP API which comes from the Windows Platform. Most of the common controls on the UWP / WinUI platform are implemented, file access, sharing, map controls. Having the same UI across all platforms is really tricky but here Uno succeeds.

It’s able to pull off the controls to look native depending on whichever platform it’s running on but still using UWP behind the scenes to have the programming model.
The interesting part about UNO and the rendering is that its actually using the native controls so it’s not just some lookalike. Your code can be reused on iOS, Android and Web.

What makes Uno stand out?
Uno sits on top of Xamarin Classic (not to be confused with Xamarin Forms, which also sit on top of Xamarin Classic). In terms of similarities, Uno use pure version of Windows XAML, but in my opinion, the difference is the API. If the developer wants to use something, then the API is there and if it’s not there then he/she can implement it.

The difference between Xamarin Forms and Uno used to be that the latter is able to access the Web as well. However, with the release of version 2.0, Uno Platform now provides renderers for Xamarin Forms, which can help run Xamarin Forms on the web, similar to what Ooui used to do when that project was active.

Runtime
When building a UWP app, Uno runs on top of UWP and WinUI.
For the web, Uno is running on top of the mono runtime, the same runtime which Blazor uses. That’s because to execute C# code you need a runtime which allows to load libraries, has GC and so on. However, for mobile Uno runs on top of the Xamarin Native Stack.

Alt text of image
Image resource from https://www.freecodecamp.org/news/uno-platform/

Debugging
For iOS, Android, macOS, Uno is taking the debugger that mono provides, it’s just Visual Studio which breaks everything down and makes everything work.
For the web it is not a standard runtime it’s something that runs in the browser, basically the mono team implemented the chromium debugging protocol that allows injecting C# files in the chrome debugger. You can launch an app and in the browser, you are gonna have a second window that you are gonna see with a whole set of files that you can debug and put breakpoints in it and dive into. Not everything is there like watches and such, but you can have locals and the full stack trace which is mixed between js and C#. There are still some features missing like you can set breakpoints but you can’t expect values.

Uno Ecosystem
The interesting part about Uno is that the whole UWP API is available, so if somebody wants to create or reuse their code and make something work with Uno that’s possible. Taking the same code and compiling over the Uno and making it run on all those platforms, so it’s basically up to the developer to choose what to do with it.

3rd party providers are already implementing cool stuff of their own. Syncfusion is building business controls like charts, graphs, schedulers.

And with the announcement of Uno 2.0 Hot Reload for XAML is now a thing. The capability to Hot Reload XAML from your IDE while the app is running, will give you the potential to update the UI without rebuilding. The Hot Reload feature works on iOS, Android and WebAssembly. Although that feature is still in its preview version, the team over at Uno is actively working on it.

Getting started

Firstly let’s start by opening Visual Studio and installing UNO from Extensions > Manage Extensions
Search for ‘Uno Platform’

Download the Uno Platform Templates

After that you will need to restart Visual Studio

Once modified, open Visual Studio again.

Select ‘Cross-Platform App (Uno Platform)’ template and choose a name for your project

Your new solution is ready, you will find a project for Android, iOS, WASM and UWP
What’s important to note is that your main code will be in the Shared project

Now you’re all set to start writing your first Uno App!

In conclusion
The relatively new tech(WebAssembly) continues to justify the attention it is getting. Its offspring Uno Platform has many benefits that come along with it, just listing all of them deserves a separate article of its own. Web developers should take advantage of this rewarding-to-know tech, its low learning curve is nice and easy and would surely pay off at some point in the developers career.

Top comments (0)