I've started playing around with the Microsoft Ribbon control and I ran into an issue with the RibbonButton
when there is more than 1 line of text for the label
The code I have for the ribbon is as so:
<Ribbon x:Name="ribMainRibbon" SelectionChanged="ribMainRibbon_SelectionChanged" DockPanel.Dock="Top">
<Ribbon.QuickAccessToolBar>
<RibbonQuickAccessToolBar x:Name="ribQuickAccessToolBar">
<RibbonButton SmallImageSource="/Media/Icons/New.png"/>
<RibbonButton SmallImageSource="/Media/Icons/Open.png"/>
<RibbonButton SmallImageSource="/Media/Icons/Save.png"/>
<RibbonButton SmallImageSource="/Media/Icons/Print.png"/>
</RibbonQuickAccessToolBar>
</Ribbon.QuickAccessToolBar>
<Ribbon.ApplicationMenu>
<RibbonApplicationMenu Visibility="Collapsed">
</RibbonApplicationMenu>
</Ribbon.ApplicationMenu>
<RibbonTab Header="{DynamicResource MenuDesignOptions}">
<RibbonGroup>
<RibbonMenuButton LargeImageSource="/Media/Icons/ToolBar/PlaceHolder.png" Label="{DynamicResource MenuAutoCalc}" x:Name="rmbAutoCalc">
<RibbonMenuItem ImageSource="/Media/Icons/ToolBar/PlaceHolder2.png" Header="{DynamicResource MenuAutoCalc}" x:Name="rmiAutoCalc" Click="rmiAutoCalc_Click"/>
<RibbonMenuItem ImageSource="/Media/Icons/ToolBar/PlaceHolder.png" Header="{DynamicResource MenuManualCalc}" x:Name="rmiManualCalc" Click="rmiManualCalc_Click"/>
</RibbonMenuButton>
<RibbonMenuButton LargeImageSource="/Media/Icons/ToolBar/PlaceHolder.png" Label="{DynamicResource MenuEnglish}" x:Name="rmbUnits">
<RibbonMenuItem ImageSource="/Media/Icons/ToolBar/PlaceHolder2.png" Header="{DynamicResource MenuEnglish}" x:Name="rmiEnglishUnits" Click="rmiEnglishUnits_Click"/>
<RibbonMenuItem ImageSource="/Media/Icons/ToolBar/PlaceHolder.png" Header="{DynamicResource MenuMetric}" x:Name="rmiMetricUnits" Click="rmiMetricUnits_Click"/>
</RibbonMenuButton>
<RibbonButton LargeImageSource="/Media/Icons/ToolBar/PlaceHolder.png" Label="{DynamicResource MenuReverse}" x:Name="rbtReverse" Click="rbtReverse_Click">
</RibbonButton>
</RibbonGroup>
</RibbonTab>
And the relevant string resources:
<s:String x:Key="MenuReverse">Reverse System</s:String>
<s:String x:Key="MenuEnglish">Imperial Units</s:String>
<s:String x:Key="MenuAutoCalc">Auto Calc</s:String>
But when I run this code it ends up looking like this:
So I can fix it by specifying the Height
property of the RibbonButton
but that seems like the wrong fix for this. And I know you should be able to have 2 line descriptions on those buttons because both MS Word and Excel have them:
Turns out it was one of my global styles I was applying to all StackPanels
<Style TargetType="StackPanel">
<Setter Property="Orientation" Value="Vertical"/>
<Setter Property="Margin" Value="2"/>
</Style>
This was adding the margin inside of the Ribbon Buttons causing it to be cut off