This is a migrated thread and some comments may be shown as answers.

Change foreground color of merged cell

2 Answers 22 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Renier Pretorius
Top achievements
Rank 1
Renier Pretorius asked on 10 Dec 2019, 07:16 PM

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;
    }
}

2 Answers, 1 is accepted

Sort by
0
Dinko
Telerik team
answered on 13 Dec 2019, 11:49 AM

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

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Renier Pretorius
Top achievements
Rank 1
answered on 16 Mar 2020, 07:47 AM

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

 

Tags
GridView
Asked by
Renier Pretorius
Top achievements
Rank 1
Answers by
Dinko
Telerik team
Renier Pretorius
Top achievements
Rank 1
Share this question
or