Customize button content on click trigger button in xaml

Question

I would like to set the contents of a button using a trigger in XAML without writing code:

Each time the button is pressed, the contents should be changed: Something like pressing the button for the first time, button contents = "Hello", second press, button contents = "Bye", third time click, button contents = "Hello" again.

<Button x:Name="btn" Content="Hi"> <Button.Triggers> <EventTrigger RoutedEvent="Button.Click"> <BeginStoryboard> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.Target="{x:Reference btn}" Storyboard.TargetProperty="Content"> <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Bye"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </BeginStoryboard> <StopStoryboard> </StopStoryboard> </EventTrigger> </Button.Triggers> </Button> 

So, it works to set the button content once before Bye, but how to set it back to Hi the next time you press

I'm also not sure if this is the most efficient way to set a trigger, if you have a better solution, feel free to.

Answer 1

You need a button with two states that look exactly like ToggleButton. Here is the style that changes the content as you want:

 <Style x:Key="ToggleButtonStyle1" TargetType="{x:Type ToggleButton}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type ToggleButton}"> <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True"> <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> </Border> <ControlTemplate.Triggers> <Trigger Property="Button.IsDefaulted" Value="True"> <Setter Property="BorderBrush" TargetName="border" Value="Red"/> </Trigger> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" TargetName="border" Value="#FFBEE6FD"/> <Setter Property="BorderBrush" TargetName="border" Value="#FF3C7FB1"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter Property="Background" TargetName="border" Value="#FFC4E5F6"/> <Setter Property="BorderBrush" TargetName="border" Value="#FF2C628B"/> </Trigger> <Trigger Property="IsChecked" Value="True"> <Setter Property="Content" TargetName="contentPresenter" Value="Bye"/> </Trigger> <Trigger Property="IsEnabled" Value="False"> <Setter Property="Background" TargetName="border" Value="#FFF4F4F4"/> <Setter Property="BorderBrush" TargetName="border" Value="#FFADB2B5"/> <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style>