Need help Styling FullTextSearch Matches

[Martin]

Hi 

I'm using the Fluent Theme and it causes a bit of problems with our Colorblind personel. 

Having the Red color together with the selected line gray color makes the text invisible for them. 

I therefore want to do a couple of things :

- Change the highlight color from Red to something else (Green maybe)

- Bold the Match highlight

I've managed to change the selectedline background but fail to figure out how i change the Match highlight. 

Can i get some help in that regards ?

I really suck at styling XAML and dont know how to do it other than i know i need to insert it into the APP.XAML file

[Stenly]

Hello Martin,

You can create a style targeting the telerik:HighlightTextBlock element and set the HighlightBrush property to a color of your choice. You can also bold the text by setting the FontWeight property to Bold. This style can be defined inside Window.Resources, which will be applied to every element with a type of telerik:HighlightTextBlock. The following code snippet shows how the style should look inside the resources dictionary of the window.

 <Window.Resources>
    <Style TargetType="telerik:HighlightTextBlock">
        <Setter Property="HighlightBrush" Value="Green"/>
        <Setter Property="FontWeight" Value="Bold"/>
    </Style>
 </Window.Resources> 

Please note that currently, the HighlightTextBlock does not provide a property that bolds only the text that is matched. The FontWeight property will bold the whole text of the highlighted cell. We have a feature request for this in our feedback portal, so, you could vote for it to boost its priority, as well as follow it to get notified via e-mail when its status gets changed.

That said, I have attached a sample project for your convenience.

Regards,
Stenly
Progress Telerik

[Martin]

Hi Stenly

Thanks for providing the solution. 

The Matching text is now Green - but ALL rows that matches are now bold ?

I'll go vote for the feature request that you linked to.

I'll keep the Color setter for now.

Thanks a ton !

[Stenly]

Hello Martin, 

I'm glad to hear you found my solution helpful.

I also want to let you know that since the 2021 R3 release, the Office2019 theme has a new high-contrast color variation which you may find useful. It is suitable for colorblind people, as it provides a palette with bright colors that are distinguishable from one another. You can consider using it instead of the Fluent theme.

[Martin]

Hi again ..

Just one more question. 

How do i change the background of the Highlighted Cells ? 

I looked at the Fluent Theme XAML and couldn't quite figure out how to target the inner working of the VisualStateGroup :( 

The person i'm optimizing for can't read text when colors are mixed together as they are when Cell background i teal, Text is Red, Selected row is Gray or Blue ..

[Stenly]

To change the highlighted cell color, the default control template of GridViewCell will need to be extracted. You can find the VisualState with x:Name="Highlighted" and change the color of the SolidColorBrush in the animation frame, or if the color is not wanted, you can delete the Storyboard. That said, I have modified the sample project to implement this logic.

[Martin]

Thank you very much !

I think I finally understand how to change the style now.