In this WPF ribbon tutorial I will show you how easy it is to apply Office 2007 look and feel to your WPF ribbon control. That was the question I’ve received several times via e-mail and in comments, so it is good idea to share that little trick with the rest of the world ![]()
In case you are joining this tutorial series now, you might want to take a look at previous parts of this series, as well as on article explaining how to go and download free WPF ribbon controls.
How to get free WPF ribbon? Read this article and you will get all details there.
HOW TO: Use and add ribbon to your WPF applications (Part 1)
HOW TO: Use and add ribbon to your WPF applications (Part 2)
HOW TO: Use and add ribbon to your WPF applications (Part 3)
HOW TO: Use and add ribbon to your WPF applications (Part 5)
HOW TO: Use and add ribbon to your WPF applications (Part 6)
So, how to apply Office 2007 ribbon look to our WPF ribbon control?
Answer is surprisingly simple and all you need is to add one few lines of XAML code.
In ResourceDictionary part of your XAML code, you should add ResourceDictionary.MergedDictionaries definition that will point to Office2007Blue.xaml resource file (it is integrated with RibbonControlsLibrary).
Your code should look like this (click for bigger picture):
Or you can just copy – paste it from here:
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/RibbonControlsLibrary;component/Themes/Office2007Blue.xaml"/>
</ResourceDictionary.MergedDictionaries
And if everything is fine, your applications should look something like this:
Well, that was easy enough.
Of course you can change current theme, create your own and completely adjust visual appearance of ribbon control. In case you are interested in how to do that, let me know and I will make tutorial for that too.
I’d be interested in creating/adjusting the visual appearance of the ribbon. Additionally, thanks for this series of HOW TO articles on the MS ribbon control.
Ok Stephen, I’ll make it these days. Thanks for commenting!
Hello all!
I would be interested in the way to create one big and two or three small buttons in one chunk.
Till now a great tutorial.
Regards Carsten
@Carsten: Thanks for suggestion and nice words for tutorial. I’ve added your suggestion to my list, it will be coming soon!
Uptil now everything worked like a charm. But if I add the ResourceDictionary Source described above, I get a design time error:
Exception: An error occured while finding the resource dictionary “/RibbonControlsLibrary…”
Inner Exception: Unable to find the specified file.
I’m running on XP. I have .Net 3.5 sp1 and Office 2007 installed + Blend 2.5 June Preview.
Thank You just doesn’t seem to cut it ! but that’s all I can say !!! Love the ribbon theme in appz. was never able to get it to work.
Appended(?) your code a little ( not knowing what I’m doing … in .cs wrote (public partial class Window1 :RibbonWindow) instead of default “yadayadayada : Window1″ sailed out from there !
If you find the time PPPPLLLEEAAseeE continue tutz. Suppose I should be able by now to place myown png’z in QAToolbar…. but thankfull for any help ! Don’t feel quite so much like an Idiot , Thanks.
Oh, not using ExpressionBlend , just 2008 Express
no plans on spending $400 + for a hobby !
Merry Christmas & Happy New Year !
Hi steveHtml – tutorials will be continued. You can see here what I am planning to write about in the following weeks: http://www.uxpassion.com/2008/12/what-am-i-going-to-write-about-in-near-term-future/
I am really happy to see that you are finding these tutorials helpful!
First, thanks for the tutorial and I would be interested in creating my own theme for the ribbon.
I am unable to get the office theme to work in design mode of Blend 2. I get an error finding the resource dictionary but when I run it (F5), the theme works fine. Any thoughts?
Hi, next tutorial will be one regarding changing styles… And yes – you are right – at the moment I don’t see the Office 2007 theme either during design time. I think that we should take into account fact that this controls is in CTP phase (still quite early in development phase) and at some point we will get full great version which will hopefully support design-time changes and number of other stuff.
Thank you for visiting UXPassion.com and giving me your suggestion. It is much appreciated!
It seems like when I declare items in code, such as application menu items and add them to the application menu the normal theme isn’t working. When added in xaml sub menu items off the application menu will display the labeltitle and labeldescription on the right hand side of the application menu. However when taking that same command and applying it to a menuitem created in code we simply get the label title and no multi line display with label description. Any thoughts?
Sean
Gut!
Danke
How do we find out what other themes are in there and their names? Is there a resource for additional ribbon themes?
They will be exposed and describe in the official help docs a bit later in the time. I suggest you to go and read the Ribbon control roadmap and look into the future
Hi! i’ve been following your tutorial series and let me say: thank you.
Right now i have a problem…
Error 1 The attachable property ‘MergedDictionaries’
was not found in type ‘ResourceDictionary’. C:\Users\Mario\Documents\Visual Studio 2008\Projects\ImageResizerWPF\ImageResizerWPF\Window1.xaml 10 10 ImageResizerWPF
Any thoughts?
Thanks
well just forget it…i figured out.