Remplacer le style ToggleButton - wpf, xaml

J'ai un ToggleButton dans ma fenêtre et stylémon ResourceDictionary. La raison pour laquelle cela se trouve dans le ResourceDictionary est que j'ai bientôt plusieurs ToggleButton qui doivent avoir le même aspect.

<Style x:Key="Standardbutton" TargetType="{x:Type ToggleButton}">
<Setter Property="FontSize" Value="18" />
<Setter Property="Foreground" Value="White" />
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="Resources/Standard_Button_Normal.png" />
</Setter.Value>
</Setter>
<Setter Property="Height" Value="56" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ToggleButton">
<Border Name="border" BorderThickness="0" Padding="0,0" BorderBrush="DarkGray" CornerRadius="0" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center" Name="content" Margin="15,0,0,0"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="Resources/Standard_Button_Pressed.png" />
</Setter.Value>
</Setter>
<Setter Property="Foreground">
<Setter.Value>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFF9CE7B" Offset="0"/>
<GradientStop Color="#FFE88C41" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Maintenant, ce style ToggleButton a un arrière-plan par défaut et lorsque "IsChecked" est vrai, il aura un arrière-plan différent (comme vous pouvez le voir sur le code XAML ci-dessus).

Maintenant, ces boutons à bascule doivent avoir une icône + du texte combiné, comme ce que j'ai fait ici (désolé pour mon code XAML boiteux)

<ToggleButton Style="{DynamicResource Standardbutton}" Margin="0,0,0,4">
<StackPanel Orientation="Horizontal">
<Image Source="Resources/scan_26x26.png" />
<TextBlock Text="Scan"/>
</StackPanel>
</ToggleButton>

La question est, comment puis-je avoir une icône différente lorsque le ToggleButton est coché (IsChecked = True)?

Voici quelques images qui pourraient vous aider à comprendre la question

Style ToggleButton normal

IsChecked = True Style

Mon objectif de conception est d'avoir une icône différente lorsque IsChecked = True

Réponses:

Ajouter les deux images au modèle de contrôle et lier leur Visibility propriété à la IsChecked propriété (utilisez un IValueConverter convertir de vrai / faux à approprié Visibility valeur enum).

<ToggleButton Style="{DynamicResource Standardbutton}" Margin="0,0,0,4">
<StackPanel Orientation="Horizontal">
<Image Source="Resources/scan_26x26.png"
Visibility="{Binding
RelativeSource={RelativeSource AncestorType=ToggleButton},
Path=IsChecked,
Converter={StaticResource BoolToVisibleConverter}}" />
<Image Source="Resources/anotherimage.png"
Visibility="{Binding
RelativeSource={RelativeSource AncestorType=ToggleButton},
Path=IsChecked,
Converter={StaticResource BoolToCollapsedConverter}}" />
<TextBlock Text="Scan"/>
</StackPanel>
</ToggleButton>

J'ai utilisé deux convertisseurs BoolToVisibleConverter et BoolToCollapsedConverter, mais vous pouvez aussi utiliser un ConverterParameter pour accomplir la même chose.