Ho una serie di pulsanti a cui voglio applicare un’immagine, tramite stile, che deve presentarsi in modo differente secondo che il pulsante sia abilitato o disabilitato (comportamento non automatico in WPF).
Passi:
1. Ho creato un ResourceDictionary che contenga lo stile per tutta l’applicazione:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- IMMAGINE PULSANTE -->
<Style x:Key="ImmaginePulsante" TargetType="Image">
<Style.Triggers>
<!-- opacità dipendente dall'abilitazione del pulsante -->
<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}, AncestorLevel=1}, Path=IsEnabled}" Value="False">
<Setter Property="Opacity" Value="0.20"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
<!-- -->
<!-- NAVIGATORE ============================================= -->
<!-- pulsanti -->
<Style x:Key="PulsanteNavigatore" TargetType="Button">
<Setter Property="Margin" Value="1"></Setter>
<Setter Property="Height" Value="Auto"></Setter>
<Setter Property="Width" Value="Auto"></Setter>
</Style>
<!-- immagini dei pulsanti -->
<Style x:Key="ImmagineNavigatore" BasedOn="{StaticResource ImmaginePulsante}" TargetType="Image">
<Setter Property="Height" Value="34"></Setter>
<Setter Property="Width" Value="34"></Setter>
<Setter Property="Stretch" Value="Fill"></Setter>
</Style>
<Style x:Key="ImmaginePrimo" BasedOn="{StaticResource ImmagineNavigatore}" TargetType="Image">
<Setter Property="Source" Value="..\Immagini\primo.png"></Setter>
</Style>
<Style x:Key="ImmaginePrecedente" BasedOn="{StaticResource ImmagineNavigatore}" TargetType="Image">
<Setter Property="Source" Value="..\Immagini\precedente.png"></Setter>
</Style>
...ecc...
</ResourceDictionary>
Nello stile si notano: il trigger che modifica l’opacità dell’immagine secondo il valore della proprietà IsEnabled del pulsante che lo contiene; la proprietà BasedOn che permette di innestare gli stili come con i css!
2. Ho agganciato lo stile generale a tutta l’applicazione nel file Application.xaml:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Styles\GeneralStyle.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
3. Ho applicato gli stili ai miei pulsanti e le loro immagini:
<Button Style="{StaticResource PulsanteNavigatore}" Command="{x:Static local:MyCommands.MoveFirst}" >
<Image Style="{StaticResource ImmaginePrimo}"></Image>
</Button>
<Button Style="{StaticResource PulsanteNavigatore}" Command="{x:Static local:MyCommands.MovePrevious}" >
<Image Style="{StaticResource ImmaginePrecedente}"></Image>
</Button>