Hot Reload
The Uno Platform Hot Reload feature provides a way to modify the XAML and C# of your running application, in order to iterate faster on UI or code changes. This makes the inner developer loop faster.
Features
- Supported in Visual Studio 2022 (Windows), VS Code (Linux, macOS, Windows, CodeSpaces, and GitPod) and Rider (Linux, macOS, Windows)
- XAML and C# Markup Hot Reload for iOS, Catalyst, Android, WebAssembly, and Skia (X11, Windows, macOS and FrameBuffer)
- All C# of Hot Reload in both Visual Studio and VS Code. See supported code changes.
- Simulator and physical devices support
- Hot Reload Indicator visuals for an enhanced development experience on Uno Platform targets
- What can be Hot Reloaded:
- XAML files in the main project and referenced projects libraries
- C# Markup controls
- Bindings
- Full x:Bind expressions
- App.xaml and referenced resource dictionaries
- DataTemplates
- Styles
- Extensible State restoration
- Support for partial tree hot reload, where modifying a
UserControl
instantiated in multiple locations will reload it without reloading its parents
Hot Reload features vary between platforms and IDE, you can check below the list of currently supported features.
How to use Hot Reload
- Setup your environment by following our getting started guides.
- Start your application (with or without the debugger, depending on the supported features below)
- Make changes to your XAML or C# code, save your file then press the red flame icon in the toolbar or use
Alt+F10
Important
Using .NET 8 or later (net8.0
in the TargetFrameworks
property) is required for Hot Reload to be available when your solution contains iOS, Android, Mac Catalyst, or WebAssembly project heads. On Windows, Visual Studio 17.8 or later is required.
Supported features per OS
Visual Studio | VS Code | Rider | ||||
---|---|---|---|---|---|---|
Target | C# | XAML | C# | XAML | C# | XAML |
Desktop Windows | ✅🐞 | ✅🐞 | ✅🐞 | ✅🐞 | ✅ | ✅ |
Desktop/WSL | ⌛[1] | ⌛[1] | ✅ | ✅ | 🔳[2] | 🔳[2] |
iOS | ⌛[3] | ✅[4] | ⌛[3]🛜 | ✅[4]🛜 | 🔳 | 🔳 |
Android | ⌛[3] | ✅[4] | ⌛[3] | ✅[4] | ⌛[3] | ✅[4] |
WinAppSDK | ✅[5]🐞 | ✅🐞 | 🔳 | 🔳 | 🔳 | 🔳 |
WebAssembly | ✅🐞 | ✅🐞 | ✅ | ✅ | ✅ | ✅ |
Catalyst | 🔳 | 🔳 | ⌛[3]🛜 | ✅[4]🛜 | 🔳 | 🔳 |
Legend:
- ✅ Supported
- 🐞 Supported with the debugger
- ⌛ Upcoming support
- 🛜 Supported through SSH to a Mac
- 🔳 Not supported by the environment/IDE
Notes
- [1]: Support is pending support in the .NET SDK.
- [2]: Support is not available.
- [3]: C# Hot Reload is affected by a .NET Runtime issue.
- [4]: XAML Hot Reload is using the XAML Reader, pending C# Hot Reload update and a VS/VS Code update.
- [5]: C# Markup Hot Reload is supported when running in Unpackaged mode only
Supported features per Platform
Skia-based targets provide support for full XAML Hot Reload and C# Hot Reload. There are some restrictions that are listed below:
- The Visual Studio 2022 for Windows support is fully available, with and without running under the debugger
- As of VS 2022 17.9 XAML or C# Hot Reload under WSL is not supported
- VS Code
- With the debugger: The C# Dev Kit is handling hot reload when enabled. As of December 20th, 2023, C# Dev Kit hot reload does not handle class libraries. To experience the best hot reload, do not use the debugger.
- Without the debugger: The VS Code Uno Platform extension is handling Hot Reload (C# or XAML)
- Adding new C# or XAML files to a project is not yet supported
- Rider
- Hot Reload is only supported without the debugger.
- Adding new C# or XAML files to a project is not yet supported
Hot Reload Indicator
Hot Reload displays a visual indicator to help you further monitor changes while developing. It displays new information every time Hot Reload is triggered. The indicator is enabled by default within the UseStudio()
method which is located in the root App.xaml.cs
file. This displays an overlay which hosts the visual indicator. If you wish to disable it, you simply have to provide the following boolean: EnableHotReload(disableIndicator: true)
, removing the overlay from the view.
Tip
The overlay can be moved by using the anchor on the left hand side.
The indicator displays the current connection status. Clicking on it will open a flyout containing all events or changes that were applied by Hot Reload. These events display more details about Hot Reload changes, such as its status and impacted files.
Statuses
Here's a summary of what icons and statuses you can expect:
Connection:
Success
Failed
Warning (Usually indicates an issue that can be solved by restarting your IDE)
Operation:
Success
Failed
Processing (Hot Reload is processing the changes or initializing)
Troubleshooting
Observe the application logs, you should see diagnostics messages in the app when a XAML file is reloaded.
WinAppSDK on Windows-specific issues
- Grid Succinct syntax is not supported
You can troubleshoot hot reload further from the DevServer client running in the app by:
- Setting
builder.SetMinimumLevel(LogLevel.Information)
toLogLevel.Debug
orTrace
- Setting
builder.AddFilter("Uno.UI.DataBinding.BinderReferenceHolder", LogLevel.Debug )
toLogLevel.Debug
orTrace
The diagnostics messages will appear in the app's debug output.
- Setting
If you're getting
ENC0003: Updating 'attribute' requires restarting the application
, add the following in theDirectory.Build.props
(or in each csproj project heads):<PropertyGroup> <!-- Required for Hot Reload (See https://github.com/unoplatform/uno.templates/issues/376) --> <GenerateAssemblyInfo Condition="'$(Configuration)'=='Debug'">false</GenerateAssemblyInfo> </PropertyGroup>
Also make sure that you're not referencing
Microsoft.SourceLink.*
packages.If you're getting the
Unable to access Dispatcher/DispatcherQueue
error, you'll need to update your app startup to Uno 5 or later:Add the following lines to the shared library project
csproj
file :<ItemGroup> <PackageReference Include="Uno.WinUI.DevServer" Version="$UnoWinUIVersion$" Condition="'$(Configuration)'=='Debug'" /> </ItemGroup>
Note
If your application is using the UWP API set (Uno.UI packages) you'll need to use the
Uno.UI.DevServer
package instead.Then, in your
App.cs
file, add the following:using Uno.UI; //... in the OnLaunched method #if DEBUG MainWindow.UseStudio(); #endif
Next Steps
Learn more about:
- Uno Platform features and architecture
- Uno Platform App solution structure
- Troubleshooting
- List of views implemented in Uno for the set of available controls and their properties.
- You can head to How-tos and tutorials on how to work on your Uno Platform app.