thePhenomanalB
thePhenomanalB

Reputation: 15

Text on Button is not displayed

I have styled my Buttons in the Windows.Resources tag. Everything is working fine, except for the Content, it is not displayed.

<Window …>
    <Window.Resources>
        <Style TargetType="Button">
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="White" />
                </Trigger>
            </Style.Triggers>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border CornerRadius="5" BorderThickness="1" BorderBrush="#989898"
                                Background="{TemplateBinding Background}" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="Background" Value="#0E121A" />
            <Setter Property="Margin" Value="3" />
            <Setter Property="Foreground" Value="White" />
        </Style>
    </Window.Resources>
    <Grid>
       …
       <Button Grid.Row="0" Grid.Column="2" Content="Send"
                        Click="ButtonActivateLicense_OnClick" />
    </Grid>
<Window>

Upvotes: -2

Views: 675

Answers (1)

thatguy
thatguy

Reputation: 22129

As you override the default template for Button, you also have to specify an element to display the content. You can simply add a ContentPresenter to your Border to display the content.

<Style TargetType="Button">
   <Style.Triggers>
      <Trigger Property="IsMouseOver" Value="True">
         <Setter Property="Background" Value="White" />
      </Trigger>
   </Style.Triggers>
   <Setter Property="Template">
      <Setter.Value>
         <ControlTemplate TargetType="Button">
            <Border CornerRadius="5" BorderThickness="1" BorderBrush="#989898"
                    Background="{TemplateBinding Background}">
               <ContentPresenter/>
            </Border>
         </ControlTemplate>
      </Setter.Value>
   </Setter>
   <Setter Property="Background" Value="#0E121A" />
   <Setter Property="Margin" Value="3" />
   <Setter Property="Foreground" Value="White" />
</Style>

Alternatively, add an element and use a TemplateBinding to bind the content, e.g.:

<ContentControl Content="{TemplateBinding Content}"/>

From the documentation of TemplateBinding:

Implements a markup extension that supports the binding between the value of a property in a template and the value of some other exposed property on the templated control.

Of course, if you use a different control like TextBlock and bind the content to e.g. Text, you should be aware that only text will be displayed correctly, not any type of content.

<TextBlock Text="{TemplateBinding Content}"/>

Upvotes: 1

Related Questions