The object model needed to support a Windows 8 Metro Grid application is visible below. Common sense dictates that when we create the server-side software, we will need to somehow model this object model on both ends (client and server).

The things to notice is: (1) there are 3 classes total, one is a base class (2) there is a one to many relationship

There are 3 classes:

SampleDataCommon

SampleDataItem

SampleDataGroup

One SampleDataGroup contains many SampleDataItem objects. Most of the lists of “things” in this object model is expressed as a ObservableCollection<T>. This data structure provides a convenient eventing model (currently being ignored) so that we can notice edits or changes in the related data objects.

See the collection _items

A SampleDataItem has 2 things

Content to display for an individual SampleDataItem

A group (SampleDataGroup).

Each individual SampleDataItem points to its parent.

There is a base class

It is SampleDataCommon. It inherits from BindableBase. This provides support as follows:

public abstract class BindableBase : INotifyPropertyChanged

It provides support for Multicast events, resulting from property change notifications

There are two derived classes from SampleDataCommon:

SampleDataItem

SampleDataGroup

There are important relationships here:

A group has many items

An item always belongs to some group

To summarize, the core files in a Windows 8 Metro Grid Style Application

This object model is used by the user interface.

GroupDetailPage.xaml

Shows a group with a list of items

GroupedItemsPage.xaml

Shows both groups and items

ItemDetailPage.xaml

Shows an individual item

The code below is provided by the framework to simplify working with INotifyPropertyChanged. BindableBase is something we just use and don’t worry about.

Conclusion: Re-factoring our Windows 8 Metro Grid ApplicationWe will need to call into a RESTful cloud-based, Azure back-end. We will need to eliminate the SampleDataSource.cs and add our own version. We will base our version on the existing version and simply modify it so it is a FastMotorcycle Application, not the basic test project. FastMotorcycle Application will be a Windows 8 Metro Grid Application that makes RESTful calls to get data. To understand the next steps, you need to understand the data structure and layout.

The Windows 8 Metro Grid Application provides amazing built in power. You simply need to provide it a basic parent-child data relationship, and the built in Grid Template Application can manage quite a bit.

You do not need to build much of a user interface as the default one provided works very well.

Groups will naturally display a list of items.

Items will belong group and the user interface will allow you to seamlessly go back and forth between groups and items.

This blog has covered some basics:

How to create a new Metro project in Visual Studio

How to work with the structure of the project and the files included

How to work with the existing data model in terms of groups and items

The next blog will:

Replace SampleDataSource.cs with a new version that makes asynchronous calls to retrieve cloud-hosted JSON data

Brand the application by supplying custom imagery for tiles and other elements

Consume that JSON data in our application and data-bind it to a ListView control