WPF Cambia immagine di sfondo del pulsante quando si fa clic su

Question

Ho creato uno Button e ne ho impostato lo sfondo Image. Quello che voglio è quando si fa clic sullo Button, voglio sostituire lo sfondo Image con un altro

Come posso realizzare questo?

Ecco il mio codice con il Button:

<Button x:Name="PopulationReporting" Click="PopulationReporting_Clicked" Width="172" 
     Height="60" Margin="57,170,57,184"> 
    <Button.Background > 
     <ImageBrush ImageSource="images/img-2.png" /> 
    </Button.Background> 
</Button> 

Answer 1

Si può fare questo a livello di codice (vedi esempio here)

o

È possibile utilizzare DataTriggers, dove il DataTrigger è associato a un bool nel tuo ViewModel e modifica lo Style del tuo Button. Lo Button è associato a Command, pertanto, quando viene eseguito, lo Command modificherà lo stato di image (la proprietà isPlaying).

XAML:

<Button Height="23" HorizontalAlignment="Left" Margin="70,272,0,0" Name="buttonPlay" VerticalAlignment="Top" Width="75" Command="{Binding PlayCommand}" CommandParameter="{Binding ElementName=ButtonImage, Path=Source}" > 
     <Image Name="ButtonImage"> 
      <Image.Style> 
       <Style TargetType="{x:Type Image}"> 
        <Style.Triggers> 
         <DataTrigger Binding="{Binding isPlaying}" Value="True"> 
          <Setter Property="Source" Value="Play.png" /> 
         </DataTrigger> 
         <DataTrigger Binding="{Binding isPlaying}" Value="False"> 
          <Setter Property="Source" Value="Stop.png" /> 
         </DataTrigger> 
        </Style.Triggers> 
       </Style> 
      </Image.Style> 
     </Image> 
</Button> 

C#:

public partial class MainWindow : Window 
{ 
    public MainWindow() 
    { 
     InitializeComponent(); 
     this.DataContext = new ViewModel(); 
    } 
} 

public class ViewModel : INotifyPropertyChanged 
{ 
    private bool _isPlaying = false; 
    private RelayCommand _playCommand; 

    public ViewModel() 
    { 
     isPlaying = false; 
    } 

    public bool isPlaying 
    { 
     get { return _isPlaying; } 
     set 
     { 
      _isPlaying = value; 
      OnPropertyChanged("isPlaying"); 
     } 
    } 

    public ICommand PlayCommand 
    { 
     get 
     { 
      return _playCommand ?? new RelayCommand((x) => 
      { 
       var buttonType = x.ToString(); 

       if (null != buttonType) 
       { 
        if (buttonType.Contains("Play")) 
        { 
         isPlaying = false; 
        } 
        else if (buttonType.Contains("Stop")) 
        { 
         isPlaying = true; 
        } 
       } 
      }); 
     } 
    } 

    public event PropertyChangedEventHandler PropertyChanged; 
    public void OnPropertyChanged(string propertyName) 
    { 
     if (PropertyChanged != null) 
     { 
      PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 
} 

public class RelayCommand : ICommand 
{ 
    private readonly Predicate<object> _canExecute; 
    private readonly Action<object> _execute; 

    public event EventHandler CanExecuteChanged; 

    public RelayCommand(Action<object> execute) : this(execute, null) { } 

    public RelayCommand(Action<object> execute, Predicate<object> canExecute) 
    { 
     _execute = execute; 
     _canExecute = canExecute; 
    } 

    public bool CanExecute(object parameter) 
    { 

     if (_canExecute == null) 
     { 
      return true; 
     } 

     return _canExecute(parameter); 
    } 

    public void Execute(object parameter) 
    { 
     _execute(parameter); 
    } 

    public void RaiseCanExecuteChanged() 
    { 
     if (CanExecuteChanged != null) 
     { 
      CanExecuteChanged(this, EventArgs.Empty); 
     } 
    } 
}