将 CheckBox 模板中的内容插入 TextBlock 文本字段

Question

我为CheckBox 创建了这个模板：

<ControlTemplate TargetType="{x:Type CheckBox}">
 <Border x:Name="border" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" HorizontalAlignment="Center" VerticalAlignment="Center" Background="{StaticResource StandardButtonHoveredBackground}" BorderThickness="1" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="3">
  <Grid>
   <CheckBox  Name="MyCheckboxTemplate"   HorizontalAlignment="Left" VerticalAlignment="Center" Margin="5,0,5,0">
    <TextBlock Text="{Binding ElementName=MyCheckboxTemplate, Path=Content}" Foreground="{StaticResource StandardForeground}" FontSize="12" Background="{StaticResource StandardButtonBackground}"/>
   </CheckBox>
  </Grid>
 </Border>
 <ControlTemplate.Triggers>
   <Trigger Property="IsFocused" Value="True">
    <Setter TargetName="border" Property="BorderBrush" Value="{StaticResource HighlightedBorder}"/>
   </Trigger>
   <Trigger Property="IsMouseOver" Value="True">
    <Setter TargetName="border" Property="BorderBrush" Value="{StaticResource HighlightedBorder}"/>
   </Trigger>
 </ControlTemplate.Triggers>
</ControlTemplate>

这样称呼：

<DockPanel Margin="0,30,0,0" HorizontalAlignment="Left">
 <CheckBox Name="PWCheckbox" Style="{StaticResource MyCheckbox}" DockPanel.Dock="Left" Height="25" Content="Save Username" IsChecked="{Binding IsChecked}" Click="PWCheckbox_Clicked"/>
</DockPanel>

导致：

模板要怎么改才能将新创建的CheckBox中的Content="Save Username"的文字显示为模板中的<TextBlock Text="{Binding ElementName=MyCheckboxTemplate, Path=Content}" ...？

Answer 1

通过名称绑定到Content 属性当然会得到TextBlock 本身，它被设置为CheckBox 的内容。将Text 绑定更改为TemplateBinding 将解决此问题。

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

但是，在 CheckBox 的控件模板中使用 CheckBox 很奇怪，您不应该这样做，例如对于隐式样式，这将不起作用（无限循环）。相反，您应该复制默认样式和模板并改用它们。可以提取默认样式using Visual Studio or Blend。

例如，这是CheckBox 的默认样式，您可以使用它并根据需要进行调整。

<Style x:Key="FocusVisual">
   <Setter Property="Control.Template">
      <Setter.Value>
         <ControlTemplate>
            <Rectangle Margin="2" StrokeDashArray="1 2" SnapsToDevicePixels="true" StrokeThickness="1" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
         </ControlTemplate>
      </Setter.Value>
   </Setter>
</Style>
<Style x:Key="OptionMarkFocusVisual">
   <Setter Property="Control.Template">
      <Setter.Value>
         <ControlTemplate>
            <Rectangle Margin="14,0,0,0" StrokeDashArray="1 2" SnapsToDevicePixels="true" StrokeThickness="1" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
         </ControlTemplate>
      </Setter.Value>
   </Setter>
</Style>
<SolidColorBrush x:Key="OptionMark.Static.Background" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="OptionMark.Static.Border" Color="#FF707070"/>
<SolidColorBrush x:Key="OptionMark.Static.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Background" Color="#FFF3F9FF"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Border" Color="#FF5593FF"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Background" Color="#FFD9ECFF"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Border" Color="#FF3C77DD"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Background" Color="#FFE6E6E6"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Border" Color="#FFBCBCBC"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Glyph" Color="#FF707070"/>
<Style x:Key="MyCheckbox" TargetType="{x:Type CheckBox}">
   <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
   <Setter Property="Background" Value="{StaticResource OptionMark.Static.Background}"/>
   <Setter Property="BorderBrush" Value="{StaticResource OptionMark.Static.Border}"/>
   <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
   <Setter Property="BorderThickness" Value="1"/>
   <Setter Property="Template">
      <Setter.Value>
         <ControlTemplate TargetType="{x:Type CheckBox}">
            <Grid x:Name="templateRoot" Background="Transparent" SnapsToDevicePixels="True">
               <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="Auto"/>
                  <ColumnDefinition Width="*"/>
               </Grid.ColumnDefinitions>
               <Border x:Name="checkBoxBorder" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="1" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                  <Grid x:Name="markGrid">
                     <Path x:Name="optionMark" Data="F1 M 9.97498,1.22334L 4.6983,9.09834L 4.52164,9.09834L 0,5.19331L 1.27664,3.52165L 4.255,6.08833L 8.33331,1.52588e-005L 9.97498,1.22334 Z " Fill="{StaticResource OptionMark.Static.Glyph}" Margin="1" Opacity="0" Stretch="None"/>
                     <Rectangle x:Name="indeterminateMark" Fill="{StaticResource OptionMark.Static.Glyph}" Margin="2" Opacity="0"/>
                  </Grid>
               </Border>
               <ContentPresenter x:Name="contentPresenter" Grid.Column="1" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Grid>
            <ControlTemplate.Triggers>
               <Trigger Property="HasContent" Value="true">
                  <Setter Property="FocusVisualStyle" Value="{StaticResource OptionMarkFocusVisual}"/>
                  <Setter Property="Padding" Value="4,-1,0,0"/>
               </Trigger>
               <Trigger Property="IsMouseOver" Value="true">
                  <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Background}"/>
                  <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Border}"/>
                  <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
                  <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
               </Trigger>
               <Trigger Property="IsEnabled" Value="false">
                  <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Disabled.Background}"/>
                  <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Disabled.Border}"/>
                  <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.Disabled.Glyph}"/>
                  <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.Disabled.Glyph}"/>
               </Trigger>
               <Trigger Property="IsPressed" Value="true">
                  <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Pressed.Background}"/>
                  <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Pressed.Border}"/>
                  <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.Pressed.Glyph}"/>
                  <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.Pressed.Glyph}"/>
               </Trigger>
               <Trigger Property="IsChecked" Value="true">
                  <Setter Property="Opacity" TargetName="optionMark" Value="1"/>
                  <Setter Property="Opacity" TargetName="indeterminateMark" Value="0"/>
               </Trigger>
               <Trigger Property="IsChecked" Value="{x:Null}">
                  <Setter Property="Opacity" TargetName="optionMark" Value="0"/>
                  <Setter Property="Opacity" TargetName="indeterminateMark" Value="1"/>
               </Trigger>
            </ControlTemplate.Triggers>
         </ControlTemplate>
      </Setter.Value>
   </Setter>
</Style>