What is This ‘LayoutAwarePage’ You Speak Of

Update: The LayoutAwarePage is no more in Windows 8.1. Check out my new post What Happened to My LayoutAwarePage?

The other day Microsoft released the Consumer Preview of their  next version of Windows.  The next version of Windows will bring Microsoft in direct competition with iPad and the various Android tablets.  I was excited about this release since I had been using the Developer Preview since it was released.  I installed the new version of Windows and the tools to build apps as soon as I could.  I wanted to get a handle on developing Metro applications.

So the first thing I decided to do was see if any of the apps I built using the Developer Preview would run in the Consumer Preview.  Low and behold neither application would run. After a quick internet search I found Microsoft’s guidance on upgrading applications.  This document comes in at over a hundred pages.  According to what I found they listened to the feedback of early adopters and as such had to make many breaking changes. It was nice to see them listening to the community.  It does mean that any developers that created applications will need to spend time converting their apps. Since the applications I are not that import I decided to hold off on upgrading them.

Making Life Easy

CommonsFolderSo I decided to work on a new project.  I started by creating a blank C# Metro Application.  After the template finished loading I noticed something new, a ‘Common’ folder.  Inside the common folder there are some interesting files.  The first thing to take a look at is the ReadMe.txt.  In there, Microsoft explains what these new classes are there for.

Here is the contents of the ReadMe file:

The Common directory contains classes and XAML styles that simplify application development.

These are not merely convenient, but are required by most Visual Studio project and item templates. Removing, renaming, or otherwise modifying the content of these files may result in a project that does not build, or that will not build once additional pages are added.  If variations on these classes or styles are desired it is recommended that you copy the content under a new name and modify your private copy.

That is a little scary. These file are here to help but don’t modify them or your project may never work again.  So there are a couple of value converters which are ones I tend to build so thank you Microsoft. There is also a StandardStyles.xaml.  This is a nice change for the previous version where the styles were on each new page. I did not think that would carry through to the final version of the templates. 

Layout My Page Please

This leaves three other classes.  The one that I am going to take a deeper look at here is the LayoutAwarePage.  I will leave the rest for a different post. The first thing to notice is that the class is heavily commented which is nice but how it used?  Well it inherits from Page, so I assume it has to do with code behind files. I did a search of the entire solution for this class and it is not used anywhere.  So I created another solution using one of the other templates.  All the pages in that template inherit LayoutAwarePage.

One of the complaints I had with the Developer Preview is that there was no easy way to navigate from page to page. There was also no means to capture page history.  Hitting the back buttons on a page created by the templates did not necessarily do what the user thought it would.  It may or may not navigate to the last page the user visited.  Of course you could override that behavior but it required build a custom navigation framework.  This is now taken care of in this new class. Here are the convenience methods that handle that for you.

NavigationMethods

The Page class has a Frame member that handles the navigation and handles the call stack.

Handle Those Turns

One of the sensors that most tablets have is an accelerometer.  This allows user to orient their tablets in any orientation they want.  Also Metro apps can be snapped side by side with another Metro application.  Developers have to handle these changes.  In the Developer Preview each page subscribed, in the code behind, to the orientation event that gets fired. This functionality has been abstracted into the LayoutAwarePage class.  This makes sense since this class is named LayoutAwarePage. Here are some of the methods that handle that:

image

I like that this functionality has been centralized and removed from the code behind.  I like to develop XAML applications using Mode-View-ViewModel (MVVM) pattern.  Anything that helps limit the code in the code behind I am for.  So how does MVVM play out in Windows 8.

Is MVVM Dead?

When Microsoft released Expression Blend for Windows Phone development, they included a MVVM template.  That made a lot of people happy.  They started wondering when will there be a temple for MVVM within Visual Studio.  Sure there were third party frameworks that contain MVVM templates, MVVMLight being the one I liked the most.  Since there was not a template within the Developer Preview I was hoping that there would be one in the Beta. Alas I was disappointed.

What I did find is that there is a DefaultViewModel in the LayoutAwarePage class. Here is the property declaration:

image

This is implemented as an ObservableDictionary. This view model is set to the pages DataContext in the constructor.

image

“Properties” on the DefaultViewModel as you would using any dictionary.  There are two things to note first to pass data between pages through the Frame.Navigate method as NavigationsEventArgs.  Second notice the magic strings.  Bindings are handled the same as before, binding to the magic string noted above.

BindingExample

I am not sure that I like this.  My view models tend to have a little bit of logic in them.  It is convenient to be able to pass data in the navigation event but that would mean moving some service/data logic into the code behind.  I will have to think about this a bit to figure out how I want to handle my view models.

Summary

This was a look at one of the ways that Microsoft is trying to make it more convenient to develop applications.  I don’t like the language of the ReadMe text or how they seem to be forcing a paradigm down developers’ throats. Kind of like how Apple treats their iOS developers. I will have to see how much of a pain it will be to use or not use these convenience classes.

This entry was posted in MVVM, Windows 8, Windows 8.1. Bookmark the permalink.

6 Responses to What is This ‘LayoutAwarePage’ You Speak Of

  1. Pingback: WindowsDevNews.com

  2. Nice post! DefaultViewModel + NavigationEventsArgs are just a facility for simple scenarios similar to the SampleDataSource sample included in the templates. In more complex scenarios you would instantiate a custom view model class that contains all the logic you need, either in the app class or in the views themselves.

    • dmd0822 says:

      I agree that this is for simple situation. I just find it funny that Microsoft adds a base class that they warn you could cause harm if you modify/remove it. The majority of the XAML Templates inherit this class. I like portions of the class but I am working now to see how I want to take advantage of it and where I need to diverge from it.

  3. Frederico says:

    Why do say MVVM is dead? LayoutAwarePage doesn’t cross MVVM’s border.

    LayoutAwarePage is on the other hand a good kick off so you won’t have to implement view state management (Snapped, Fill, Full, Portrait,…)

    The DefaultViewModel is just a little bit of a show-off. Just like the BindableBase using CompilerServices.CallerMemberName attribute, which in the past I would kill for.

    Don’t forget that LayoutAware page is base class for View, not a substitute of the ViewModel. You can even inject via MEF several ViewModels into the Map DefaultViewModel provides.

    • dmd0822 says:

      I don’t think that MVVM is dead. In fact it is more alive than ever. What I am disappointed in is the way Microsoft chose to do it. A dictionary with magic strings is not a good implementation of MVVM. At best it is like a resx file. I tend to use a ViewModel locator pattern to match my views with their view models. This has worked well for me in the few Win 8 apps I have built. I was just hoping that Microsoft would include a better implementation but I can deal.

      As for the layout aware page, I don’t mind that page. I would have done something similar if it did not exist.

  4. Pingback: What Happened to My LayoutAwarePage? | Dave's Two Cents

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s