Making disabled buttons with images look grayed (Winforms look).

      By default, when we setting button with image as content to be disabled (IsEnabled = False) the button still looks as it enabled. The simplest solution I found to fix it is to create button style, where on IsEnabled property change I changing opacity of the button. Here is how I did it:

 

The style:

<Window.Resources>

        <Style x:Key=”buttonStyle”TargetType=”{x:Type Button}”>

            <Style.Triggers>

                <Trigger Property=”IsEnabled” Value=”False”>

                    <Setter Property=”Opacity” Value=”0.3″/>

                </Trigger>

            </Style.Triggers>

        </Style>

    </Window.Resources>

 

The button:

<Button Name=”myButton” Style=”{StaticResource buttonStyle}”

 

The beauty of WPF is you can do whatever you want to do with the look of the controls. In my case I wanted disabled button to look as it looks in Winforms, but for any other situation your imagination is the only limit.

 

Point of interest – embedding resources in WPF

Here is how to do that (don’t be confused with logical resources – I talking about resources such as images):

• Add to project your image (‘Add exist item…’)
• In properties of image, set Build Action as Content or Resource. Content means your resource will be “loose” – located as is in project directory. Resource means the image will be embedded into the assembly. In my sample, I using embedded image ‘ball.jpg’. If you will look inside runtime folder (…/Debug), you will notice there is no image file, only dlls.

Download sample application from here.