Disable Fluent theme's ripple effect for RadListBox

[Philipp]

Hello,

I'm developing an application that is based on fluent theme but should not use the ripple effect.

Therefore I followed instuctions in Fluent Theme article and placed in resouces of my MainWindow.xaml

<Window.Resources>
        <Style TargetType="mat:FluentControl" >
            <Setter Property="IsRippleEnabled" Value="False" />
        </Style>
</Window.Resources>

Basically this is working fine. On controls like Buttons or NavigationView the effect disappears. Unfortunately I noticed, that in RadListBox the ripple effect is still active when mouse is over an item of the list.

I attached a small example. It contains just a listbox and a button. Fluent theme is set and ripple should be disabled. For button it works fine. Listbox items still showing the effect.

 

How can I disable the ripple effect also for listbox items?

 

Thanks and regards

Philipp

[Stenly]

Hello Philipp,

This behavior is present because inside the default control template of the RadListBoxItem control, a FluentControl element is present and its IsRippleEnabled property's value is template bound to its parent. With this in mind, you could create a new Style with TargetType="RadListBoxItem" and add a new Setter for the mat:FluentControl.IsRippleEnabled attached property.

The following code snippet shows the abovementioned logic's implementation:

<Window.Resources>
    <Style TargetType="telerik:RadListBoxItem">
        <Setter Property="mat:FluentControl.IsRippleEnabled" Value="False"/>
    </Style>
</Window.Resources>

With that said, I have attached the modified sample project, so, could you give it a try?

Regards,
Stenly
Progress Telerik

[Philipp]

Hi Stenly,

 

thanks for your response and the explanation. I understand how the approach is working. Your sample works fine and behaves like I expected.

 

Regards

Philipp