Telerik blogs
XamarinT2 Dark_1200x303

Have you heard? Xamarin.Forms is now hotter than ever with the new Hot Reload functionality added to its toolbox.

XAML Hot Reload for Xamarin.Forms speeds up your mobile application development and makes it easier to build, experiment, and iterate on your user interface. This means that you no longer have to rebuild your app each time you tweak your UI. When you add a new Telerik control or change its style, just save the XAML and see the result!

And yes... it works with Telerik UI for Xamarin!

Let Me Show You How the Magic Happens

  1. Check the version of your Visual Studio and update it if needed - the Hot Reload works with version Visual Studio 16.3 and Visual Studio for Mac 8.3 and above.
  2. Enable it by going into Tools > Options > Xamarin > Hot Reload. Note, that In the latest releases, 16.4 and 8.4, XAML Hot Reload is turned on for you by default and you can skip this step!

    Enable Xamarin Hot Reload

  3. Install Telerik components and let’s change some XAML 😊. First, I have created a simple Xamarin app using the Telerik templates and dragged one of the latest Telerik UI for Xamarin components, RadDateTimePicker, which looks like this:

    Add Telerik UI for Xamarin RadDateTimePicker

  4. Next, I'll change it to a simple date picker by changing two properties – DisplayStringFormat and SpinnerFormatString. Click SAVE and voila... a new DatePicker control:

    New Telerik UI for Xamarin DatePicker

For better illustration of the HotReload, I have prepared a short GIF:

hot reload in action

Want More than XAML?

This awesome feature also works with changes to resources in App.xaml and with global resource dictionaries, AppShell.xaml 

Additionally, you can introduce changes to your CSS, if you use CSS to customize the styling of your Xamarin.Forms apps and work with the latest releases of Visual Studio and Visual Studio for Mac

And That’s Not All...

Microsoft is working hard to boost the productivity of Xamarin developers with a functionality called Hot Restart - effectively, giving you the ability to test the changes made to your app, including multi-file code edits, resources, and references, while using a much faster build and deploy cycle.

As of last month its preview version is already available with the Visual Studio version 16.5 Preview 2 release. For now, it works only with iOS apps using Xamarin.Forms. Support for Visual Studio for Mac is on the roadmap. However, while we all wait for the official version of Hot Restart you can still try it over the iOS versions of your apps built with Telerik UI for Xamarin and a enjoy faster development process deploying edits - just press Ctrl + Shift + F5 and see your new changes applied! You can read more about Hot Restart here.

Good to Know!

Xamarin Hot Reload recreates the entire XAML of the edited view, not only the changed element. This causes it to reload the databindings too. For performance optimizations you can set the DataBindings in C#. You can read more about that in this Microsoft post

Also, XAML Hot Reload currently calls the OnAppearing() method with every refresh, so be mindful of what you load there.

More to Read :)

If you want to read more about XAML HotReload and how to speed your development with Telerik UI for Xamarin the following articles are for you: 

About the Author

Rossitza Fakalieva

Rossitza Fakalieva is a Technical Manager, Microsoft MVP in Developer Technologies and a Director of the Bulgarian chapter of the global Women Who Code organization. She previously worked on the Telerik engineering team and defines herself as .NET enthusiast. She loves to empower others to grow in their career and in the tech field—by teaching, by delivering courses and presentations, and as part of her daily job.

Related Posts


Comments are disabled in preview mode.