Saturday, August 14, 2010

WPF Ribbon Control officially released!

Word 2007
It's about time that I write a post about programming instead of cooking and what better way to start than a control I swore I would never use: the Ribbon Control. Those of you who have used the new Office 2007 or 2010 know what I'm referring to. Microsoft decided to switch up the normal menus across the top in 2007 and make us wonder why we could no longer go to File > Print and sent us searching for the Print button until we realized there was a big flashy round button that we were supposed to click on that held enormous power.
Word 2010

And then right away in 2010 decided this was a bad idea and gave us our File menu back.

Like most people, I hate change. If I have to go hunting for something as simple as Print or Save when I knew exactly where it was in the old version then it was a bad change. The thought of adding such a control to one of my own applications did not appeal to me at all. With the ribbon control, it felt like you were hiding functionality instead of giving more power right at your finger tips and making things more intuitive. I was also afraid of making an application that looked and felt exactly like Microsoft Office because this is the only place so far that the control is widely used.

Then one day a few weeks ago I was watching a demo of a competitor's new product that happened to use a ribbon at the top for it's main navigation.  And you know what?  It looked frickin' sexy.  They had a black theme going (similar to my 2010 screen shot above) and I fell in love.  About a week later I saw the announcement that the control had finally been released in all it's glory and I couldn't wait to get my hands on it.

So last weekend I finally got VS 2010 and Expression 4 installed on here and then downloaded the Ribbon Control and sample files.  As usual, my high levels of excitement led to quick disappointment.  I want everything to be easy to use right out of the box.  I started a new project in Blend and added a ribbon control and was overwhelmed by all the new controls and properties.  What's the difference between a RibbonGroup and a RibbonControlGroup?  What's the control in the upper left hand corner called and how do I add text to it instead of an icon?  Why are all the default colors so hideous and hard to change?  Oh yeah that's right, because Microsoft wants it to be difficult to style the ribbon and hopes we're all too lazy to figure it out.

After messing around with styles and colors for a while in Blend I decided it was going to be a lot of work to get my cool black theme going.  Next I thought I'd try to research some of these questions but this just led to more frustrations.  Of course there's only very basic documentation on MSDN:

"A RibbonGroup represents a logical group of controls as they appear on a RibbonTab."  Whereas "a RibbonControlGroup groups a set of ribbon controls into a visual and conceptual unit."

Well of course!  That clears it right up!  Some of the new controls actually have pictures which are very helpful, but it looks like very few do.  With such a visual control like the ribbon showing how a control will look and feel is kind of a necessity I think.  Then I remembered the guy's blog where I originally heard that it was released and read through that which was very helpful.  Yet I still didn't have any of my initial questions answered.  So I decided to check out the sample projects that I had downloaded earlier.  Surely they would lead me to the light of the ribbon. 

Sample Word App
Unfortunately I was quickly discouraged again because of the hideous UI in the sample apps.  The whole reason I wanted to use this control was because of how pretty I could make it.  I don't think their sample app really showcases those possibilities.  Really Microsoft?  You couldn't even include large icons that aren't extremely pixelated?

In the end I think I answered most of my own questions.  You can't easily put text instead of an icon on the application menu.  You have to override about 20 default colors to get rid of the blue/orange default theme.  I haven't given up yet though.  I've been working on my first ribbon app today and will be writing more later on some of my discoveries.