WPF: How can I adjust the style of disabled text boxes?

Question

If I want to change the background color of all disabled text boxes -- to make it more obvious that they are disabled -- how would I do this? I would like to change them to a darker grey color in particular, but an answer about styling of DISABLED inputs in general would be fine.

Answer 1

If you want a quick solution without having to re-template the entire control:-

<Style TargetType="TextBox">
  <Style.Triggers>
    <Trigger Property="IsEnabled" Value="false">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="TextBox">
            <Border Background="LightGray" BorderBrush="Gray" BorderThickness="1">
              <TextBlock Text="{TemplateBinding Text}" Padding="2" />
            </Border>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Trigger>
  </Style.Triggers>
</Style>

Answer 2

There is no style property exposed for the disabled color -- so you will have to modify the default ControlTemplate. To change the background color, it looks like you should be able to just copy-paste, and modify the one brush:

<Color x:Key="DisabledControlLightColor">#FFE8EDF9</Color>

---

Edit by "copy-paste", I mean you have to copy-paste the whole style into your resources:

<!--Control colors.-->
<Color x:Key="DisabledControlLightColor">Pink</Color> <!-- #FFE8EDF9-->


<Color x:Key="WindowColor">#FFE8EDF9</Color>
<Color x:Key="ContentAreaColorLight">#FFC5CBF9</Color>
<Color x:Key="ContentAreaColorDark">#FF7381F9</Color>

<Color x:Key="DisabledControlDarkColor">#FFC5CBF9</Color>
<Color x:Key="DisabledForegroundColor">#FF888888</Color>

<Color x:Key="SelectedBackgroundColor">#FFC5CBF9</Color>
<Color x:Key="SelectedUnfocusedColor">#FFDDDDDD</Color>

<Color x:Key="ControlLightColor">White</Color>
<Color x:Key="ControlMediumColor">#FF7381F9</Color>
<Color x:Key="ControlDarkColor">#FF211AA9</Color>

<Color x:Key="ControlMouseOverColor">#FF3843C4</Color>
<Color x:Key="ControlPressedColor">#FF211AA9</Color>


<Color x:Key="GlyphColor">#FF444444</Color>
<Color x:Key="GlyphMouseOver">sc#1, 0.004391443, 0.002428215, 0.242281124</Color>

<!--Border colors-->
<Color x:Key="BorderLightColor">#FFCCCCCC</Color>
<Color x:Key="BorderMediumColor">#FF888888</Color>
<Color x:Key="BorderDarkColor">#FF444444</Color>

<Color x:Key="PressedBorderLightColor">#FF888888</Color>
<Color x:Key="PressedBorderDarkColor">#FF444444</Color>

<Color x:Key="DisabledBorderLightColor">#FFAAAAAA</Color>
<Color x:Key="DisabledBorderDarkColor">#FF888888</Color>

<Color x:Key="DefaultBorderBrushDarkColor">Black</Color>

<!--Control-specific resources.-->
<Color x:Key="HeaderTopColor">#FFC5CBF9</Color>
<Color x:Key="DatagridCurrentCellBorderColor">Black</Color>
<Color x:Key="SliderTrackDarkColor">#FFC5CBF9</Color>

<Color x:Key="NavButtonFrameColor">#FF3843C4</Color>

<LinearGradientBrush x:Key="MenuPopupBrush"
                 EndPoint="0.5,1"
                 StartPoint="0.5,0">
    <GradientStop Color="{DynamicResource ControlLightColor}"
            Offset="0" />
    <GradientStop Color="{DynamicResource ControlMediumColor}"
            Offset="0.5" />
    <GradientStop Color="{DynamicResource ControlLightColor}"
            Offset="1" />
</LinearGradientBrush>

<LinearGradientBrush x:Key="ProgressBarIndicatorAnimatedFill"
                 StartPoint="0,0"
                 EndPoint="1,0">
    <LinearGradientBrush.GradientStops>
        <GradientStopCollection>
            <GradientStop Color="#000000FF"
                Offset="0" />
            <GradientStop Color="#600000FF"
                Offset="0.4" />
            <GradientStop Color="#600000FF"
                Offset="0.6" />
            <GradientStop Color="#000000FF"
                Offset="1" />
        </GradientStopCollection>
    </LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<Style TargetType="{x:Type TextBox}">
    <Setter Property="SnapsToDevicePixels"
      Value="True" />
    <Setter Property="OverridesDefaultStyle"
      Value="True" />
    <Setter Property="KeyboardNavigation.TabNavigation"
      Value="None" />
    <Setter Property="FocusVisualStyle"
      Value="{x:Null}" />
    <Setter Property="MinWidth"
      Value="120" />
    <Setter Property="MinHeight"
      Value="20" />
    <Setter Property="AllowDrop"
      Value="true" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TextBoxBase}">
                <Border Name="Border"
            CornerRadius="2"
            Padding="2"
            BorderThickness="1">
                    <Border.Background>
                        <SolidColorBrush Color="{DynamicResource ControlLightColor}" />
                    </Border.Background>
                    <Border.BorderBrush>
                        <SolidColorBrush Color="{DynamicResource BorderMediumColor}" />
                    </Border.BorderBrush>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                            Storyboard.TargetProperty="(Panel.Background).
                (SolidColorBrush.Color)">
                                        <EasingColorKeyFrame KeyTime="0"
                                     Value="{StaticResource DisabledControlLightColor}" />
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="ReadOnly">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                            Storyboard.TargetProperty="(Panel.Background).
                (SolidColorBrush.Color)">
                                        <EasingColorKeyFrame KeyTime="0"
                                     Value="{StaticResource DisabledControlDarkColor}" />
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="MouseOver" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ScrollViewer Margin="0"
                    x:Name="PART_ContentHost" />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>