WPF, Telerik: Change control style when disabled

Question

I have a trouble with Telerik control.

<Style x:Key="RadDropDownButtonStyle" TargetType="telerik:RadDropDownButton">
<Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerik:RadDropDownButton">
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Foreground"  Value="Red" />...

So, this handles Disabled property. Text changes its color, but it is not contrast, something like watermark.

How can I disable this? And make disabled control more contrast?

Answer 1

Text changes its color, but it is not contrast, something like watermark.

For future references, this is caused by the Opacity property. When the opacity is lower than 1 it becomes lighter.

The problem you are describing is something very familiar. And I'm afraid there isn't any great way to get rid of this, so much so that the best advise that I can give you is to not even bother. If anything, it will just make using the themes and styles a real pain.

However there is an easy way to get your desired behaviour by replacing the IsEnabled="False" property with IsHitTestVisible="False" and Focusable="False"
These will make it impossible to click or focus the control by keyboard navigation, basically making it disabled. Now you can add some more style properties to make it look the way you believe a disabled control should look like. By for example setting the wanted Foreground and Background or you could even use an Opacity closer to 1 (ex: 0.9) which will make it less dark than the original but still dark enough to read properly.

I hope this helps you with your current problem, just leave a comment if you want me to clarify further.

---

EDIT 1: Apperently can overwrite the opacity change by using your own DataTemplate for the control. How to have 100% opacity even when control is disabled in wpf C#

---

EDIT 2: I'll give you an example of how to use the other properties correctly.

This is how you would define a disabled button normally, and doing so will make the text lighter and less readable.

<!-- Simple disabled button -->
<telerik:RadButton Content="Test Button 1" IsEnabled="False" />

<!-- Button with binding on IsEnabled -->
<telerik:RadButton Content="Test Button 2" IsEnabled="{Binding MyBinding}" />

Now I'll show you how you can mimic these results by using the properties IsHitTestVisible and Focusable .

<!-- Simple disabled button -->
<telerik:RadButton Content="Test Button 1" IsHitTestVisible="False" Focusable="False" />

<!-- Button with binding on IsEnabled -->
<telerik:RadButton Content="Test Button 2" IsHitTestVisible="{Binding MyBinding}" Focusable="{Binding MyBinding}" />

In the above examples, the buttons will look as if they are still enabled. However you won't be able to focus or click them. Of course we do want to see some difference to be able to tell that they can't be used.

<!-- Styled disabled button -->
<telerik:RadButton Content="Test Button 1" IsHitTestVisible="False" Focusable="False" >
    <telerik:RadButton.Style>
        <Style TargetType="telerik:RadButton">
            <Style.Triggers>
                <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=Self}, Path=IsHitTestVisible}" Value="False">
                    <Setter Property="Opacity" Value="0.8"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </telerik:RadButton.Style>
</telerik:RadButton>