Improvements to XAML tooling in Visual Studio 2019 version 16.7 Preview 1

Dmitry Lyalin

Hello once again from the XAML tooling team in Visual Studio. Given this week’s many new and exciting releases at Microsoft Build 2020 I want to take this opportunity to recap what’s new for those building WPF or UWP applications, and where applicable, Xamarin.Forms. This blog post is similar to our update back in December 2019, so if you missed that post I recommend giving it a read as well.

In this blog post we will focus on what’s new in the most recent release of Visual Studio 2019 version 16.7 Preview 1 and also highlight other features released in versions 16.5 and 16.6 including improvements to XAML live debugging tools, XAML Hot Reload, XAML designer, code editor, packaging and extensibility.

What’s New in Visual Studio 2019 version 16.7 Preview 1

In this preview release of Visual Studio, we are shipping multiple new features that we hope you will try, including:

  • A new XAML data binding failure troubleshooting experience – now you can see when bindings have failed and review the details in a new dedicated tool window
  • A built-in inline color visualizer in the XAML Code editor
  • Two preview features that are still in early development including a new XAML Designer feature called Suggested Actions and our new and improved designer preview for WPF .NET Framework developers

You can try these features by downloading the preview of Visual Studio 2019 here (it installs side-by-side with your release version too!), and continue to read below for all the details and instructions on how to enable some of these features – after the preview is installed.

XAML Binding Failure Troubleshooting

Our biggest feature in this release is a new experience designed to make it easier for developers to detect when bindings have failed in their running application and easily see the details of the failure in a dedicated window.

This feature is implemented as a combination of two improvements:

  • New XAML Binding failure indicator icon in the in-app toolbar for WPF and UWP applications. This icon will turn red if at least one binding failure is detected and hovering your mouse over the icon will show you the total number of failures in the tooltip. Clicking the icon will take you to the new XAML Binding Failures window.
  • New XAML Binding Failures window that brings binding failure details previously only available in the Output window and makes them easy to review in the new dedicated window. The window adds features such as sorting, searching and grouping of similar errors. This experience works for WPF, UWP and Xamarin.Forms projects (Note that Xamarin.Forms version 4.5.0.266-pre3 or higher is required).

Image XAML Binding Failures 8211 VS 2019 Update 7 Preview 1

This feature is still in development and is only available if you enable it in the Preview Features settings. To enable this experience, go to “Options > Environment > Preview Features”, “XAML Binding Failure Window” and restart Visual Studio.

Known limitations:

  • You currently cannot click on a failed binding in the new window to navigate to the code where the failure occurred. This feature requires framework changes and we are actively exploring what is possible with our partners.
  • For WPF developers, the WPF error level configured in setting “WPF Trace Settings > Data Bindings” controls what information our new window can access. If you set the error level to “Off” or “Critical” then the binding failures are no longer reported in the output window and this experience will stop working.
  • If you attached to a running process, this feature will not work, as it currently only supports going through the F5 debug scenario.
Inline Color Preview in XAML Code Editor

Another feature is an inline color previewer right in the XAML code editor. This feature has been requested by many customers, so we are excited to make it available.

Image XAML Code Editor Color Visualizer 8211 VS 2019 Update 7

Once you install the preview, this feature is available by default without requiring for you to take any further actions. You should see it appear in your XAML files no matter which framework you are targeting (WPF, UWP or Xamarin.Forms).

The only limitation in this release is when the color is coming from a resource dictionary, then it won’t be visible at this time (and we are working to enable this before the final release).

XAML Designer
  • The new WPF XAML Designer for .NET Framework projects which brings the same designer and extensibility support available for WPF .NET Core developers to .NET Framework developers. Benefits of this improved XAML designer include faster load performance, 64-bit configuration support (custom controls will load normally just like they do in x86 configuration), improved stability and new features such as Suggested Actions. To get started go to Tools > Options > Preview Features and select “New WPF XAML Designer for .NET Framework” and restart Visual Studio. Do note this is still a work-in-progress so things like 3rd party extensibility won’t work in most cases.
  • Suggested Actions enables WPF .NET Core and UWP developers easy access to most used properties when a standard built-in control (example: CheckBox, Button, Grid, Label, etc.) is selected within the XAML Designer. To use this feature, first enable it through Tools > Options > Preview Features > XAML Suggested Actions. Once enabled, click on a supported control and use the lightbulb to expand and interact with the Suggested Actions UI.

Image XAML Designer Suggested Actions 8211 VS 2019 Update 7

We plan to continue refining these experiences in subsequent preview releases, and your feedback is critical to ensuring these are as productive as possible for all XAML developers.

What’s New in Visual Studio 2019 versions 16.5 & 16.6

Beyond what is new in the most recent preview we have also continued to add features in the last two stable releases which includes things like:

  • XAML Hot Reload improvements such as multi-process attach during debug sessions, more capabilities for theme editing for WPF developers and ability to enable different behavior for when XAML Hot Reload is applied to your running app
  • Azure Key Vault support during UWP app packaging experience
  • New extensibility feature for our partners

This week Visual Studio 2019 version 16.6 has gone “GA”, so when you update to this release the above-mentioned features will all be available.

Now let us dive into the details.

XAML Hot Reload Improvements

XAML Hot Reload is a relatively new feature for XAML desktop developers, though it has been in the product and improving constantly since Visual Studio 2017.  If you’re not familiar with this feature, it enables you to open and change your XAML files (pages, windows, custom controls, resources, etc.) and see those updates in real-time while your application is running in a Visual Studio debug session.

To learn more, see our documentation.

In each release we look for opportunities to improve this experience, a process driven primarily by your feedback. In recent releases we have made these incremental improvements:

  • Multiple process attaching support: XAML Hot Reload and related tools like in-app toolbar and Live Visual Tree now support attaching to multiple processes at the same time (Visual Studio 2019 version 16.6 and later). This makes it possible to use Visual Studio “multiple startup projects” or UWP multi-instance features and still have full XAML Hot Reload capabilities enabled.
  • Support for changing generic.xaml resources and its merged resource dictionaries: For WPF users, we added two new capabilities related to generic.xaml. It is now possible to change values of resources in generic.xaml or any merged Resource Dictionaries that it references. In addition, it is also now possible to update controls with new references to resources in generic.xaml and any merged Resource Dictionaries it references (Visual Studio 2019 version 16.5).
  • Apply changes only on file save: XAML Hot Reload now has a new setting that enables you to choose when we apply Hot Reload changes to your XAML. The default experience is “as you edit the file”, but with this new setting you can now opt into “only on file save”. This enables larger edits across a file to be possible for complex scenarios where individual changes could break your running application. To enable this setting, go to Options > Debugging > General and turn on “Apply XAML Hot Reload on document save” (Visual Studio 2019 version 16.6 and later).
XAML Code Editor

In the XAML code editor we’ve enabled the ability to drag an image from Solution Explorer into the XAML editor and it will generate a proper Image tag with the full path to the dragged image. This feature is available in Visual Studio 2019 version 16.5 and later.

XAML Designer

In the XAML Designer we have added two small improvements related to WPF .NET Core application development:

  • It is now possible to change the “Artboard Background” color for the XAML Designer when working on a WPF .NET Core project (Visual Studio 2019 version 16.5 and later)
  • The XAML Designer now supports loading WPF .NET Core 3.x Projects that include PublishSingleFile, RuntimeIdenfier and PublishTrimmed settings (Visual Studio 2019 version 16.5 and later)
Packaging

UWP developers can now sign their app packages with code signing certificates directly from Azure Key Vault in the packaging wizard. All that is required is the URI of the Key Vault and the correct permissions for your Microsoft account. This feature is now available in Visual Studio 2019 version 16.6.

Extensibility
A feature requested by partners was the ability to specify which controls from a NuGet package are shown in the Visual Studio toolbox based on the framework/platform version of the referencing project. We enabled this scenario by adding support for multiple VisualStudioToolsManifest.xml files in NuGet packages. This feature is now available in Visual Studio 2019 version 16.6.

We’d also like to share with you a few releases from other teams around Microsoft that are relevant to desktop developers. Here are a few of the highlights:

  • The new WebView2 Preview is now available for both WPF and WinForms developer, for both .NET Framework & .NET Core applications. This new chromium-based embedded browser allows you to render rich web content within your .NET or C++ desktop apps
  • WinUI 3 Preview 1 is now available. This preview expands the world of WinUI to an even wider audience of developers – the previously-released WinUI 3 Alpha was only available to UWP app developers, but Preview 1 now enables WinUI usage in Desktop (Win32) apps as well
  • Windows Community Toolkit 8.0.0 preview1 for WinUI 3.0 Preview 1 is now available

Closing, your feedback really matters!

Thank you for reading this blog post and being a XAML developer, we really appreciate your reports of bugs and feature requests as it truly influences a lot of what we implement. Please keep this feedback coming through Visual Studio feedback mechanisms and let us know what we can do better.

3 comments

Discussion is closed. Login to edit/delete existing comments.

  • James Foye 0

    >>drag an image from Solution Explorer into the XAML editor

    About 15 years late, but we do appreciate it, thanks.

    • Dmitry LyalinMicrosoft employee 0

      Sorry we wouldn’t get this in there sooner :(, but customers have recently asked for it and we were able to get this done.

  • Shimmy Weitzhandler 0

    Thanks! This is awesome!
    It’s great to see some UWP love from Microsoft.
    I wish there was Hot Restart in UWP too.

Feedback usabilla icon