应用模板时 XAML 按钮内容不显示答案

【问题标题】：XAML Button Content not showing when Template is applied应用模板时 XAML 按钮内容不显示
【发布时间】：2019-04-03 23:14:00
【问题描述】：

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

'<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：示例图片在下面的链接中。 enter image description here

【问题讨论】：

标签： wpf xaml templates button styles

【解决方案1】：

我不知道是什么原因造成的，但我知道如何解决它。您应该绑定边框的内容。

在你的边框内写下：

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

【讨论】：

【解决方案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>

【讨论】：