Hub App for windows 8 – Hub Control

In Windows Store Apps by hfarazmLeave a Comment

We will be developing a ‘hub app for windows 8’ in visual studio 13.

Anatomy of Hub Template
Hub template is new in Windows 8.1 app store.  The hub include groups of various kinds of content. You can use a hero image or content section for the first group which is not applicable in grid or split app. One advantage of hub is that you don’t have to worry about adding scroll viewer at bottom of page and most of the content will be organized according to specified rules.  Here is the structure of hub template looks like.

horizontally panning hub template with hero tilevertically panning hub template with hero tile

Use a large image for the hero that may be cropped both vertically and horizontally without losing the center of interest.

Here is an example of a single hero image and how that image may be cropped for landscape, portrait, and narrow width.

hero image cropped for different window sizes

Lets do it now!

  1. Open visual studio 13 > New project > Visual C# > Blank App
  2. In solution explorer, open MainPage.Xaml and add below lines of code between opening and closing tag of Grid.

Download Complete code by Mr. Usman-Ur-Rehman

Having any problem implementing above code? Click on this post title and comment below there.