{"id":229260,"date":"2020-05-20T09:00:21","date_gmt":"2020-05-20T16:00:21","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/visualstudio\/?p=229260"},"modified":"2020-05-20T10:34:33","modified_gmt":"2020-05-20T17:34:33","slug":"improvements-to-xaml-tooling-in-visual-studio-2019-version-16-7-preview-1","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/visualstudio\/improvements-to-xaml-tooling-in-visual-studio-2019-version-16-7-preview-1\/","title":{"rendered":"Improvements to XAML tooling in Visual Studio 2019 version 16.7 Preview 1"},"content":{"rendered":"<p>Hello once again from the XAML tooling team in Visual Studio. Given this week\u2019s many new and exciting releases at <a href=\"https:\/\/mybuild.microsoft.com\/\">Microsoft Build 2020<\/a> I want to take this opportunity to recap what\u2019s new for those building WPF or UWP applications, and where applicable, Xamarin.Forms. This blog post is similar to <a href=\"https:\/\/devblogs.microsoft.com\/visualstudio\/whats-new-in-xaml-developer-tools-in-visual-studio-2019-for-wpf-uwp\/\">our update back in December 2019<\/a>, so if you missed that post I recommend giving it a read as well.<\/p>\n<p>In this blog post we will focus on what\u2019s new in the most recent release of <a href=\"https:\/\/docs.microsoft.com\/en-us\/visualstudio\/releases\/2019\/release-notes-preview\">Visual Studio 2019 version 16.7 Preview 1<\/a> and also highlight other features released in versions <a href=\"https:\/\/docs.microsoft.com\/en-us\/visualstudio\/releases\/2019\/release-notes-v16.5\">16.5 <\/a>and <a href=\"https:\/\/docs.microsoft.com\/en-us\/visualstudio\/releases\/2019\/release-notes-v16.6\">16.6<\/a> including improvements to XAML live debugging tools, XAML Hot Reload, XAML designer, code editor, packaging and extensibility.<\/p>\n<h3>What\u2019s New in Visual Studio 2019 version 16.7 Preview 1<\/h3>\n<p>In this preview release of Visual Studio, we are shipping multiple new features that we hope you will try, including:<\/p>\n<ul>\n<li>A new XAML data binding failure troubleshooting experience &#8211; now you can see when bindings have failed and review the details in a new dedicated tool window<\/li>\n<li>A built-in inline color visualizer in the XAML Code editor<\/li>\n<li>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<\/li>\n<\/ul>\n<p>You can try these features by <a href=\"https:\/\/visualstudio.microsoft.com\/vs\/preview\/\">downloading the preview of Visual Studio 2019 here<\/a> (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 &#8211; after the preview is installed.<\/p>\n<h5>XAML Binding Failure Troubleshooting<\/h5>\n<p>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.<\/p>\n<p>This feature is implemented as a combination of two improvements:<\/p>\n<ul>\n<li><strong>New XAML Binding failure indicator<\/strong> <strong>icon<\/strong> 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.<\/li>\n<li><strong>New XAML Binding Failures window<\/strong> 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).<\/li>\n<\/ul>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Binding-Failures-VS-2019-Update-7-Preview-1.png\"><img decoding=\"async\" class=\"alignnone wp-image-229359 size-large aligncenter\" src=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Binding-Failures-VS-2019-Update-7-Preview-1-1024x836.png\" alt=\"Image XAML Binding Failures 8211 VS 2019 Update 7 Preview 1\" width=\"640\" height=\"523\" srcset=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Binding-Failures-VS-2019-Update-7-Preview-1-1024x836.png 1024w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Binding-Failures-VS-2019-Update-7-Preview-1-300x245.png 300w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Binding-Failures-VS-2019-Update-7-Preview-1-768x627.png 768w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Binding-Failures-VS-2019-Update-7-Preview-1.png 1277w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/a><\/p>\n<p>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 \u201c<strong>Options <\/strong>&gt; <strong>Environment <\/strong>&gt; <strong>Preview Features<\/strong>\u201d, \u201c<strong>XAML Binding Failure Window<\/strong>\u201d and restart Visual Studio.<\/p>\n<p>Known limitations:<\/p>\n<ul>\n<li>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.<\/li>\n<li>For WPF developers, the WPF error level configured in setting \u201cWPF Trace Settings &gt; Data Bindings\u201d controls what information our new window can access. If you set the error level to \u201cOff\u201d or \u201cCritical\u201d then the binding failures are no longer reported in the output window and this experience will stop working.<\/li>\n<li>If you attached to a running process, this feature will not work, as it currently only supports going through the F5 debug scenario.<\/li>\n<\/ul>\n<h5>Inline Color Preview in XAML Code Editor<\/h5>\n<p>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.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Code-Editor-Color-Visualizer-VS-2019-Update-7.png\"><img decoding=\"async\" class=\"alignnone wp-image-229360 size-full\" src=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Code-Editor-Color-Visualizer-VS-2019-Update-7.png\" alt=\"Image XAML Code Editor Color Visualizer 8211 VS 2019 Update 7\" width=\"787\" height=\"243\" srcset=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Code-Editor-Color-Visualizer-VS-2019-Update-7.png 787w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Code-Editor-Color-Visualizer-VS-2019-Update-7-300x93.png 300w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Code-Editor-Color-Visualizer-VS-2019-Update-7-768x237.png 768w\" sizes=\"(max-width: 787px) 100vw, 787px\" \/><\/a><\/p>\n<p>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).<\/p>\n<p>The only limitation in this release is when the color is coming from a resource dictionary, then it won&#8217;t be visible at this time (and we are working to enable this before the final release).<\/p>\n<h5>XAML Designer<\/h5>\n<ul>\n<li><strong>The new WPF XAML Designer for .NET Framework projects<\/strong><strong> which<\/strong> 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 <strong>Tools <\/strong>&gt; <strong>Options<\/strong> &gt; <strong>Preview Features <\/strong>and select \u201c<strong>New WPF XAML Designer for .NET Framework<\/strong>\u201d and restart Visual Studio. Do note this is still a work-in-progress so things like 3<sup>rd<\/sup> party extensibility won\u2019t work in most cases.<\/li>\n<li><strong>Suggested Actions <\/strong>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 <strong>Tools &gt;<\/strong><strong> Options &gt; Preview Features &gt; XAML Suggested Actions<\/strong>. Once enabled, click on a supported control and use the lightbulb to expand and interact with the Suggested Actions UI.<\/li>\n<\/ul>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Designer-Suggested-Actions-VS-2019-Update-7.png\"><img decoding=\"async\" class=\"alignnone wp-image-229361 size-large aligncenter\" src=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Designer-Suggested-Actions-VS-2019-Update-7-1024x747.png\" alt=\"Image XAML Designer Suggested Actions 8211 VS 2019 Update 7\" width=\"640\" height=\"467\" srcset=\"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Designer-Suggested-Actions-VS-2019-Update-7-1024x747.png 1024w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Designer-Suggested-Actions-VS-2019-Update-7-300x219.png 300w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Designer-Suggested-Actions-VS-2019-Update-7-768x560.png 768w, https:\/\/devblogs.microsoft.com\/visualstudio\/wp-content\/uploads\/sites\/4\/2020\/05\/XAML-Designer-Suggested-Actions-VS-2019-Update-7.png 1346w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/a><\/p>\n<p>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.<\/p>\n<h3>What\u2019s New in Visual Studio 2019 versions 16.5 &amp; 16.6<\/h3>\n<p>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:<\/p>\n<ul>\n<li>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<\/li>\n<li>Azure Key Vault support during UWP app packaging experience<\/li>\n<li>New extensibility feature for our partners<\/li>\n<\/ul>\n<p>This week <a href=\"https:\/\/docs.microsoft.com\/en-us\/visualstudio\/releases\/2019\/release-notes-v16.6\">Visual Studio 2019 version 16.6<\/a> has gone \u201cGA\u201d, so when you update to this release the above-mentioned features will all be available.<\/p>\n<p>Now let us dive into the details.<\/p>\n<h5>XAML Hot Reload Improvements<\/h5>\n<p>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. \u00a0If you&#8217;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.<\/p>\n<p>To learn more, <a href=\"https:\/\/docs.microsoft.com\/en-us\/visualstudio\/xaml-tools\/xaml-hot-reload?view=vs-2019\">see our documentation<\/a>.<\/p>\n<p>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:<\/p>\n<ul>\n<li><strong>Multiple process attaching support:<\/strong> 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 &#8220;multiple startup projects&#8221; or UWP multi-instance features and still have full XAML Hot Reload capabilities enabled.<\/li>\n<li><strong>Support for changing generic.xaml resources and its merged resource dictionaries: <\/strong>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).<\/li>\n<li><strong>Apply changes only on file save:<\/strong> 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 \u201cas you edit the file\u201d, but with this new setting you can now opt into \u201conly on file save\u201d. 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 <strong>Options &gt; Debugging &gt; General<\/strong><strong> and turn on \u201cApply XAML Hot Reload on document save\u201d <\/strong>(Visual Studio 2019 version 16.6 and later).<\/li>\n<\/ul>\n<h5>XAML Code Editor<\/h5>\n<p>In the XAML code editor we\u2019ve 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.<\/p>\n<h5>XAML Designer<\/h5>\n<p>In the XAML Designer we have added two small improvements related to WPF .NET Core application development:<\/p>\n<ul>\n<li>It is now possible to change the \u201cArtboard Background\u201d color for the XAML Designer when working on a WPF .NET Core project (Visual Studio 2019 version 16.5 and later)<\/li>\n<li>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)<\/li>\n<\/ul>\n<h5>Packaging<\/h5>\n<p>UWP developers can now sign their app packages with code signing certificates directly from <strong>Azure Key Vault<\/strong> 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.<\/p>\n<h5>Extensibility<\/h5>\n<div>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.<\/div>\n<div><\/div>\n<h5>Related Releases<\/h5>\n<p>We&#8217;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:<\/p>\n<ul>\n<li><a href=\"https:\/\/docs.microsoft.com\/en-us\/microsoft-edge\/webview2\/gettingstarted\/winforms\">The new WebView2 Preview<\/a> is now available for both WPF and WinForms developer, for both .NET Framework &amp; .NET Core applications. This new chromium-based embedded browser allows you to render rich web content within your .NET or C++ desktop apps<\/li>\n<li><a href=\"https:\/\/blogs.windows.com\/windowsdeveloper\/2020\/05\/19\/introducing-winui-3-preview-1\/\">WinUI 3 Preview 1 is now available<\/a>. This preview expands the world of WinUI to an even wider audience of developers \u2013 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<\/li>\n<li><a href=\"http:\/\/aka.ms\/wct-winui3\">Windows Community Toolkit 8.0.0 preview1<\/a> for WinUI 3.0 Preview 1 is now available<\/li>\n<\/ul>\n<h3>Closing, your feedback really matters!<\/h3>\n<p>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 <a href=\"https:\/\/docs.microsoft.com\/en-us\/visualstudio\/ide\/feedback-options?view=vs-2019\">Visual Studio feedback mechanisms<\/a> and let us know what we can do better.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this blog post we&#8217;d like to catch you up on what&#8217;s new in Visual Studio tooling for XAML developers building WPF, UWP and Xamarin.Forms applications. In this post we&#8217;ll cover new features shipped in Visual Studio 2019 version 16.5, 16.6 and the most recent release 16.7 Preview 1.<\/p>\n","protected":false},"author":692,"featured_media":229359,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1196,155],"tags":[413,20,6285,133],"class_list":["post-229260","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desktop","category-visual-studio","tag-uwp","tag-wpf","tag-xamarin-forms","tag-xaml"],"acf":[],"blog_post_summary":"<p>In this blog post we&#8217;d like to catch you up on what&#8217;s new in Visual Studio tooling for XAML developers building WPF, UWP and Xamarin.Forms applications. In this post we&#8217;ll cover new features shipped in Visual Studio 2019 version 16.5, 16.6 and the most recent release 16.7 Preview 1.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/posts\/229260","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/users\/692"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/comments?post=229260"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/posts\/229260\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/media\/229359"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/media?parent=229260"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/categories?post=229260"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/tags?post=229260"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}