windows WPF and XAML button changing

Question

I am trying to make a play/pause Button . When the Play Button is clicked, it will bind to the StartStopWatch command. The Play Button will then change to a Pause Button which will bind to the PauseStopWatch command. My problem is. I don't know how to keep the style it has and change them interchangablly. Currently I have two different buttons, but I want to merge them together and put them as one. My buttons are as follows. I want to have it on MouseClick , it changes also! Thanks!

<Button x:Name="StartButton" Style="{DynamicResource StartTimerButton}"
        Width="24" Height="24" Margin="5,0,5,0" ToolTip="Start Timer"
        Command="{Binding StartStopWatch}" VerticalAlignment="Center"/>

<Button x:Name="StopButton" Style="{DynamicResource StopTimerButton}"
        Width="20" Height="20" Margin="0,0,5,0" ToolTip="Stop Timer"
        Command="{Binding StopStopWatch}" VerticalAlignment="Center"/>

Does anyone have any Suggestions?

Answer 1

An easy way is to use a ToggleButton and utilize its Checked and UnChecked state. You can change the ControlTemplate Theme based on that For the Command, why cant you create a Single Command for StopWatch and pass true/false as CommandParameter to distinguish the execution

<ToggleButton Name="yourToggleButton"
    Command="{Binding StartStopCommand}"
    CommandParameter="{Binding ElementName= yourToggleButton, Path=IsChecked}"/>

Answer 2

If you have a button that can be in two states, consider using ToggleButton , and bind all you want to its IsChecked property. In particular, you can bind the button's Style depending on IsChecked wholesale (using a converter), or you can just use triggers inside your style to change appearance (including tooltip) depending on the value of IsChecked .