So you are using the WPF’s Ribbon control in your application, and you want to show some text in the Application Menu button like the new Microsoft Office does, instead of just the empty button.

RibbonApplicationMenu’s object model allows you to focus in on the Label property, and decide if it works. So you add the following code to your ribbon:

<RibbonApplicationMenu Label=”File>

When you run the application, nothing changes. The text you have set doesn’t appear in the Application Menu’s button. If you are a new WPF developer you assume the control is busted and consider using some other navigation. If you think a little, you remember that in WPF you can modify a control’s controltemplate. So how hard can it be to make the Application Menu use the Label property in its controltemplate?  Well it’s pretty easy if you know what controltemplate you are looking for, and you have access to Microsoft Blend for Visual Studio to get a copy of the template.  Here are the steps that I followed to get a copy of the controltemplate and modify it to use the Label property’s text in the Application Menu.

  1. Open your project or create a new project in Microsoft Blend for Visual Studio.
  2. Open the Assets window. (The button in the left navigation area that has two greater than signs in it.)
  3. In the Assets window, expand Controls and select All.
  4. Scroll through the list of controls until you find the RibbonApplicationMenu, and drag this onto your window/form.
  5. Right click on the RibbonApplicationMenu mouse over the Edit Template menu item, and select Edit a Copy…
  6. The Create ControlTemplate Resource dialog will appear.  Select where you want to put the control template (at the window level, application level, or in its own resource dictionary). For my purpose I put it at the application level.
  7. When you select OK you might get an error dialog saying that it couldn’t copy the template.  In my experience the controltemplate still gets placed where you told it to; there is just an issue with creating a copy of the default template because of an index being 0.
  8. In the controltemplate, search for a Path object that has the name DownArrow. This is the white arrow you see in the Application Menu button, and is what we are going to replace.
  9. Find the Path’s parent element, which should be a StackPanel. Clear all the StackPanel’s sub-elements (should be the Path and an Image).
  10. Add a TextBlock to the StackPanel as shown below.

    <TextBlock Margin=”2,1Foreground=”White
    Text=”{Binding RelativeSource={RelativeSource
    AncestorType={x:Type RibbonApplicationMenu}}, Path=Label}

  11. The code binds the TextBlock to the Label property set back on the RibbonApplicationMenu.
  12. You can now remove the RibbonApplicationMenu control you dropped on the window/form.  We only needed it to get the controltemplate.
  13. Next you need to set your RibbonApplicationMenu to use the template by using the following code. The value is set to the key that’s assigned to your controltemplate.

    <Style TargetType=”{x:Type RibbonApplicationMenu}>
    <Setter Property=”Template
    Value=”{StaticResource ApplicationMenu1}/>
  14. You should be able to build and run your application and get the text set on RibbonApplicationMenu’s Label property shown.
Like this post? Share it!