Cross-Platform C# UI Technologies

There are several UI technologies that can be used to build Cross-Platform apps in C# or other .NET based languages such as Visual Basic (VB). This article looks at three technologies and discusses which cases these technologies could be used for. This article will give you a baseline understanding of technologies that are available for building front-end applications in C#, and will answers questions like which platforms are available? Can it run in a browser? Will it have a native look and feel? And, can it be deployed to the app stores?

 

Background

.NET Framework is a technology that was created in the early 2000s primarily for Windows desktop apps. The main two languages at the time were C# and VB. These languages are compiled to Common Intermediate Language (CIL – formerly known as Microsoft Intermediate Language MSIL). At the time, the main competitor to .NET as a technology was Java which is a similar to .NET but was designed for Cross-Platform compatibility from the ground up. Java included the cross-platform UI framework Swing.  Soon after the release of .NET, the Monoplatform was released in 2004. This framework allowed CIL libraries to be compiled and run on platforms like Linux. However, UI technologies like Windows Forms built on .NET could not be run on other platforms because they relied on native components of the Windows operating system. The Mono platform evolved and several UI components were created for each platform, but no single Cross-Platform UI component became a de facto standard. Microsoft does not push any one UI technology as the answer for all platforms.

Modern Ecosystem

Things have changed a lot since the early days of .NET. There are now at least five major operating systems that people use on a daily basis: Windows (desktop/tablet), MacOS (desktop), Android (phone/tablet), iOS (phone/tablet), Linux (mostly desktop). There are also a raft of other platforms to drive devices like wristwatch and TV components such as Tizen. The deployment mechanism for apps is also quickly changing with the advent of App Stores. The standard method of deploying apps to phones is now via the various App Stores, and people are coming to expect that their phones and tablets be able to run the same applications that their desktops run.

Security is now a huge consideration when it comes to app development deployment. Desktops are lagging behind phones in that many applications still require the user to download the application as an installer and then install manually. This is a colossal problem and any developer that ignores this issue does so at their own peril. If a user is forced to download apps from the internet, they are being exposed to Malware, losing control of application level permissions,  and opening their computers up to spyware and so on that is not vetted by any authority. As users become more savvy, less and less will tolerate this situation and will opt for apps that are deployed via the App Stores or in a browser.

The point is this: your app needs to be deployed in a secure way, and you need do so on as many platforms as possible.

Modern Runtimes: Mono/Xamarin, .NET Core, Web Assembly

Xamarin is a company whose engineers originally created the Mono platform to run CIL across many platforms. In 2016 Xamarin was acquired by Microsoft. They still maintain the Mono platform which allows C# code to be run on iOS, Android and other platforms. Xamarin is often used as a synonym for Mono but Xamarin is also a suite of CIL libraries that drive apps on non Windows platforms.

.NET Core is a modern desktop runtime environment which is heavily based on .NET Framework for operating systems like MacOS, Linux and Windows. Since its inception, several UI frameworks have been built on top of the Mono platform so the ability to build front-end applications that run across platforms has become a reality. Some of these UI frameworks also run on Mono. This means that the ability to build apps which are pixel perfect in similarity across platforms is now a possibility.

Web Assembly (wasm) cannot be overlooked. It is an emerging technology built in to browsers and supported by the W3C. This technology essentially allows a developer to compile code that can be run inside a browser in a way that is as safe to run as JavaScript. Most importantly, it is a language independent “binary instruction format for a stack-based virtual machine”. C# can be compiled to this instruction format, and therefore a new world of UI capabilities is opened up for C# developers. C# code can be run inside a browser in a similar way to Silverlight which is now defunct.

XAML also requires a mention here. XAML is the markup language that is used to declaritively define UI across most C# based UI frameworks. The three platforms mentioned here all support XAML. XAML is to C# what HTML is to JavaScript. However, XAML goes a lot further than HTML in that it includes styling like CSS, but also extremely powerful data binding out of the box.

Here are the UI technologies based on these runtimes.

Uno Platform

Image Source

Note: corrections have been made to this section

Uno Platform is an open source XAML based UI library and platform that runs on iOS, Android, and Web Assembly. It renders to native controls, but attempts to emulate the Windows UWP graphics library on non Windows 10 platforms. It has a modern Windows 10 look and feel by default but can be easily customized with XAML styling.

“Universal Windows Platform Bridge to allow UWP based code to run on iOS, Android, and WebAssembly”.

https://github.com/nventive/Uno

Platforms: iOS, Android, WebAssembly, Windows (As UWP)

App Stores: Apple Store, Google Play, Microsoft Store (When compiled with UWP)

Render Type: Native. The behavior of controls remain as they do on the native platform, however, by default, controls will be styled like a Windows 10 app and be close to pixel perfect the same. Styling can be changed to appear more like the native platform though.

Xamarin.Forms

Image Source

Xamarin.Forms is an open source XAML based toolkit which supports Android, iOS, Windows UWP, preview MacOS out of the box, and will probably include Linux support in future. It is a phone driven UI technology but bridges the gap between phone, tablet and desktop by rendering declarative XAML out to native UI components.

Xamarin.Forms exposes a complete cross-platform UI toolkit for .NET developers. Build fully native Android, iOS, and Universal Windows Platform apps using C# in Visual Studio.

https://docs.microsoft.com/en-us/xamarin/xamarin-forms/

Platforms: iOS, Android, Tizen, Windows (As UWP). Other platforms are in preview.

App Stores: Apple Store, Google Play, Microsoft Store

Render Type: Native. An app built for iOS will look and behave like an iOS app. An Android app will look and behave like an Android app.

Avalonia

Image Source

Avalonia is an open source XAML based UI library and platform that runs on Windows, Linux, and MacOS. It is heavily based on the Windows WPF UI framework. As such, it is mainly targeted for desktop usage and will probably not be a good fit for mobile applications.

We support Windows, Linux and OSX with experimental mobile support for Android and iOS.

http://avaloniaui.net/

Platforms: Windows, Linux, and MacOS, and experimental support for iOS, and Android. The technology is mainly .NET Core based.

App Stores: Unknown. It will probably possible to release an Avalonia app via the App Stores. But, currently there is no clear documentation or pathway for doing this.

Render Type: Pixel Perfect. The platform takes control of rendering and does not rely on native components to render.

How To Choose

Do you need browser support?

If so, Uno Platform is probably the clear winner here. It’s the only platform that supports Wasm from the ground up. Building an app with browser support from the ground up is a good choice because it guarantees maximum penetration. Users do not have to download an app from the App Store to use your app, and they are protected from Malware.

Note: Xamarin.Forms and Uno Platform can work together.

Do you need native look and feel?

If so, Xamarin.Forms may be a good choice. Like Uno platform, Xamarin.Forms allows UIs to be defined declaratively across platforms but renders the UI based on the native platform. So, the user will not be shocked by controls that do not behave in the platform specific way. By default, the styles approximate the platform’s native look and feel while Uno Platform tends to look more like Windows 10. However, both Xamarin.Forms, and Uno Platform can be styled for their native platforms.

Xamarin.Forms currently has the full support of Microsoft so there is guaranteed support for the near future. However, Uno Platform is an extremely impressive platform that is certainly a worthy competitor for Xamarin.Forms. If you are going to build a native app, you need to try out both Uno Platform and Xamarin.Forms to see what suits your project best.

Are you targeting desktop with users who will download applications outside of App Stores?

This is in a sense, a rhetorical question. As mentioned earlier, you shouldn’t really expect your users to download apps outside of the store or browser. However, there are legitimate cases where your users may prefer a custom fit desktop experience that is pixel perfect across Linux, Windows, and MacOS with all the power of the .NET Core runtime. When this is the case, Avalonia is your best bet.

As a UI library though, Avalonia should not be underestimated. It will be familiar to any WPF developer, and is very easy to get running and dive straight in. The .NET Core runtime makes it a very powerful platform to build upon.