Header Text dissapears when Style changes in code

[Dave]

Hello, I have a RadTileView where I want to change the header background color when the tile gets minimized.
When I apply the new style the header text disappears, this doesn't happen when the new style is the same as the old one

(I know this example only works when all items are minimized, not when you maximize another item, but this is just for test purposes)

C#:

private void RadTileViewItem_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    RadTileViewItem item = (sender as RadTileViewItem);
    if (item.TileState == TileViewItemState.Maximized)
    {
        item.TileState = TileViewItemState.Minimized;
        item.HeaderStyle = (Style)FindResource("TileViewItemHeaderStyle4");
    }
    else
    {
        item.TileState = TileViewItemState.Maximized;
    }
}

XAML:

<UserControl xmlns:my="clr-namespace:WpfApplication1"  x:Class="WpfApplication1.NodeView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
             xmlns:TileView="clr-namespace:Telerik.Windows.Controls.TileView;assembly=Telerik.Windows.Controls.Navigation"           >
    <UserControl.Resources>
        <Style x:Key="TileViewItemHeaderStyle1" TargetType="{x:Type TileView:TileViewItemHeader}">
            <Setter Property="Background" Value="red">
            </Setter>
        </Style>
        <Style x:Key="TileViewItemHeaderStyle2" TargetType="{x:Type TileView:TileViewItemHeader}">
            <Setter Property="Background" Value="Orange">
            </Setter>
        </Style>
        <Style x:Key="TileViewItemHeaderStyle3" TargetType="{x:Type TileView:TileViewItemHeader}">
            <Setter Property="Background" Value="Green">
            </Setter>
        </Style>
        <Style x:Key="TileViewItemHeaderStyle4" TargetType="{x:Type TileView:TileViewItemHeader}">
            <Setter Property="Background" Value="Blue">
            </Setter>
        </Style>
    </UserControl.Resources>
    <Grid>

        <telerik:RadTileView Name="radTileView1"  MinimizedColumnWidth="300" MinimizedRowHeight="155" VerticalAlignment="Top" IsVirtualizing="True"  Grid.ColumnSpan="3">
            <telerik:RadTileViewItem Header="Node Back Left"  HeaderStyle="{StaticResource TileViewItemHeaderStyle1}" MouseLeftButtonUp="RadTileViewItem_MouseLeftButtonUp"/>
            <telerik:RadTileViewItem Header="Node Back Right" HeaderStyle="{StaticResource TileViewItemHeaderStyle2}" MouseLeftButtonUp="RadTileViewItem_MouseLeftButtonUp"/>
            <telerik:RadTileViewItem Header="Node Front Left" HeaderStyle="{StaticResource TileViewItemHeaderStyle3}" MouseLeftButtonUp="RadTileViewItem_MouseLeftButtonUp"/>
            <telerik:RadTileViewItem Header="Node Front Right" HeaderStyle="{StaticResource TileViewItemHeaderStyle4}" MouseLeftButtonUp="RadTileViewItem_MouseLeftButtonUp"/>
            <telerik:RadTileViewItem Header="Node Center" HeaderStyle="{StaticResource TileViewItemHeaderStyle3}" MouseLeftButtonUp="RadTileViewItem_MouseLeftButtonUp">
            </telerik:RadTileViewItem>
        </telerik:RadTileView>
    </Grid>
</UserControl>

A

[Lancelot]

Hi Euroscan,

  I was able to reproduce the strange behavior of the header as it changed state back to maximized. I also was able to find a workaround for you.

  In my attached image, you'll see that all I needed to do was add an additional setter to the Style4 you defined. By explicitly declaring the foreground should stay black, the issue did not happen again.

This method maintained the visibility of the header throughout any state changes.

Good Luck,
Lancelot