Template binding of TextBlock in WPF Style

I encountered an issue when I creating a WPF style on an button icon where put a label show an integer on top of it. At first I just put a TextBlock and set Text=”{TemplateBinding Tag}” (the trick here I use is pass over the integer from tag property) it keeps failed to show up. Then counter check back the templatebinding is correct and Tag property did contains the value too. After several trials including set direction=TwoWay, IsSynced=true also failed, I gave up, it still doesn’t show up though. Finally I replaced TextBlock with Label and point the TemplateBinding to Content. Now everything seems alright.

Upload Icon

<Style x:Key="MetroNotifyButtonStyle" TargetType="{x:Type Button}">
        <Setter Property="Foreground" Value="Gray"/>
        <Setter Property="FontSize" Value="24" />
        <Setter Property="FontFamily" Value="iconFont" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid>
                        <Label x:Name="counter" Content="{TemplateBinding Tag}" Style="{StaticResource NotificationStyle}" Padding="0 8 8 0"
                               Visibility="{Binding Content,RelativeSource={RelativeSource Self},Converter={StaticResource VisibilityConverter}}" />
                        <Border x:Name="body" Padding="10">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Content="{TemplateBinding Content}" />
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="body" Property="Background" Value="#007acc" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Foreground" Value="White" />
                <Setter Property="Background" Value="White" />
            </Trigger>
        </Style.Triggers>
    </Style>
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s