Uno Platform for Xamarin.Forms Developers

Uno Platform enables you to run your Xamarin.Forms apps in browsers via WebAssembly. Reuse your app business logic and expand your reach to web by executing one command line in Visual Studio Command Prompt.

WebAssembly Renderers Architecture

How It Works

Both Uno and Xamarin.Forms are built on top of the Xamarin Native stack. Xamarin.Forms runs on UWP via the Windows.UI.XAML APIs and the Uno Platform is an implementation of the UWP (and future WinUI) APIs.

When you build an application with Xamarin.Forms for UWP/WinUI under the hood Xamarin.Forms is initializing the controls of that platform. These controls can have basic styles applied to them via the Xamarin.Forms API. If you want to override this process and further customize the appearance, then that’s possible by using Custom Renderers. The ‘Uno.Xamarin.Forms.Platform’ NuGet package contains Xamarin.Forms Custom Renderers for WebAssembly via the Uno Platform.

Please note: If you are looking to use Uno Platform renderers for Xamarin.Forms, please make sure you are using Xamarin.Forms version 5 . For issues or to submit pull requests to advance this support, please see Uno Platform on GitHub.

Get Started

1. Create a Xamarin.Forms project

Check “Place project and solution in the same directory”
Check “Windows (UWP)”
Using a VS Developer Command Prompt, navigate to the folder containing the solution

2. Type the following to install the latest templates:

				
					dotnet new -i Uno.ProjectTemplates.Dotnet::*

3. Then type the following to create the new WebAssembly project:

				
					dotnet new wasmxfhead

4. Open or Reload the solution in Visual Studio

5. Set the WASM project as the startup project

6. Open the Nuget Package manager for the WASM project and update the Uno.Xamarin.Forms.Platform project to the latest experimental package

7. Run the app using Ctrl+F5 (without the Visual Studio debugger), and you’re good to go!

Sample Application

To showcase Uno Platform Renderers in action we ported Charles Petzold’s RPN calculator app built
with Xamarin Forms, available as a part of Xamarin Forms sample apps gallery.

See RPN Calculator on the web live or get sample code from our GitHub repo.

To run the sample RPN app simply follow steps above from the folder your RPN app is in.

Real-World Implementation

Quite a few Xamarin developers sent us samples of their apps now running in the browser. We love the
one Jonathan Dick from Xamarin team created for his Pool Math application.

Pool Math on Mobile