应用模板时未显示XAML按钮内容

Question

我正在为每个控件尝试这个自定义模板代码，而网格中的第二个按钮不知道它的内容。这是我的代码片段。

'<Grid>  
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"></ColumnDefinition>         
</Grid.ColumnDefinitions>      
<Grid.Resources>
<!-- First Template -->
<ControlTemplate x:Key="TBtnOpen" TargetType="{x:Type Button}">
<Border x:Name="Border" CornerRadius="4">
<Border.Background><!-- Default Diagonal Gradient-->
<LinearGradientBrush>
<GradientStop Color="DarkGreen" Offset="0"/>
<GradientStop Color="LightGreen" Offset="0.5"/>
<GradientStop Color="DarkBlue" Offset="1"/>        
</LinearGradientBrush>
</Border.Background>
<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" />
</Border>
</ControlTemplate>
<!-- Second Template -->
<ControlTemplate x:Key="TBtnCloseHor" TargetType="{x:Type Button}">
<Border x:Name="Border" CornerRadius="8">
<Border.Background>
<LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5"> <!-- Horizontal Gradient-->
<GradientStop Color="Violet" Offset="0"></GradientStop>
<GradientStop Color="LightBlue" Offset="0.2"></GradientStop>
<GradientStop Color="DarkGreen" Offset="0.4"></GradientStop>
<GradientStop Color="Red" Offset="0.6"></GradientStop>
<GradientStop Color="Yellow" Offset="0.8"></GradientStop>
<GradientStop Color="DarkOrange" Offset="1"></GradientStop>
</LinearGradientBrush>
</Border.Background>
</Border>
</ControlTemplate>
<!-- Controls Styles -->
<Style x:Key="BtnStyles" TargetType="Button">
<Setter Property="Height" Value="40"></Setter>
<Setter Property="Width" Value="100"></Setter>
<Setter Property="FontSize" Value="25"></Setter>
<Setter Property="FontStyle" Value="Italic"></Setter>
<Setter Property="FontFamily" Value="Arial"></Setter>
<Setter Property="FontWeight" Value="Bold"></Setter>
</Style>
</Grid.Resources>  
<Button  Grid.Column="0" x:Name="btnFirst"  HorizontalAlignment="Left" 
Style="{StaticResource BtnStyles}"
Template="{StaticResource TBtnOpen}">Open!
<Button.Margin>10</Button.Margin>        
<Button.Foreground>Black</Button.Foreground>        
</Button>  
<Button Grid.Column="1" x:Name="btnSecond" HorizontalAlignment="Right" 
Style="{StaticResource BtnStyles}" Template="{StaticResource TBtnCloseHor}">Close!<!-- This is the missing Content-->
<Button.Margin>10</Button.Margin>  
<Button.Foreground>White</Button.Foreground>         
</Button>  </Grid>'

如果将相同的模板(TBtnOpen(应用于两个按钮控件，则效果良好，但应用不同的模板会分别隐藏第二个按钮"内容"。任何建议都将不胜感激。谢谢托尼。

PS：下面链接的示例图像。在此处输入图像描述

Answer 1

我不知道是什么原因导致的，但我知道如何修复它。你应该绑定Border的内容。

在你的边界内写下：

<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" Content="{Binding Content, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"/>

Answer 2

使用自定义模板时，有必要指定<ContentPresenter/>，否则WPF将不了解内容应该放在哪里。因此，尝试将其添加到自定义模板中，即使您没有指定VerticalAlignment和HorizontalAlignment，也会显示您的内容

<ControlTemplate x:Key="TBtnCloseHor" TargetType="{x:Type Button}">
<Border x:Name="Border" CornerRadius="8">
<ContentPresenter/>
<Border.Background>
<LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
<!-- Horizontal Gradient-->
<GradientStop Color="Violet" Offset="0"></GradientStop>
<GradientStop Color="LightBlue" Offset="0.2"></GradientStop>
<GradientStop Color="DarkGreen" Offset="0.4"></GradientStop>
<GradientStop Color="Red" Offset="0.6"></GradientStop>
<GradientStop Color="Yellow" Offset="0.8"></GradientStop>
<GradientStop Color="DarkOrange" Offset="1"></GradientStop>
</LinearGradientBrush>
</Border.Background>
</Border>
</ControlTemplate>