Change foreground color of merged cell

[Renier Pretorius]

Hi,

I am trying to conditionally format the contents of merged cells. For this I have implemented a MergedCellStyleSelector as per the examples. The setters all work as expected except for setting the foreground color. If I look at the live visual tree in VS I can see that the data gets presented in a text block which does not inherit from the foreground property set on the conditional style.

public class MergedSlotStyleSelector : StyleSelector
{
    public override Style SelectStyle(object item, DependencyObject container)
    {
        var info = item as MergedCellInfo;
        var cell = container as GridViewMergedCell;
        var column = cell.DataColumn;
        var ctx = cell.DataContext as MainViewModel;
        var vm = ctx.SectionElements.OrderBy(o=>o.Sequence).ToArray()[info.VerticalStart];

        var baseStyle = Application.Current.Resources["GridViewMergedCellStyle"] as Style;
        var background = new SolidColorBrush(Telerik.Windows.Controls.FluentPalette.Palette.AccentColor);
        var foreground = new SolidColorBrush(Telerik.Windows.Controls.FluentPalette.Palette.PrimaryMouseOverColor);
        var style = new Style(typeof(GridViewMergedCell), baseStyle);
        style.Setters.Add(new Setter(GridViewMergedCell.VerticalContentAlignmentProperty, VerticalAlignment.Center));
        style.Setters.Add(new Setter(GridViewMergedCell.HorizontalContentAlignmentProperty, HorizontalAlignment.Right));
        if (vm.IsRulingSegment)
        {
            style.Setters.Add(new Setter(GridViewMergedCell.BackgroundProperty, background)); //<-- THIS WORKS
            style.Setters.Add(new Setter(GridViewMergedCell.ForegroundProperty, foreground)); //<-- THIS DOES NOT WORK
            style.Setters.Add(new Setter(GridViewMergedCell.FontWeightProperty, FontWeights.Bold)); //<-- THIS WORKS
        }
        return style;
    }
}

[Dinko | Tech Support Engineer]

Hi Renier,

Thank you for the provided code snippet.

I have tested your scenario but wasn't able to reproduce this behavior. I am attaching the sample project, which I used to test your case. When I run the project, the Foreground property is changed. Can you try it on your side and let me know how it goes on your side?

Regards,
Dinko
Progress Telerik

[Renier Pretorius]

Hi Dinko,

It took some time for me to get back to this. While your test app worked on my side as well - it does not work in my actual application. I suspect it has something to do with the implicit style theme I am using.

I have just upgraded by application to Q1 2020 release and suddenly also noted a semi-transparent overlay over the merged cells. On investigating the actual style (Fluent Theme) definition in XAML I noted that the ContolTemplate GridViewMergedCellTemplate specified a border component MergedCellBackgroundOverlay with a color set to the marker brush of the theme.

Changing this to transparent fixed the overlay issue for me, but also made me look deeper into the ContentTemplate's definition. On this I noted that the ContentPresenter was defined as

<ContentPresenter x:Name="PART_ContentPresenter"
                   TextBlock.Foreground="{telerik1:FluentResource ResourceKey=MarkerBrush}"
                   Margin="{TemplateBinding Padding}"
                   Content="{TemplateBinding Content}"
                   ContentTemplate="{TemplateBinding ContentTemplate}"
                   VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                   HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>

 

Which I changed to

<ContentPresenter x:Name="PART_ContentPresenter"
                    TextBlock.Foreground="{TemplateBinding Foreground}"
                    Margin="{TemplateBinding Padding}"
                    Content="{TemplateBinding Content}"
                    ContentTemplate="{TemplateBinding ContentTemplate}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>

binding the TextBlock.Foreground property through TemplateBinding to the Foreground property. Now the selector behaves as expected.

I did all this in a derived style MyGridViewMergedCellTemplate.

Hope this is useful for others experiencing the same.

Regards