Search code examples
c#wpftogglebutton

Togglebutton content change in image in WPF

I have code in wpf which use ToggleButton.

<Grid>
        <ToggleButton x:Name="pinButton" VerticalAlignment="Center" Width="auto" MaxWidth="26" Height="26"
                                          Background="{DynamicResource MyBorderBlueGradientBrush}" Focusable="False"
                                          DockPanel.Dock="Right"  BorderThickness="0" 
                                          OverridesDefaultStyle="False" BorderBrush="{DynamicResource MyBorderBlueGradientBrush}"  FontFamily="Webdings">
            <Label x:Name="Pinback" Background="{DynamicResource MyBorderBlueGradientBrush}" Width="26" Height="26" BorderBrush="{DynamicResource MyBorderBlueGradientBrush}">
                <Label x:Name="Pin"  FontSize="18" Foreground="White" Content="" Width="25" Height="25" Background="Black" HorizontalAlignment="Center" VerticalAlignment="Center">
                    <Label.RenderTransform>
                        <RotateTransform Angle="16" CenterX="29" CenterY="0"></RotateTransform>
                    </Label.RenderTransform>
                </Label>
            </Label>
        </ToggleButton>

    </Grid>

When I run this code, I got this window.

enter image description here

So My question is "How the content change into pin image".When I change the content it convert in other image.

Solution

  • The pin is coming from a character from the Webdings FontFamily in your XAML:

    <Label x:Name="Pin" FontSize="18" Foreground="White" Content="" Width="25" 
    Height="25" Background="Black" HorizontalAlignment="Center" 
    VerticalAlignment="Center" />

    Note the Content property... obviously, you can't see the character here, because that font is not common on websites. Also note the FontFamily declared in the ToggleButton:

    <ToggleButton x:Name="pinButton" VerticalAlignment="Center" Width="auto" MaxWidth="26"
    Height="26" Background="Blue" Focusable="False" DockPanel.Dock="Right"  
    BorderThickness="0" OverridesDefaultStyle="False" BorderBrush="Blue"  
    FontFamily="Webdings">