In Development
Last Updated: 25 Jun 2025 07:01 by ADMIN
Stenly
Created on: 20 Jun 2025 09:27
Category: RibbonView
Type: Bug Report
0
RibbonView: RibbonWindow's maximize icon is updated between its states in the Office2019 theme

Using the RadRibbonWindow with the Office2019 theme, the maximize icon is updated when the button is interacted with (it does not change between the maximized and normal states). 

To work around this behavior, extract the default ControlTemplate of the RadRibbonWindow element and add an additional Setter with TargetName="maximizeButton" for its Content property, to the Trigger for the WindowState property when its value is set to Maximized. For the Value property of the added Setter, create a new RadGlyph element and set its Glyph property to GlyphWindowCollapse.

The following code snippet showcases this suggestion's implementation:

<Style TargetType="telerik:RadRibbonWindow" BasedOn="{StaticResource RadRibbonWindowStyle}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="telerik:RadRibbonWindow">
                <Border x:Name="outerBorder" Background="{TemplateBinding WindowBackground}" CornerRadius="{TemplateBinding CornerRadius}">
                    <Grid x:Name="MaximizeWindowDecorator">
                        <Grid telerik:CornerRadiusHelper.ClipRadius="{Binding ElementName=outerBorder, Path=CornerRadius}" telerik:CornerRadiusHelper.ClipRadiusOffset="{TemplateBinding telerik:CornerRadiusHelper.ClipRadiusOffset}" Margin="{TemplateBinding BorderThickness}">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="28"/>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Border Grid.Row="0" Grid.Column="1" Background="{telerik:Office2019Resource ResourceKey=HeaderBackgroundBrush}"/>
                            <Grid Grid.ColumnSpan="3">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <StackPanel x:Name="IconPanel" Orientation="Horizontal" HorizontalAlignment="Left" Visibility="{TemplateBinding IconVisibility}" VerticalAlignment="Center" Margin="4 0 0 0">
                                    <Image
                                    Name="PART_Icon"
                                    shell:WindowChrome.IsHitTestVisibleInChrome="True"
                                    Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Icon, Converter={StaticResource IconConverter}}"
                                    Width="{Binding Path=SmallIconSize.Width, Source={x:Static shell:SystemParameters2.Current}}"
                                    Height="{Binding Path=SmallIconSize.Height, Source={x:Static shell:SystemParameters2.Current}}"/>
                                    <Rectangle Width="1" Margin="4 0" Fill="{telerik:Office2019Resource ResourceKey=MainBorderBrush}"/>
                                </StackPanel>
                                <telerikRibbonViewPrimitives:WindowTitle x:Name="WindowTitle"
                                Grid.Column="1"
                                Title="{TemplateBinding Title}"
                                Style="{TemplateBinding TitleBarStyle}"
                                VerticalAlignment="Center"
                                HorizontalAlignment="Center"
                                Margin="0 0 65 0"/>
                            </Grid>
                            <StackPanel x:Name="buttonPanel" Orientation="Horizontal" Grid.ColumnSpan="3" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0 0 2 0">
                                <telerik:RadButton x:Name="minimizeButton"
                                                   shell:WindowChrome.IsHitTestVisibleInChrome="True"
                                                   ToolTipService.ToolTip="Minimize"
                                                   Command="{x:Static shell:SystemCommands.MinimizeWindowCommand}"
                                                   Style="{StaticResource RibbonWindowButtonStyle}"
                                                   CornerRadius="{Binding Path=CornerRadius.TopRight, RelativeSource={RelativeSource TemplatedParent}}">
                                    <telerik:RadButton.ToolTip>
                                        <TextBlock Text="{telerik:LocalizableResource Key=RibbonWindowMinimize}"/>
                                    </telerik:RadButton.ToolTip>
                                    <telerik:RadGlyph Glyph="{StaticResource GlyphMinimize}"/>
                                </telerik:RadButton>
                                <telerik:RadToggleButton x:Name="maximizeButton"
                                                         shell:WindowChrome.IsHitTestVisibleInChrome="True"
                                                         IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=WindowState, Converter={StaticResource BooleanToWindowStateConverter}, Mode=TwoWay}"
                                                         Style="{StaticResource RadRibbonWindowToggleButtonStyle}"
                                                         CornerRadius="{Binding Path=CornerRadius.TopRight, RelativeSource={RelativeSource TemplatedParent}}">
                                    <telerik:RadGlyph Glyph="{StaticResource GlyphWindow}"/>
                                </telerik:RadToggleButton>
                                <telerik:RadButton x:Name="closeButton"
                                                   shell:WindowChrome.IsHitTestVisibleInChrome="True"
                                                   Command="{x:Static shell:SystemCommands.CloseWindowCommand}"
                                                   Style="{StaticResource RibbonWindowButtonStyle}"
                                                   CornerRadius="{Binding Path=CornerRadius.TopRight, RelativeSource={RelativeSource TemplatedParent}}">
                                    <telerik:RadButton.ToolTip>
                                        <TextBlock Text="{telerik:LocalizableResource Key=RibbonWindowClose}"/>
                                    </telerik:RadButton.ToolTip>
                                    <telerik:RadGlyph Glyph="{StaticResource GlyphClose}"/>
                                </telerik:RadButton>
                            </StackPanel>
                            <Border x:Name="PART_ClientAreaBorder" Grid.Column="1" Grid.Row="1" Margin="0 12 0 0" Background="{TemplateBinding Background}"/>
                            <AdornerDecorator x:Name="Adorner" Grid.Column="1" Grid.RowSpan="2">
                                <ContentPresenter Canvas.ZIndex="0" Name="PART_RootContentPresenter"/>
                            </AdornerDecorator>
                            <ResizeGrip x:Name="WindowResizeGrip"
                            Grid.Row="1"
                            Grid.Column="1"
                            shell:WindowChrome.ResizeGripDirection="BottomRight"
                            HorizontalAlignment="Right"
                            VerticalAlignment="Bottom"
                            Visibility="Collapsed"
                            IsTabStop="False"/>
                        </Grid>
                        <Border Background="{x:Null}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="Window.ResizeMode" Value="CanResizeWithGrip"/>
                            <Condition Property="Window.WindowState" Value="Normal"/>
                        </MultiTrigger.Conditions>
                        <Setter TargetName="WindowResizeGrip" Property="Visibility" Value="Visible"/>
                    </MultiTrigger>
                    <Trigger Property="Window.ResizeMode" Value="NoResize">
                        <Setter TargetName="minimizeButton" Property="Visibility" Value="Collapsed"/>
                        <Setter TargetName="maximizeButton" Property="Visibility" Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="Window.ResizeMode" Value="CanMinimize">
                        <Setter TargetName="maximizeButton" Property="IsEnabled" Value="False"/>
                    </Trigger>
                    <Trigger Property="WindowState" Value="Maximized">
                        <Setter TargetName="MaximizeWindowDecorator" Property="Margin" Value="6"/>
                        <Setter TargetName="maximizeButton" Property="Content">
                            <Setter.Value>
                                <telerik:RadGlyph Glyph="{StaticResource GlyphWindowCollapse}"/>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="CornerRadius" Value="0"/>
                    </Trigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="telerik:RadRibbonWindow.IsAutoHideTaskbar" Value="true"/>
                            <Condition Property="Window.WindowState" Value="Maximized"/>
                        </MultiTrigger.Conditions>
                        <Setter TargetName="MaximizeWindowDecorator" Property="Margin" Value="-7 -2 -7 -6"/>
                    </MultiTrigger>
                    <Trigger Property="IsTitleVisible" Value="False">
                        <Setter TargetName="WindowTitle" Property="Visibility" Value="Collapsed"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

0 comments