How to change custom content of ToggleButton in XAML
I changed the style ToggleButton
to ResourceDictionary
. In my style, I change ControlTemplate
ToggleButton
and I put the image in front of Content
.
Now here's my question:ToggleButtons
Does the image need to be changed for the different ones I use in XAML, should I define different styles for each ToggleButton
with a different image or is there some way I can change its image in XAML?
<Style x:Key="BaseToggleButton" TargetType="ToggleButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ToggleButton">
<StackPanel Orientation="Horizontal" x:Name="Border">
<Image Width="13" Height="13" Source="{StaticResource ColumnsLayoutMiniIcon}"/>
<TextBlock>
<ContentPresenter/>
</TextBlock>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Is there a way to change the image here instead of the style?
<RadioButton Content="Plan View"
GroupName="View"
Style="{StaticResource BaseToggleButton}">
</RadioButton>
source to share
Of course, you can play around with an unused property that is actually available for a situation like this called Tag
, which you can use to pass in the path to an image or resource declaration, etc. when we get to binding to a template like;
<Style x:Key="BaseToggleButton" TargetType="ToggleButton">
<!-- Let give it a default -->
<Setter Property="Tag" Value="{StaticResource ColumnsLayoutMiniIcon}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ToggleButton">
<StackPanel Orientation="Horizontal" x:Name="Border">
<Image Width="13" Height="13"
Source="{TemplateBinding Tag}"/>
<ContentPresenter/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Now we can either leave it as it is and display this mini-icon by default, you can specify a new one at the instance level, for example:
<ToggleButton Content="Plan View"
Tag="{StaticResource ADifferentImagePathOrResourcePointingToOne}"
Style="{StaticResource BaseToggleButton}"/>
Hope this helps, cheers.
source to share