I have a great idea for an app that I intend to submit to the Windows 8 store. I am a fairly proficient .NET developer, and I already have a nice little class library all ready to go, I just need a “Modern” UI. This shouldn’t be too hard, right?

I create my project, and start adding controls. I realize I will need that settings thing that pops up when you swipe up from the bottom of the screen. But it isn’t called “settings” – that is something different. Instead it is called the “AppBar”. Now given that I am using a tool called VISUAL Studio, the primary innovation being the ability to rapidly, visually design user interfaces, then write code for interaction. So I figure adding an AppBar should be as simple as adding a menubar was in windows forms, right?

Wrong. Dead Wrong.

An AppBar is like an iFrame. You can put whatever you want in it, and it is completely NON-obvious, and non-intuitive to do so in a meaningful fashion. The Microsoft Quick Start guide only tells you how to do it with some XAML code that they neglect to tell you where to place. Want to follow along? Here is the article: http://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh781232

The app bar is crucial to app development, and Microsoft makes a big deal out of maintaining consistency across apps. It really is necessary that all (or most) apps share certain components of design – (Windows has been doing it since the beginning with Common Controls. The Save and Open dialogs, Buttons, textboxes, Menus, MenuBars, tooltips, context menus… all of these looked and functioned the same because applications used Microsoft’s implementations. This consistency has been one of the best features of Windows, and the simplicity of it’s implementation a huge asset.) – but the AppBar is just a container that you have to fill with something, and to fill it right requires copying and pasting from a website. You could not possibly figure it out from Visual Studio. Let’s see some quotes!

Note  The app bar button styles used in these examples are located in the StandardStyles.xaml file included with every Microsoft Visual Studio project template. By default, the app bar button styles are commented out in StandardStyles.xaml. To use a style, you must un-comment the Extensible Application Markup Language (XAML) for the Style resource in the file.

Ok, so every Windows Store project comes with a copy of the styles but they are commented out. How do you find the correct style? What if the style changes? The current style is round buttons – what if Microsoft makes them oval or square in the future? Because this style is now hard-coded in every project, you are in essence drawing all your own buttons and would have to update all your code to match the new style. Nice to be able to do, sure, but really, really stupid (and bad practice) for buttons you just want to have the system default look.

This next quote from later in the article is what really floored me. I haven’t seen quirky, poorly-thought-out crap like this in a long time.

Handling the Opened and Closed events

You can respond to the app bar being opened or dismissed by handling the Opened and Closed events.

For example, this is useful if you need to open an app bar over a WebView control. Other content can’t be rendered over the top of a WebView. When the app bar is opened over a WebView, the WebView covers the app bar.

You can work around this problem by handling the app bar’s Opened and Closed events. When a user opens the app bar, you create a WebViewBrush and set the WebView as its source. Then call the Redraw method, which takes a visual snapshot of the WebView. You then use that brush to fill a Rectangle, and hide the WebView. The app bar renders its content over the top of the Rectangle. When the user closes the app bar, you no longer need the simulated WebView, so you can put things back the way they were in the Closed event handler.

Ok what? If you want to display an AppBar over a WebView, you have to do every manner of bassackwards tomfoolery, essentially grabbing a screenshot of the control and drawing it to a rectangle, then undoing it in the closed event…
WTF Microsoft?
This isn’t modern! This is stone age.

You should not have to reference the internet to perform common tasks in your applications. You should not have to write jacked-up XML or uncomment lines of static code to perform common tasks. You should be able to visually design the UI in a way that looks similar to other UIs using nothing but the “Visual Studio”.

There is nothing modern about this at all. Writing applications for the Windows store is about 500% more difficult that writing Forms applications. The whole framework just seems lazy. This so-called “Modern” application development platform uses Copy & Paste Programming instead of proper libraries and inheritance. I should be able to drag and drop buttons on an AppBar, then if I want special behaviors I add them, otherwise they work like Windows default.

I’m starting to understand why so many Windows Store (and Windows Phone for that matter) apps are inconsistent, ugly and buggy – developers are having to try to replicate the Microsoft experience, instead of being able to reference it.

Also FYI: you can actually add an AppBar visually.

1. Click on the page element in the XAML code editor
2. In the Properties Editor, Search for “Bottom” – the BottomAppBar property will show up
   
3. Click the New Button
4. Now you have to place the cursor in the XAML on the AppBar node, and you can edit the properties.
5. I haven’t gotten any further than this – you can put pretty much anything in the Content property – including text. Check out this “Hello World” app bar!