windows WPF and XAML button changeing

Question

I am trying to make 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 follow. 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

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.

Answer 2

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}"/>