What an exciting time to be a XAML developer! So many new fantastic updates and features are on the horizon with the release of Windows 8.1 and Visual Studio 2013. Windows 8.1 brings to the table over 650 new API’s. While this may sound daunting, the development experience for XAML developers actually becomes much easier through performance, IntelliSense and Visual Studio IDE improvements. This blog post is the second of the series, see the first article What's New in Windows 8.1 for Developers Part 1. In this blog post we will outline some of the most impressive things we can now take advantage of in Windows 8.1 as XAML and C# developers.
XAML applications now have the performance benefit of being compiled into assemblies using the XAML Binary Format (XBF). The load/render time of XAML applications has also been drastically improved as all required keyed resources are no longer completely loaded at startup but rather follow a deferred loading scheme. This means that resources are now only loaded when they are requested. From a usability perspective, panning improvements have been made on large lists of items. Previously when panning through large lists, the application would “pan to black” meaning that when the data is not loaded and rendered, it would look like blank dead space until the rendering of items caught up. Now added is perceived perception improvements where rather than dead space, gray box placeholders will be displayed until the items are rendered. You also have the option of having granular control over what elements in a data template should render first, giving priority to how items are rendered in the large list panning scenario. There is also marked improvements in the design-time performance of the XAML editor in Visual Studio, it is much snappier.
Visual Studio 2013 has improved leaps and bounds when it comes to IntelliSense in the XAML editor. There is full IntelliSense for keyed resources, like styles and converters (click the image for full size)
Full data binding IntelliSense is also available.
Fuzzy matching of XAML elements has also been greatly improved in Visual Studio 2013, so when you don’t get the spelling of your element quite right, IntelliSense will help you find what you need. You can also take advantage of CamelCase matching, so if you wanted to add a StackPanel, simply type “SP” and IntelliSense will filter your selections appropriately.
The ability to add XAML Snippets in the code editor has been a sought after feature. Snippets can greatly improve productivity and give you the ability to further customize your Visual Studio programming experience to your liking. There are two types of Snippets in Visual Studio 2013, Expansion snippets as well as SurroundWith snippets. Expansion snippets allow you to scaffold a block of code (or markup) that includes placeholder values that are replaced with values of your choice when the snippet is being added. SurroundWith snippets do just that, they surround the current selection in the editor with the snippet. Currently the Visual Studio 2013 Preview does not contain any snippets, but Tim Heuer has provided an excellent tutorial on creating custom snippets and you can visit CodePlex XAML Snippets project to get a nice collection of snippets to use while developing your application.
Expansion snippet example:
SurroundWith snippet example:
Another great timesaver, you can now drag an instance of a XAML control directly into the Document Outline. This allows you to place your control exactly where you want it in the visual tree without having to weed through XAML markup.
In addition to the features that we’ve covered, there are a couple more convenience improvements worth mentioning. The first is that the logic used when applying comments to a selection the XAML editor is now smart enough to detect existing comments within the selection and will wrap them appropriately. Secondly, when authoring XAML, the autocomplete logic that generates the end tag of an element is smart enough to identify a self-closing tag, and will remove the generated end tag appropriately.
Previously, you had the choice between using the light or dark theme for your application at startup. This choice was made once and could not be changed. Now you have more granular control over theming where you can now set the theme at any time all the way down to the control level. Another type of resource is now introduced called ThemeResource (works similarly to dynamic resources) that deals specifically with theming.
There are plenty of new controls available for the Windows 8.1 release. What is nice is that many of these controls come pre-built using Windows Store application guidelines. Things like the Settings, Search and menu Flyout controls implement the guidelines and are ready to use out of the box. I am just giving a summary here, later in this blog post I provide a link to a more complete listing of new and enhanced controls.
Creating application bars has never been easier. AppBar that you’ve grown to love is now the primitive control and has been superseded with the introduction of CommandBar, AppBarButton, AppBarToggleButton and AppBarSeparator controls. You no longer need to organize your buttons in stack panels, you simply identify if the button represents a primary or secondary function and it is laid out for you automatically using Windows Store UX guidelines. What is also nice is that you now have the ability to assign the iconography for AppBarButtons using the properties panel (you also still have the option to define the using paths, custom glyphs and more):
The new Hub control brings grouped list boxes back to a native control. Create HubSections to split up your content logically.
The Hyperlink control also makes its Windows 8 XAML début, this is a component that fills a very popular functionality hole.
Header templates now a property on the ComboBox, Slider, DatePicker, TimePicker, Textbox, PasswordBox and RichEditBox – now you can easily add labels to these controls. Placeholder text, or watermarks are also be included in the ComboBox, PasswordBox, RichEditBox, SearchBox and TextBox controls.
Another enhancement that is quite popular is that you also have the ability to render the XAML visual tree as an image using RenderTargetBitmap in the Windows.Xaml.Media.Imaging namespace.
To learn more about these new controls and enhancements, as well as other additions to Windows 8.1 for XAML developers, follow this link:
All project templates have been updated to reflect changes made in Windows 8.1. Gone are the days of LayoutAwarePage and StandardStyles.xaml. Applications are now expected to be responsive to their rendering size. The reason for this is because you can now “snap” multiple applications on the same screen, rather than be limited to only 2 sizes.
A new “Hub App” template has also been added that highlights the usage of the new Hub control.
Also added is the Coded UI Test Project template. You can now record tests for your Windows Store applications and play them back whenever needed. All code for the tests is generated for you.
There couldn’t be a better time to get started creating Windows Store applications. The operating system is gaining considerable traction and as you’ve seen from this post, development for the platform is only becoming easier. It’s time to take advantage of these enhancements to the libraries and to Visual Studio.
Carey Payette is a Developer Advocate. You can follow Carey on Twitter @careypayette or read her personal blog at www.codingbandit.com.