WPF changing button background on click

Question

I have a set of buttons in a side panel. I want to change the background of the button that has been clicked. I have tried to do that using style.trigger and the only property I could think of is IsPressed, but that doesn't help that much since it changes the background for a second (till the button is pressed [duh]).

This is the code I've tried:

<Style.Triggers>
<Trigger Property="IsPressed" Value="True">
    <Setter Property="Background" Value="SlateGray" />
    <Setter Property="Foreground" Value="White"></Setter>
</Trigger>
</Style.Triggers>

Another way I could think of was creating individual style for each button with a datatrigger since I've a property that changes with the selection of the button, but that seems like a overkill. Any idea how can I highlight a button that has been clicked?

Maximus · Accepted Answer · 2014-08-20T21:50:08.933

This kind of trigger runs when your condition is fulfilled and then the effect disappears. In order to set for good instead of a while take a look at this

<Button Content="Content" Background="Red">
        <Button.Triggers>
            <EventTrigger RoutedEvent="MouseEnter">
                <BeginStoryboard>
                    <Storyboard>
                        <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" To="CadetBlue"/>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Button.Triggers>
    </Button>

Since IsPressed is not a RoutedEvent you can use this

 <Button Content="Content" Background="Red">
        <Button.Style>
            <Style TargetType="Button">
                <Style.Triggers>
                    <Trigger Property="IsPressed" Value="True">
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" To="CadetBlue"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>

+1, except OP probably wants "Click" instead of "MouseEnter". — McGarnagle, Aug 20 '14 at 21:47
IsPressed is not a RoutedEvent, hold on a second I will update. — Maximus, Aug 20 '14 at 21:48
Works. Though there's some animation we can get rid of that. But I also had to "unset" the background when other button was selected. So I ended up creating style for each single button, till I find sth better. — SZT, Aug 20 '14 at 23:52
You can create one style for all Buttons or apply one Style to many buttons instead of creating new style in every button. — Maximus, Aug 21 '14 at 07:12

score 0 · Answer 2 · answered Sep 07 '21 at 06:01

<UserControl.Resources>
    <Style TargetType="{x:Type Button}">
        <Setter Property="Background" Value="Green"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border Background="{TemplateBinding Background}" BorderBrush="Black" BorderThickness="1">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsFocused" Value="True">
                <Setter Property="Background" Value="Red"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</UserControl.Resources>
<Grid RenderTransformOrigin="0.578,0.503">
    <Button Width="100" Height="50" Margin="265,265,435,135"/>
    <Button Height="50" Margin="400,202,302,198"/>
</Grid>

While this code snippet may solve the question, [including an explanation](http://meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers) really helps to improve the quality of your post. Remember that you are answering the question for readers in the future, and those people might not know the reasons for your code suggestion. — Gerhard, Sep 07 '21 at 06:21

WPF changing button background on click

2 Answers2

Linked