Flat Navigation AppBar Sample

The Windows 8 User Experience Guidelines mentions two different navigation designs: the hierarchical and the flat system. This sample implements a Multiple Document Interface (MDI) like approach. Or a Multiple tabs Flat System Interface.

The intention of this app is to show a way how an MDI / Flat System Interface navigation bar might look like. It demonstrates app bar animation and offers different kind of user interaction for the navigation app bar.

The user can add new tabs (pages), switch between open pages, and of course remove existing. The app bar holds a navigation list of all currently open pages in the app bar.

The user can enable / disable some app bar animation when a new page is added via the app's settings.

Another configuration setting is available to set the way the navigation list reacts on user interaction. One option is to open an existing tab by just tapping on it (single tap). To select an item from the navigation list, the user has to right tap it. The app gives visual feedback when right tapping is registered.

The other option is to select the navigation item by a single tap and open the page by double tapping. Because tap events are fired by finger tapping, mouse click or pen input, the app does not have to distinguish between different input devices.

The app includes the source code.