How to disable a Button with a style for Button.Content tag in WPF

Question

I have a Button like this:

<Button x:Name="CloseBtn" Click="CloseBtn_Click" IsEnabled="{Binding IsCloseEnabled}" 
                        HorizontalAlignment="Right" Style="{StaticResource TopButton}">
                    <Button.Content>
                        <StackPanel Orientation="Horizontal">
                            <Image Height="30" Width="30" Source="{StaticResource CloseIcon}" />
                            <Label Foreground="Black">Close</Label>
                        </StackPanel>
                    </Button.Content>
                </Button>

Its style is this:

<Style x:Key="TopButton" TargetType="{x:Type Button}">
            <Setter Property="Padding" Value="10,5" />
            <Style.Triggers>
                <Trigger Property="IsEnabled" Value="False">
                    <Setter Property="TextBlock.Foreground" Value="#FFADADAD"/>
                </Trigger>

            </Style.Triggers>
        </Style>

However when the binding "IsCloseEnabled" returns false, the button doesn't look like being disabled -- the color "#FFADADAD" isn't applied to the foreground. Not sure where it goes wrong.

Label Foreground="Black" - why would this change if Button Foreground changes? try to create a Binding between Label Foreground and Button Foreground — ASh

Tam Bui Tam Bui · Accepted Answer · 2020-05-26T20:27:50

Your Label has a hardset value of Foreground="Black", which will override any other color you try to apply via triggers. Remove the "Foreground=Black" and see if that fixes your problem.

Update #2: If you also want to control the image to look disabled, you're better off making the image source controlled by a style which replaces the source with a "disabled" png. Something like this:

        <Button x:Name="CloseBtn" Click="CloseBtn_Click" IsEnabled="{Binding IsCloseEnabled}" HorizontalAlignment="Right" Style="{StaticResource TopButton}">
            <Button.Content>
                <StackPanel Orientation="Horizontal">
                    <Image x:Name="myImage" Height="30" Width="30">
                        <Image.Style>
                            <Style TargetType="Image">
                                <Setter Property="Source" Value="{StaticResource CloseIcon}"/>
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding IsCloseEnabled}" Value="False">
                                        <Setter Property="Source" Value="{StaticResource CloseIconDisabled}"/>
                                    </DataTrigger>
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                        </Image.Style>
                    </Image>
                    <Label>Close</Label>
                </StackPanel>
            </Button.Content>
        </Button>

How to disable a Button with a style for Button.Content tag in WPF

1 Answers