In September 2019 at our inaugural UnoConf, we had released the preview of Uno Platform 2.0. Today we are announcing general availability of Uno Platform 2.0 which includes not only the features announced at UnoConf, but also many others.
One of the 2.0 release highlights is the fully functional XAML Hot Reload which works across Web (via WebAssembly), Android and iOS. Maybe best of all, you can do it ALL AT ONCE across all those platforms.
This first blog post in Uno Platform 2.0 Reloaded series will give a lot of detail about XAML Hot Reload as well as the rest of the release. In addition, over the next few days we will drip-feed dedicated blogs for a few other release highlights. That said, if you’d like to jump to the bulleted list of all new features, bug fixes and known issues, you can see it at our GitHub.
We are very proud of 2.0 release. Not only are we releasing a handful of major improvements, but we have also introduced over 70 smaller functionality improvements and we have closed over 80 bugs reported by community. Most importantly, over the past few months we saw massive contributions by the community, especially during Hacktoberfest. As of today we are humbled to have a very active contributor community of over 130 contributors! THANK YOU ALL for helping us make #WinUIEverywhere.
With that said, let’s look at what is in the release and also spend a lot more time on XAML Hot Reload.
What is XAML Hot Reload Anyway?
Simply put, XAML Hot Reload with Uno Platform and Visual Studio gives you the ability to design your app’s UI while the app is running, without the need to re-build your project. Here it is in action. For this example, we are using Uno Platform sample app UADO (Universal Azure DevOps Organizer). Note the simultaneous UI changes on both the web client as well as the native application running on iOS (/Android).
How does it Work Behind the Scenes?
The architecture of the Uno XAML Hot Reload is built on two parts: The RC Server side (Remote Control Server), and the RC Client side (Remote Control Client).
The developer side is .NET Core app that sits in between Visual Studio (or VS Code in the future) and the application.
The app side is a WebSockets client which connects back to the RC server, after having been provided with the addresses of the server through the Visual Studio addin. The choice of WebSockets is communication channel that works on iOS, Android and WebAssembly without restrictions, particularly around CORS and browsers.
Once the application has started, and the connection to the RC server has been established, every modification made one of the XAML files that the app uses, the new content is sent back the app. Every location where that file is being loaded in the app is being replaced by a new instance of that new XAML, showing you the new content. This means that reloading a UserControl does not reload the whole page that contains that control, make it the whole process faster!
There are some limitations to the current implementation:
- The code of a Page or UserControl constructor is not executed on reload
- Events in code-behind are not reassigned
- Standalone ResourceDictionary files cannot be updated
Code modifications are not reloaded, only XAML files are.
A more comprehensive list of known issues and limitations can be found here.
Next Steps
If you are new to the Uno Platform, you may want to run through the Getting Started tutorial. This will ensure you have the correct environment set up and that you have the latest release of Uno. If you have already worked with Uno, you may want to update your Uno package via your Visual Studio NuGet package manager.
If you’d like to try Hot Reload yourself, but with a smaller app you can try our QuickStart app. Try these simple steps:
- Import Uno QuickStart solution from our repo – https://github.com/unoplatform/Uno.QuickStart and verify it runs on your machine
- Build and run the WebAssembly app without the debugger. Keep it running.
- Build and run the iOS app without the debugger. Keep it running.
- Steps to make changes
- Go to file MainPage.xaml and change the Text attribute content
- Save the file
- Observe that both iOS and WebAssembly got updated
If you need more information please consult XAML Hot Reload docs, including the list of known issues. Stay tuned for more blog posts in Uno Platform 2.0 Reloaded series.
Jerome Laban, on behalf of complete Uno Platform team
CTO, Uno Platform. Microsoft MVP. https://twitter.com/jlaban
