Search code examples
wpfxamlcontroltemplateribbon-control

RibbonMenuButton Style and template


Hi I need to change the look of RibbonMenuButton, but I am not able to find its style, part or template on internet. Neither I am able to generate a copy from blend or vs designer. So if anyone has its control template please share


Solution

  • You can use ILSpy (an open-source .NET assembly browser and decompiler) for exploring an assembly and - in your case - for exploring resources that contain - for example - a style.

    By using this tool, you will find that the generic style of a RibbonMenuButton in the RibbonControlsLibrary.dll (version 4.0.0.11019) is (I cut and past it for your convenience):

    <Style x:Key="{x:Type ribbon:RibbonMenuButton}" TargetType="{x:Type ribbon:RibbonMenuButton}">
        <Style.Resources>
            <Style TargetType="{x:Type ribbon:RibbonSeparator}">
                <Setter Property="FrameworkElement.OverridesDefaultStyle" Value="True" />
                <Setter Property="UIElement.Focusable" Value="False" />
                <Setter Property="Control.BorderBrush" Value="{Binding RelativeSource={RelativeSource AncestorType={x:Type ribbon:RibbonMenuButton}}, Path=Ribbon.BorderBrush}" />
                <Setter Property="Control.Background" Value="{Binding RelativeSource={RelativeSource AncestorType={x:Type ribbon:RibbonMenuButton}}, Path=Ribbon.Background}" />
                <Setter Property="Control.FontWeight" Value="Bold" />
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ribbon:RibbonSeparator}">
                            <Border Name="MainBorder" SnapsToDevicePixels="True" BorderThickness="0,1,0,1" BorderBrush="{TemplateBinding Control.BorderBrush}" Background="{TemplateBinding Control.Background}">
                                <Border Name="Overlay" Background="{StaticResource ä}">
                                    <TextBlock Name="Text" Margin="2,1,2,1" Text="{TemplateBinding ribbon:RibbonSeparator.Label}" />
                                </Border>
                            </Border>
                            <ControlTemplate.Triggers>
                                <DataTrigger Value="True" Binding="{Binding Path=HighContrast, Source={x:Static shell:SystemParameters2.Current}}">
                                    <Setter TargetName="Text" Value="{DynamicResource {x:Static SystemColors.MenuTextBrushKey}}" Property="TextBlock.Foreground" />
                                    <Setter TargetName="Overlay" Property="Border.Background" Value="#00FFFFFF" />
                                    <Setter TargetName="MainBorder" Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" Property="Border.BorderBrush" />
                                    <Setter TargetName="MainBorder" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" Property="Border.Background" />
                                </DataTrigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <Trigger Property="ribbon:RibbonSeparator.Label" Value="{x:Null}">
                        <Setter Property="Control.Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type ribbon:RibbonSeparator}">
                                    <Grid Name="Grid" SnapsToDevicePixels="True" Margin="1">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition MinWidth="22" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="14" />
                                        </Grid.ColumnDefinitions>
                                        <Border Name="SideBarBorder" BorderThickness="0,0,1,0" Margin="0,-1,0,-1" Background="{TemplateBinding Control.Background}" BorderBrush="{TemplateBinding Control.BorderBrush}">
                                            <Border Name="SideBarOverlay" Background="{StaticResource ä}" />
                                        </Border>
                                        <Line Name="Line" Grid.Column="1" Grid.ColumnSpan="2" Margin="2,0,0,0" X1="0" Y1="0" X2="1" Y2="0" Stroke="{TemplateBinding Control.BorderBrush}" StrokeThickness="1" Stretch="Fill" />
                                    </Grid>
                                    <ControlTemplate.Triggers>
                                        <DataTrigger Value="True" Binding="{Binding Path=HighContrast, Source={x:Static shell:SystemParameters2.Current}}">
                                            <Setter TargetName="SideBarBorder" Property="Border.Background" Value="#00FFFFFF" />
                                            <Setter TargetName="SideBarBorder" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" Property="Border.BorderBrush" />
                                            <Setter TargetName="SideBarOverlay" Property="Border.Background" Value="#00FFFFFF" />
                                            <Setter TargetName="Line" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" Property="Shape.Stroke" />
                                        </DataTrigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Style.Resources>
        <Setter Property="Control.Background" Value="#00FFFFFF" />
        <Setter Property="Control.BorderBrush" Value="#00FFFFFF" />
        <Setter Property="Control.BorderThickness" Value="1" />
        <Setter Property="FrameworkElement.FocusVisualStyle" Value="{x:Null}" />
        <Setter Property="Control.HorizontalContentAlignment" Value="Center" />
        <Setter Property="Control.Padding" Value="2,0,2,0" />
        <Setter Property="ribbon:RibbonMenuButton.MouseOverBorderBrush" Value="{Binding RelativeSource={RelativeSource Self}, Path=Ribbon.MouseOverBorderBrush}" />
        <Setter Property="ribbon:RibbonMenuButton.MouseOverBackground" Value="{Binding RelativeSource={RelativeSource Self}, Path=Ribbon.MouseOverBackground}" />
        <Setter Property="ribbon:RibbonMenuButton.PressedBorderBrush" Value="{Binding RelativeSource={RelativeSource Self}, Path=Ribbon.PressedBorderBrush}" />
        <Setter Property="ribbon:RibbonMenuButton.PressedBackground" Value="{Binding RelativeSource={RelativeSource Self}, Path=Ribbon.PressedBackground}" />
        <Setter Property="ribbon:RibbonMenuButton.FocusedBorderBrush" Value="{Binding RelativeSource={RelativeSource Self}, Path=Ribbon.FocusedBorderBrush}" />
        <Setter Property="ribbon:RibbonMenuButton.FocusedBackground" Value="{Binding RelativeSource={RelativeSource Self}, Path=Ribbon.FocusedBackground}" />
        <Setter Property="ToolTipService.InitialShowDelay" Value="{StaticResource à}" />
        <Setter Property="ToolTipService.ShowDuration" Value="{StaticResource á}" />
        <Setter Property="ToolTipService.BetweenShowDelay" Value="{StaticResource â}" />
        <Setter Property="ribbon:RibbonTwoLineText.PathData" Value="{StaticResource ÿ}" />
        <Setter Property="ribbon:RibbonMenuButton.QuickAccessToolBarControlSizeDefinition">
            <Setter.Value>
                <rcp:RibbonControlSizeDefinition ImageSize="Small" IsLabelVisible="False" />
            </Setter.Value>
        </Setter>
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ribbon:RibbonMenuButton}">
                    <Grid Name="MainGrid" SnapsToDevicePixels="True">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <rcp:RibbonToggleButton x:Name="PART_ToggleButton" Template="{StaticResource Ĥ}" RibbonTwoLineText.PathData="{TemplateBinding ribbon:RibbonTwoLineText.PathData}" Label="{TemplateBinding ribbon:RibbonMenuButton.Label}" LargeImageSource="{TemplateBinding ribbon:RibbonMenuButton.LargeImageSource}" SmallImageSource="{TemplateBinding ribbon:RibbonMenuButton.SmallImageSource}" ControlSizeDefinition="{TemplateBinding ribbon:RibbonMenuButton.ControlSizeDefinition}" BorderBrush="{TemplateBinding Control.BorderBrush}" BorderThickness="{TemplateBinding Control.BorderThickness}" Background="{TemplateBinding Control.Background}" CornerRadius="2" MouseOverBorderBrush="{TemplateBinding ribbon:RibbonMenuButton.MouseOverBorderBrush}" MouseOverBackground="{TemplateBinding ribbon:RibbonMenuButton.MouseOverBackground}" CheckedBorderBrush="{TemplateBinding ribbon:RibbonMenuButton.PressedBorderBrush}" CheckedBackground="{TemplateBinding ribbon:RibbonMenuButton.PressedBackground}" FocusedBorderBrush="{TemplateBinding ribbon:RibbonMenuButton.FocusedBorderBrush}" FocusedBackground="{TemplateBinding ribbon:RibbonMenuButton.FocusedBackground}" HorizontalContentAlignment="{TemplateBinding Control.HorizontalContentAlignment}" Padding="{TemplateBinding Control.Padding}" ClickMode="Press" Style="{x:Null}" FocusVisualStyle="{x:Null}" IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsDropDownOpen, Mode=TwoWay}">
                            <rcp:RibbonToggleButton.Resources>
                                <Thickness Left="1" Top="1" Right="1" Bottom="2">
                                    <ComponentResourceKey.Key TypeInTargetAssembly="{x:Type ribbon:Ribbon}" ResourceId="LargeImageMargin" />
                                </Thickness>
                            </rcp:RibbonToggleButton.Resources>
                        </rcp:RibbonToggleButton>
                        <Popup Name="PART_Popup" HorizontalOffset="1" VerticalOffset="-1" AllowsTransparency="True" Placement="Bottom" Focusable="False" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}" IsOpen="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsDropDownOpen}">
                            <sdsc:SystemDropShadowChrome Name="Shadow" Color="Transparent" p15:KeyTipService.IsKeyTipScope="True" RenderOptions.ClearTypeHint="Enabled" xmlns:p15="clr-namespace:Microsoft.Windows.Controls;assembly=RibbonControlsLibrary,Version=4.0.0.11019,Culture=neutral,PublicKeyToken=31bf3856ad364e35">
                                <Border Name="MenuBorder" BorderThickness="{TemplateBinding Control.BorderThickness}" CornerRadius="2" BorderBrush="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Ribbon.BorderBrush}" Background="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Ribbon.Background}">
                                    <Border Name="SubMenuInnerBorder" Background="{StaticResource ï}" BorderThickness="0" CornerRadius="2">
                                        <Grid>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="Auto" />
                                                <RowDefinition />
                                                <RowDefinition Height="Auto" />
                                            </Grid.RowDefinitions>
                                            <ScrollViewer Name="PART_SubMenuScrollViewer" Grid.Row="1" Margin="1" Style="{DynamicResource {ComponentResourceKey TypeInTargetAssembly={x:Type FrameworkElement}, ResourceId=MenuScrollViewer}}">
                                                <Grid RenderOptions.ClearTypeHint="Enabled">
                                                    <Canvas Name="BackgroundCanvas" Height="0" Width="0" HorizontalAlignment="Left" VerticalAlignment="Top">
                                                        <Rectangle Name="OpaqueRect" RadiusX="2" RadiusY="2" Height="{Binding ElementName=MenuBorder, Path=ActualHeight}" Width="{Binding ElementName=MenuBorder, Path=ActualWidth}" Fill="{Binding ElementName=MenuBorder, Path=Background}" />
                                                        <Rectangle Name="OverlayRect" RadiusX="2" RadiusY="2" Height="{Binding ElementName=SubMenuInnerBorder, Path=ActualHeight}" Width="{Binding ElementName=SubMenuInnerBorder, Path=ActualWidth}" Fill="{Binding ElementName=SubMenuInnerBorder, Path=Background}" />
                                                    </Canvas>
                                                    <ItemsPresenter Name="ItemsPresenter" KeyboardNavigation.TabNavigation="Cycle" KeyboardNavigation.DirectionalNavigation="Cycle" Grid.IsSharedSizeScope="True" />
                                                </Grid>
                                            </ScrollViewer>
                                            <Border Name="ResizeControl" Grid.Row="2" Visibility="Collapsed" Background="{StaticResource æ}" BorderThickness="0,1,0,0" BorderBrush="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Ribbon.BorderBrush}">
                                                <Thumb Name="PART_ResizeThumb" Style="{StaticResource ç}" />
                                            </Border>
                                        </Grid>
                                    </Border>
                                </Border>
                            </sdsc:SystemDropShadowChrome>
                        </Popup>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger SourceName="PART_SubMenuScrollViewer" Property="ScrollViewer.CanContentScroll" Value="False">
                            <Setter TargetName="OpaqueRect" Value="{Binding ElementName=PART_SubMenuScrollViewer, Path=VerticalOffset}" Property="Canvas.Top" />
                            <Setter TargetName="OpaqueRect" Value="{Binding ElementName=PART_SubMenuScrollViewer, Path=HorizontalOffset}" Property="Canvas.Left" />
                            <Setter TargetName="OverlayRect" Value="{Binding ElementName=PART_SubMenuScrollViewer, Path=VerticalOffset}" Property="Canvas.Top" />
                            <Setter TargetName="OverlayRect" Value="{Binding ElementName=PART_SubMenuScrollViewer, Path=HorizontalOffset}" Property="Canvas.Left" />
                        </Trigger>
                        <DataTrigger Value="True" Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsInQuickAccessToolBar}">
                            <Setter TargetName="PART_ToggleButton" Property="FrameworkElement.Height" Value="Auto" />
                        </DataTrigger>
                        <Trigger Property="UIElement.IsEnabled" Value="False">
                            <Setter TargetName="MainGrid" Value="{StaticResource Ë}" Property="TextElement.Foreground" />
                        </Trigger>
                        <Trigger Property="ribbon:RibbonMenuButton.HasGallery" Value="True">
                            <Setter TargetName="PART_SubMenuScrollViewer" Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
                            <Setter TargetName="PART_SubMenuScrollViewer" Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
                        </Trigger>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="ribbon:RibbonMenuButton.CanUserResizeHorizontally" Value="True" />
                                <Condition Property="ribbon:RibbonMenuButton.CanUserResizeVertically" Value="True" />
                            </MultiTrigger.Conditions>
                            <Setter TargetName="ResizeControl" Property="UIElement.Visibility" Value="Visible" />
                        </MultiTrigger>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="ribbon:RibbonMenuButton.CanUserResizeHorizontally" Value="False" />
                                <Condition Property="ribbon:RibbonMenuButton.CanUserResizeVertically" Value="True" />
                            </MultiTrigger.Conditions>
                            <Setter TargetName="ResizeControl" Property="UIElement.Visibility" Value="Visible" />
                            <Setter TargetName="PART_ResizeThumb" Value="{StaticResource è}" Property="FrameworkElement.Style" />
                        </MultiTrigger>
                        <Trigger Property="ribbon:RibbonMenuButton.IsDropDownPositionedAbove" Value="True">
                            <Setter TargetName="ResizeControl" Property="Grid.Row" Value="0" />
                            <Setter TargetName="ResizeControl" Property="Border.BorderThickness" Value="0,0,0,1" />
                        </Trigger>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="ribbon:RibbonMenuButton.IsDropDownPositionedAbove" Value="True" />
                                <Condition Property="ribbon:RibbonMenuButton.CanUserResizeHorizontally" Value="True" />
                                <Condition Property="ribbon:RibbonMenuButton.CanUserResizeVertically" Value="True" />
                            </MultiTrigger.Conditions>
                            <Setter TargetName="PART_ResizeThumb" Value="{StaticResource é}" Property="FrameworkElement.Style" />
                        </MultiTrigger>
                        <Trigger Property="ItemsControl.HasItems" Value="False">
                            <Setter TargetName="PART_ToggleButton" Value="{x:Null}" Property="ribbon:RibbonTwoLineText.PathData" />
                        </Trigger>
                        <Trigger SourceName="PART_Popup" Property="Popup.HasDropShadow" Value="True">
                            <Setter TargetName="Shadow" Property="FrameworkElement.Margin" Value="0,0,5,5" />
                            <Setter TargetName="Shadow" Value="{StaticResource Õ}" Property="classic:SystemDropShadowChrome.Color" />
                        </Trigger>
                        <Trigger SourceName="PART_Popup" Property="Popup.IsOpen" Value="False">
                            <Setter TargetName="PART_Popup" Property="Popup.PopupAnimation" Value="None" />
                        </Trigger>
                        <DataTrigger Value="True" Binding="{Binding Path=HighContrast, Source={x:Static shell:SystemParameters2.Current}}">
                            <Setter TargetName="BackgroundCanvas" Property="UIElement.Visibility" Value="Collapsed" />
                            <Setter TargetName="Shadow" Property="classic:SystemDropShadowChrome.Color" Value="Transparent" />
                            <Setter TargetName="PART_Popup" Property="Popup.PopupAnimation" Value="None" />
                            <Setter TargetName="PART_SubMenuScrollViewer" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}" Property="Control.Foreground" />
                            <Setter TargetName="MenuBorder" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" Property="Border.BorderBrush" />
                            <Setter TargetName="MenuBorder" Value="{DynamicResource {x:Static SystemColors.MenuBrushKey}}" Property="Border.Background" />
                            <Setter TargetName="MenuBorder" Property="Border.CornerRadius" Value="0" />
                            <Setter TargetName="ResizeControl" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" Property="Border.BorderBrush" />
                            <Setter TargetName="ResizeControl" Value="{DynamicResource {x:Static SystemColors.MenuBrushKey}}" Property="Border.Background" />
                            <Setter TargetName="SubMenuInnerBorder" Property="Border.Background" Value="#00FFFFFF" />
                            <Setter TargetName="SubMenuInnerBorder" Property="Border.CornerRadius" Value="0" />
                            <Setter TargetName="MainGrid" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" Property="TextElement.Foreground" />
                        </DataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsEnabled}" Value="False" />
                                <Condition Binding="{Binding Path=HighContrast, Source={x:Static shell:SystemParameters2.Current}}" Value="True" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="MainGrid" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" Property="TextElement.Foreground" />
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="ribbon:RibbonMenuButton.IsDropDownOpen" Value="True">
                <Setter Property="ToolTipService.IsEnabled" Value="False" />
            </Trigger>
        </Style.Triggers>
    </Style>
    

    Anyway I suggest you to browse it by your own, in order to "discover" specific details that you may need to know for your project.