What’s new in Visual Studio 2013 Preview for authoring Windows Store XAML apps

What’s new in Visual Studio 2013 Preview for authoring Windows Store XAML apps

Rate This
  • Comments 29

Today at BUILD we announced the availability of Visual Studio 2013 and Blend that brings forward significant advances for authoring XAML-based Windows Store apps for Windows 8.1. This post describes some of the new experiences we are excited to bring to you. In follow up posts, we will describe each of these experiences in greater detail – so stay tuned.

Everything we’ll tell you about today is only available for Windows Store apps with Visual Studio 2013. To try these exciting new capabilities, you’ll need to either re-target your existing Windows 8 app (retargeting guidance here), or create a new one.

XAML Editor in Visual Studio

We received a lot of feedback from you on features that would be useful when developing Windows Store XAML apps. Based on this feedback we have added a lot of new features to the XAML editor in Visual Studio 2013 Preview.

  • IntelliSense for data binding shows you the possible completions for the DataContext when available.
  • InstelliSense for resources shows you all the resources that are applicable in a given scope, and that match the property type you are trying to assign the resource to.
  • Go to definition (F12) for resources allows you to quickly jump to the document that contains the resource no matter where it defined in your project.
  • Go to definition (F12) for types, properties and bindings allows you to quickly navigate to the declaration of the type, property or binding in your Model/ViewModel.
  • Commenting markup supports nesting of comments within the selected range in the text editor.
  • Renaming a start tag also renames the matching end tag.
  • Support for adding XAML code snippets.

Rulers and Dynamic Guides

We believe that what differentiates a good app from a great app is the amount of attention to details. To help you precisely layout and align controls in Windows Store XAML apps that cross layout hierarchies, we are introducing a guide mechanism that allows you to create visual snapping points at design time. We are also introducing a ruler mechanism that allows you to precisely measure the size of controls and their constraints.

What makes the rulers and guides mechanism unique in Blend for Visual Studio is the fact that they are designed to be fully dynamic in nature. This is important because Windows Store apps should be designed to work under a number of different form factor settings, and hence require constructs that are not tied to any one particular static layout. You can snap a guide to either the left edge of the app or the right edge of the app, and the guides dynamically adjust based on Display Size you have specified when previewing the app on the design surface.

While not a part of this Preview release, we also hope to add a number preset guide configurations that adhere to standard Windows design guidelines, and should make it really easily for you to create layouts without needing to constantly reference the design guideline documents.

Rules & Dynamic guides

Style and template editing

Blend for Visual Studio 2013 Preview makes it really easy for you to edit styles, templates and resources that live in other documents. In prior versions of Blend, editing such a style/template would result in complete loss of your editing context as Blend would switch the active document to the one defining the style /template – something that we have heard loud and clear from you as not being a productive experience Hence we now allow for full “in-place” editing of the style/template right within the document that consumes it, with full undo/redo support across document boundaries. To illustrate this, the screenshot below shows the experience of editing a DataTemplate that is defined in App.xaml, from within GroupedItemsPage.xaml.

Style and template editing

Smarter visual snapping engine

Most standard Windows Store app XAML controls have their default look-n-feel specified in a way that the makes layout bounds are not the same as the visual bounds (because of the presence of visuals in the ControlTemplate required for indicating keyboard focus), and are off by a few pixels causing alignment issues when you are trying to quickly layout control on the design surface To address this issue, the snapping engine in the design surfaces of Visual Studio and Blend has been re-designed to allow you to create precisely aligned controls that snap perfectly to the visual bounds of the controls instead of the layout bounds. We have also added support for baseline alignment of controls that have textual content like Buttons and TextBlocks.

Smarter visual snapping engine

New controls

Windows 8.1 brings a large number of new controls for the XAML developer: Hub, CommandBar/AppBarButton, DatePicker, TimePicker and SettingsFlyout. Visual Studio and Blend make it really easy to create and edit these controls visually. The following is a screenshot of the design experience for the new CommandBar control that shows how easy it is now to create and edit the AppBarButton control in Blend.

You can select the AppBarButton in the Objects and Timeline panel:

New controls: select the AppBarButton in the Objects and Timeline panel

Modify the properties in the Properties Inspector:

New controls: Modify the properties in the Properties Inspector

In real-time, you’ll see your changes reflected on our artboard:

New controls: In real-time you'll see your changes reflected on our artboard

Device panel updates

The Device panel in Visual Studio and Blend has been updated to support a number of new Windows 8.1 functionality like support for new display sizes (example: 7” 1080p), application snapping to various edges and minimum width specification of apps. In addition, the design surface also allows you to arbitrarily resize your app to various sizes in order to get an accurate visual preview of how the app would look like when it is running as shown in the screenshot below. These features allow you to make visual changes to your apps using your preferred mechanism (for example, the State pane and VisualStateManager) at design time.

Device panel updates

Updated project templates

The project templates for building XAML apps have been simplified and updated to adhere to the updated Windows design guidelines like adding support for dynamically resizable apps. In addition, we have also added a brand new project template for building an app that uses the Hub navigation pattern as shown below.

Updated Project Templates

Performance and reliability of the designer

Visual Studio 2013 Preview brings significant improvements to the performance and reliability of the XAML designer in a variety of scenarios. Based on the feedback we heard from you via a variety of channels like Connect and Twitter, the two big ticket items that we have focused on improving the experience for in this release are the time taken to load the designer and time required to have Intellisense available in the XAML editor. We’ve also made a number of targeted fixes around various other scenarios like editing large XAML files, time to bring up data binding dialog, property inspector responsiveness, etc.

We are certainly not done, and will continue to make improvements till we release, but the following is a sampling of scenarios where you can see the improvements we have made in this Preview over Visual Studio 2012 Update 3.

Scenario

Visual Studio 2012 Update 3

Visual Studio 2013 Preview

Percentage Improvement

Designer load time - Large Windows Store project

15.92 seconds 6.11 seconds 61.6%

XAML Intellisense Availability – Large Windows Store project

13.5 seconds 2.55 seconds 81.1%

‘Create Data Binding’ dialog for a 120 element XAML file

6.7 seconds Instantaneous N/A

And finally, a note about Behaviors for Windows Store apps

We love Behaviors and are hard at work to add support for Windows Store apps written in C#, C++ and VB. Blend for Visual Studio 2013 will support Behaviors, they just were not complete enough to be a part of this Preview release. Stay tuned for an update on these shortly!

Feedback!

We are really interested in knowing more about what you think about these experiences and what you would like to see in Visual Studio and Blend going forward – please let us know via UserVoice or Connect!

Thanks,
The XAML Tools team

Leave a Comment
  • Please add 4 and 2 and type the answer here:
  • Post
  • @Marius "Make XAML for C++ available for the desktop too."

    Yes please, what he said. We really need this for desktop apps. Do not leave these applications in the legacy bin please.

  • Hey Microsoft, any news on XAML improvements for WPF are welcome!

  • good

  • WinRT XAML/C# is not yet a replacement for WPF for me. Although I appreciate some of the improvements they've made, the sideloading story is non-existent. My apps cannot be distributed through the store and I'm not going to purchase a $3000 bundle of sideloading licenses just to load my app on target machines. I am not deploying them in an enterprise environment.

    Is it that much to ask that Microsoft invest in either improvements to WPF to bring its performance and capabilities in line with XAML/C# WinRT or update their policies on sideloading to support custom applications whose deployments stories just don't fit in the Store?

    Despite constant overwhelming questions and objections from the developer community it still feels like WPF is being abandoned and XAML/C# WinRT is forced down our throats. My problem is, I will have to look elsewhere--and I don't even want to.

  • "Despite constant overwhelming questions and objections from the developer community it still feels like WPF is being abandoned and XAML/C# WinRT is forced down our throats. My problem is, I will have to look elsewhere--and I don't even want to."

    +1

    Does WinRT even support custom markup extensions yet? *g*  Do the folks at Visual Studio understand what the "X" stands for in "Xaml"? *g*

    Why are we being forced to support a "marketplace" that is growing extremely poorly (for good reason -- it's crap!) and is still being dwarfed and owned by Google and Apple?  With half the features of WPF and Silverlight?

    How long will it take for a single brainiac @ MSFT to realize that MSFT can dominate the ENTIRE market by porting WPF to JavaScript and render it in an HTML5 Canvas tag, thereby running on EVERY major device in the *real* marketplace, not some fabricated nightmare of a slaughterhouse that MSFT under Sinofsky's vision constructed.

    Come on Microsoft, you had it.  You had it going so well.  Take WPF (or Silverlight 5), and create a JSIL- infrastructure that renders your BEAUTIFUL application presentation framework -- Markup Extensions and all -- in HTML5.  

    With the powerful tooling that Visual Studio provides, you will finally create a paradigm where you can build an application once, and run everywhere.  Just like Silverlight intended.

    Stop following Apple and Google.  Start leading for a change!

  • I definitely agree with all the WPF comments - please do not abandon this, it's the only decent option for Windows Desktop LOB applications, and while I understand the obsession with Windows Store stuff, you shouldn't just totally cease supporting the other stuff.

    In the real world, there are loads of desktop client applications that need maintenance, support, enhancement, expansion, etc, etc. Be realistic - these are not going to be moving to WinRT anytime soon.

    If you keep supporting developers with what they need to do today, you might just keep them for tomorrow.

    If you just give up on what we need to do today, why do you think we'd stay?

    Bring these new XAML features to WPF, and please show us you understand the bottom line.

  • Hi everyone,

    Thanks for feedback so far. It is great to hear that you like all of the new features we are introducing in Visual Studio 2013 for the XAML developer.

    However, we also heard clearly that you wanted to see the IntelliSense improvements we are making (like IntelliSense for data bindings/resources and go to definition for Resources) enabled for WPF, Silverlight and Windows Phone 8 projects (in addition to Windows Store apps). Please stay tuned for a future release of Visual Studio 2013 to see these in action!

    Thanks,

    Unni Ravindranathan

    Program Manager, Visual Studio and Blend

  • @Unni

    Feel free to cut the features for Windows Store Apps if time becomes an issue...

    Most of us would not notice anyway.

  • @Unni

    That's very good news! Thanks, I really appreciate you coming back to us on that.

    In addition to intellisense enhancements, it would be great to hear that WPF itself was being improved, but I suppose that will have to remain a dream..

  • I enjoy fo the new functionality but i have a answer:

    With Windows 8.1 and/or VS 2013 it's possible installa an app  (LOB) via sideload without buy 100 product key per sideload?

  • @Unni

    Don't forget the support for Windows Phone 7 apps. Windows Phone 7.8 was released not long ago and WP7 still has ~50% of Windows Phone market share. You don't want to hinder the Windows Phone progress, do you?

  • @Unni,

    "Thanks for feedback so far. It is great to hear ..."

    It seems to me that Microsoft has very selective hearing.

    "Please stay tuned for a future release of Visual Studio 2013 to see these in action!"

    How far into the future? I'll believe it when I see it. For now I see no need to upgrade to VS 2013. Ignoring WPF and desktop LOB applications is not smart.

  • "Windows Store apps with Visual Studio 2013" is exactly why I'll never be interested.  It's a computer, not a phone, please forget about this bad idea.  No one seems to like it but people at Microsoft.

  • What about interactive mode support not just for HTML / JS but for XAML as well

Page 2 of 2 (29 items) 12