CODEWITHSUNDEEP
wpfxamltriggersdatatrigger
KaluSinghRao
KaluSinghRao

Reputation: 95

Background color is not changing in DataTrigger

I have some problem while changing background color of Button using datatrigger but it is not happen.

My code is this

<Window x:Class="DataBinding.DataTrigger2"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="DataTrigger2" Height="300" Width="300">
<Button Height="50" Name="btn">
    <Button.Style>
        <Style TargetType="Button">
            <Setter Property="Control.Background" Value="YellowGreen"></Setter>
            <Setter Property="Control.Foreground" Value="Brown"></Setter>
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=btn, Path=IsPressed}" Value="True">
                    <Setter Property="Control.Background" Value="Purple"></Setter>
                    <Setter Property="Control.Foreground" Value="Red"></Setter>
                    <Setter Property="Control.FontSize" Value="20"></Setter>
                    <Setter Property="Control.FontWeight" Value="Light"></Setter>
                    <Setter Property="Control.Width" Value="150"></Setter>
                    <Setter Property="Control.Height" Value="50"></Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
    <Button.Content>
        The Gaming World Inc.
    </Button.Content>
</Button>

Upvotes: 0

Views: 4194

Answers (1)

Sheridan
Sheridan

Reputation: 69979

The reason why you don't see the Button.Background colour change when you click the mouse is because of the default ControlTemplate that defines what the it should look like in different states, eg. pressed, disabled. etc. These are defined in the VisualStateManager.VisualStateGroups section of the ControlTemplate and they potentially override your Background changes.

As simple proof of this, we can provide a basic ControlTemplate for the Button without the VisualStateManager.VisualStateGroups section and then you will see your Background colour change. Try this:

<Button Height="50" Name="btn">
        <Button.Style>
            <Style TargetType="Button">
                <Setter Property="Control.Background" Value="YellowGreen"></Setter>
                <Setter Property="Control.Foreground" Value="Brown"></Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type Button}">
                            <Border Background="{TemplateBinding Background}">
                                <ContentPresenter />
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=btn, Path=IsPressed}" Value="True">
                        <Setter Property="Control.Background" Value="Purple"></Setter>
                        <Setter Property="Control.Foreground" Value="Red"></Setter>
                        <Setter Property="Control.FontSize" Value="20"></Setter>
                        <Setter Property="Control.FontWeight" Value="Light"></Setter>
                        <Setter Property="Control.Width" Value="150"></Setter>
                        <Setter Property="Control.Height" Value="50"></Setter>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
        <Button.Content>
            The Gaming World Inc.
        </Button.Content>
    </Button>

You can find the original/default ControlTemplate for the Button control in the Button Styles and Templates page on MSDN... you may want to copy more of that ControlTemplate into your one to make your Button look more like the original one.

Upvotes: 1

Related Questions