Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
875
Problem with binding ButtonTools in application menu MenuTools
posted

My ribbon's application menu has several MenuTools in it. I was previously manually populating all those MenuItems with ButtonTools using procedural code, and was seeing proper results. The menus and buttons all looked good, like in Example 1 in my attached image.

I needed to switch to a binding approach to simplify all the internal wiring, so I converted to pure XAML for adding and populating these MenuTools in my application menu. I used an ImageSource to bind the MenuTool items to collections in my ViewModel, and used a DataTemplate specifying a ButtonTool for the MenuTool items.

Unfortunately the results aren't the same in the bound approach. The entire button content lives only in the very center of the MenuTool item. It's not using the LargeImage, and you have to click on that central button content to actually press the button. Ick.

Here's some XAML that manually adds a ButtonTool to a MenuTool, which gives the nice results like you see in Example 1 in my attached image:

<igRibbon:MenuTool Id="MyAccountMenu" Caption="My Account"
 LargeImage="/images/MyAccount_32.png">
   <igRibbon:ButtonTool Id="ChangeXperiencePasswordButton"
     Caption="Change Xperience Password" SmallImage="/images/Key_16.png"
    
LargeImage="/images/Key_32.png" Click="ChangeXperiencePasswordButton_Click" />
</igRibbon:MenuTool>

Here's some XAML that shows the binding approach. This gives the icky results like you see in Example 2 in my attached image:

<igRibbon:MenuTool Id="SelectThemeMenu" Caption="Select Theme"
 
LargeImage="/images/ThemePalette_32.png" UseLargeImages="True"
 
ItemsSource="{Binding Themes}">
   
<igRibbon:MenuTool.ItemTemplate>
       
<DataTemplate>
           
<igRibbon:ButtonTool Caption="{Binding Path=Name}"
             
SmallImage="/images/ThemePalette_16.png"
              
LargeImage="/images/ThemePalette_32.png"
             
Tag="{Binding}" Click="SelectThemeButton_Click" />
       
</DataTemplate>
   
</igRibbon:MenuTool.ItemTemplate>
</igRibbon:MenuTool>

I'm not sure why manually adding a ButtonTool as the child of a MenuTool works, while specifying a ButtonTool as the DataTemplate for a MenuTool doesn't.

I feel like I must be missing something simple here. Please tell me I don't have to fall back on procedural code to make this work! :)

Thanks for your help,
Jim Honeycutt