Public Preview of XAML Hot Reload for Xamarin.Forms

Alex Corrado

1/8/2020: XAML Hot Reload is now stable in both Visual Studio and Visual Studio for Mac! Learn more about it in our documentation.

As a developer, we often get into a cycle of running an app, noticing that some adjustment needs to be made, stopping the app, estimating the adjusted values, and then repeating the whole process over again to see if the estimate was correct. We call this the “inner development loop,” and it can quickly become quite tedious.

Public Preview of XAML Hot Reload for Xamarin.Forms

A few days ago, we announced the release of the latest Visual Studio and Visual Studio for Mac previews. One of the exciting new features included in this release is a public preview of XAML Hot Reload for Xamarin.Forms. We hope this feature will dramatically speed up your inner development loop when working with Xamarin.Forms XAML. XAML Hot Reload instantly reflects changes you make in your running app, without requiring you to stop and rebuild.

Here’s an example of Hot Reload in action:

Enabling XAML Hot Reload

See the documentation for XAML Hot Reload for Xamarin.Forms at https://aka.ms/XAMLHotReloadDocs.

As a preview feature, XAML Hot Reload for Xamarin.Forms is currently disabled by default when you first update to the latest preview of Visual Studio 2019 or Visual Studio 2019 for Mac. Follow these steps to enable it:

1. Ensure you have installed the latest version of Visual Studio that includes XAML Hot Reload:
   • Visual Studio 2019 16.3
   • Visual Studio 2019 for Mac 8.3
2. Enable Xamarin XAML Hot Reload in the settings screen:
   • On Windows, XAML Hot Reload can be enabled by checking the Enable Xamarin Hot Reload checkbox at: Tools > Options > Xamarin > Hot Reload.    
   • On a Mac, XAML Hot Reload can be enabled by checking the Enable Xamarin Hot Reload checkbox at: Visual Studio > Preferences > Projects > Xamarin Hot Reload.
3. Debug your Xamarin.Forms Android or iOS app and edit a XAML file while your app is running. The changes will automatically be applied to the running app when you hit Save.

Note: If you were a part of the private preview, additional information on upgrading to the public preview can be found here.

How does it Work?

Before going wild trying to reload everything, it’s important to understand the functionality and limitations of XAML Hot Reload for Xamarin.Forms. When you save changes to a Xamarin.Forms XAML file, XAML Hot Reload jumps into action:

1. First, XAML Hot Reload identifies the runtime object that corresponds to the top-level object of the XAML file that was edited. If the view or page is not currently loaded, the change is saved for later.
2. The Xamarin.Forms XAML loader is run again on the existing object, resetting its properties and recreating its children from the changed XAML file.
3. The InitializeComponent method is called again on the object to re-connect the newly inflated objects to any event handlers or x:Name properties you might have in your code behind.

As you might guess, this approach carries with it some limitations:

1. Code and resource changes are not reloaded. You can only reload changes to XAML. Changes to your code, (including things like adding new event handlers, or resources, such as images or CSS) will not be reloaded.
2. Some view state may be lost on reload. If you are modifying the appearance or style of your views in code as well as XAML, those modifications may not be re-applied after a reload. This is because the code might not be re-run on the newly inflated XAML objects.

A more comprehensive list of Known Limitations is available on the documentation site. In most cases, XAML Hot Reload is resilient enough to handle unsupported changes gracefully. It will indicate invalid XAML or other issues with IntelliSense as you edit your XAML file.

For a better reload experience, we are working to remove some of these limitations while preserving more of your view state. Be the first to receive improvement updates by staying up to date with the latest preview releases!

We Want your Feedback on this Public Preview!

We’ve released XAML Hot Reload for Xamarin.Forms as a preview feature to start improving your inner development loop today. Our future roadmap is driven by your feedback and needs. So try it out and let us know if it makes your life easier. Or if there is anything we can do to make XAML Hot Reload even better! Here are some of the top suggestions we’ve received already:

• Allow XAML Hot Reload on multiple devices/emulators at the same time
• Hot Reload for Xamarin.Android
• XAML Hot Reload for Xamarin.Forms on UWP
• Xamarin Hot Reload for C#

If any of those suggestions are important to you, please let us know by up voting them. To report a new bug or suggested feature, use the feedback tool at the Help > Send Feedback > Report a Problem menu on Windows, and the Help > Report a Problem menu on a Mac. Or reach out to us on Twitter at @chknofthescene or @maddyleger1. We hope to hear from you!

Alex Corrado Senior Software Engineer, Xamarin

Follow