I'm having problems with the SizingMode of ButtonTools in a RibbonGroup when the tools are populated through databinding.
On the datacontext I have a collection of ButtonToolData objects. I have a DataTemplate for the ButtonToolData type that contains a igRibbon.ButtonTool. When I databind the RibbonGroup.ItemsSource to the collection I get the list of tools as expected.
The problem is that the SizingMode ( which is readonly) doesn't seem to adapt itself to the current MaximumSize property. The SizingMode value of the ButtonTools is equal to ImageAndTextNormal even if the MaximumSize prop is set to ImageAndTextLarge.
In the case where I add the tools manualy to the group the SizingMode calculates properly (problem only occurs when databinding).
Below is a piece of xaml to illustrate the problem. the first group contains tools through databinding, the second group contains hardcoded tools. For testing purposes I have hardcoded the MaximumSize=ImageAndTextLarge in the datatemplate so that each generated ButtonTool is set to 'ImageAndTextLarge'. For some reason it creates a large button as expected but shows the smallImage instead of the largeImage....
Any idea how I can force it to use the correct SizingMode ?
<Window.Resources>
<DataTemplate DataType="{x:Type local:ButtonToolData}">
<igRibbon:ButtonTool Caption="{Binding Caption}"
SmallImage="{StaticResource about_16}"
LargeImage="{StaticResource about_32}" igRibbon:RibbonGroup.MaximumSize="ImageAndTextLarge"/>
</DataTemplate>
<ItemsPanelTemplate x:Key="TestPanel">
<igRibbon:ToolHorizontalWrapPanel IsItemsHost="True" />
</ItemsPanelTemplate>
</Window.Resources>
<Grid x:Name="LayoutRoot">
<igRibbon:XamRibbon x:Name="myRibbon" DockPanel.Dock="Top">
<igRibbon:RibbonTabItem>
<igRibbon:RibbonGroup Caption="test" ItemsSource="{Binding Tools}" ItemsPanel="{StaticResource TestPanel}" />
<igRibbon:RibbonGroup Caption="test2">
<igRibbon:ToolHorizontalWrapPanel>
<igRibbon:ButtonTool Caption="large" igRibbon:RibbonGroup.MaximumSize="ImageAndTextLarge" SmallImage="{StaticResource about_16}" LargeImage="{StaticResource about_32}"/>
<igRibbon:ButtonTool Caption="normal" igRibbon:RibbonGroup.MaximumSize="ImageAndTextNormal" SmallImage="{StaticResource about_16}" LargeImage="{StaticResource about_32}"/>
</igRibbon:ToolHorizontalWrapPanel>
</igRibbon:RibbonGroup>
</igRibbon:RibbonTabItem>
</igRibbon:XamRibbon>
</Grid>
The resizing is actually handled by the containing panel and only affects the direct children. Since you are binding the ItemsSource the direct children will be ContentPresenters and not the tools. You should submit this to the support group.
I didn't understand the reply. Can you please confirm if it is possible to add toosl to the XamRibbon in code and set the ImageAndTextLarge property so they appear as large buttons rather than small ones? If so, could you please provide a simple code snippet?
Many thanks.
Hello,
Thank you for your post. I have been looking into it and I created a sample project for you using the code you have provided and everything seems to work ok on my side. If the sample doesn’t satisfies all your needs feel free to modify it, so it reproduces your behavior and send it back to me for further investigation. Also I suggest you download the latest service release and test my sample with it.
Looking forward for your reply.
I have the same requirement and need to use data binding for ribbon items. Is there a resolution to this problem available now?
I never found a way to fix this. We worked around the problem with codebehind.