In WPF, to change the background image on button click, we can use ToggleButton. In ToggleButton, we can check whether its checked or not. We use DataTrigger to check its property.
Here, below is the example of this:
In XAML:
Creating button style:
<Style x:Key="ButtonStyle" TargetType="{x:Type ToggleButton}">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border Background="Transparent" >
<ContentPresenter/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Adding style to ToggleButton:
<ToggleButton Grid.Column="0" Grid.Row="0" Name="Deletebutton" Style="{StaticResource ButtonStyle}" Margin="200,100,100,100" >
<StackPanel Orientation="Horizontal">
<Image x:Name="imgDelete" Width="50" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center">
<Image.Style>
<Style TargetType="{x:Type Image}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsChecked, ElementName=Deletebutton}" Value="True">
<Setter Property="Source" Value="Images\default_delete.png" />
</DataTrigger>
<DataTrigger Binding="{Binding IsChecked, ElementName=Deletebutton}" Value="False">
<Setter Property="Source" Value="Images\active_delete.png" />
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
</StackPanel>
</ToggleButton>
Hope, this code will help you. Thanks.
0 Comment(s)