无法让 MahApps ToggleSwitch 中的 ContentControl 加粗
Unable to get ContentControl in MahApps ToggleSwitch to be bold
我已经为 MahApps ToggleSwitch 采用并创建了一个新样式。修改后如下图。我将其设置为在 Yes 和 No 之间交替，而不是 On 和 Off。我还更改了 ThumbIndicatorBrush 的大小和颜色。
我正在尝试将 'No'
加粗
下面是我创建的样式。
<Style x:Key="RuleItemToggleButtonControlTemplate" TargetType="{x:Type controls:ToggleSwitch}">
<Setter Property="ContentPadding" Value="0,0,4,0"/>
<Setter Property="controls:ControlsHelper.HeaderFontSize" Value="{DynamicResource ToggleSwitchHeaderFontSize}"/>
<Setter Property="controls:ControlsHelper.HeaderMargin" Value="0,0,0,5"/>
<Setter Property="FontFamily" Value="{DynamicResource ToggleSwitchFontFamily}"/>
<Setter Property="FontSize" Value="{DynamicResource ToggleSwitchFontSize}"/>
<Setter Property="Foreground" Value="{DynamicResource TextBrush}"/>
<Setter Property="HeaderFontFamily" Value="{DynamicResource ToggleSwitchHeaderFontFamily}"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="IsTabStop" Value="True"/>
<Setter Property="OffSwitchBrush" Value="{DynamicResource GrayBrush4}"/>
<Setter Property="OnSwitchBrush" Value="{DynamicResource AccentColorBrush}"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type controls:ToggleSwitch}">
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="Disabled">
<Storyboard>
<DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Header"/>
<DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Content"/>
<DoubleAnimation Duration="0" To="0.75" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Switch"/>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="firstCol" Width="*"/>
<ColumnDefinition x:Name="secCol" Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ContentControl x:Name="Header" Grid.ColumnSpan="2" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" ContentStringFormat="{TemplateBinding HeaderStringFormat}" FontWeight="{TemplateBinding controls:ControlsHelper.HeaderFontWeight}" FontSize="{TemplateBinding controls:ControlsHelper.HeaderFontSize}" FontFamily="{TemplateBinding HeaderFontFamily}" IsTabStop="False" Margin="{TemplateBinding controls:ControlsHelper.HeaderMargin}"/>
<ContentControl x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsTabStop="False" Margin="{TemplateBinding ContentPadding}" Grid.Row="1"
Grid.Column="0" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
<controls:ToggleSwitchButton x:Name="Switch" BorderThickness="1" Height="22" Width="40" Background="{TemplateBinding Background}" Grid.Column="1" FocusVisualStyle="{x:Null}" IsChecked="{Binding IsChecked, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}" OffSwitchBrush="{TemplateBinding OffSwitchBrush}" OnSwitchBrush="{TemplateBinding OnSwitchBrush}" Grid.Row="1" Style="{TemplateBinding ToggleSwitchButtonStyle}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" ThumbIndicatorWidth="{TemplateBinding ThumbIndicatorWidth}" ThumbIndicatorDisabledBrush="{TemplateBinding ThumbIndicatorDisabledBrush}" ThumbIndicatorBrush="{TemplateBinding ThumbIndicatorBrush}" VerticalAlignment="Center"></controls:ToggleSwitchButton>
</Grid>
</Border>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsChecked" Value="True"/>
<Condition Property="Content" Value="{x:Null}"/>
</MultiTrigger.Conditions>
<Setter Property="Content" TargetName="Content" Value="Yes"/>
<Setter Property="ThumbIndicatorBrush" Value="{StaticResource AccentColorBrush}"/>
<Setter TargetName="Switch" Property="BorderBrush" Value="{StaticResource AccentColorBrush}"></Setter>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsChecked" Value="False"/>
<Condition Property="Content" Value="{x:Null}"/>
</MultiTrigger.Conditions>
<Setter Property="Content" TargetName="Content" Value="No"/>
<Setter Property="ThumbIndicatorBrush" Value="{StaticResource ControlBorderBrush}"></Setter>
<Setter TargetName="Switch" Property="BorderBrush" Value="{StaticResource ControlBorderBrush}"/>
</MultiTrigger>
<DataTrigger Binding="{Binding Header, RelativeSource={RelativeSource Self}}" Value="{x:Null}">
<Setter Property="Visibility" TargetName="Header" Value="Collapsed"/>
</DataTrigger>
<Trigger Property="ContentDirection" Value="RightToLeft">
<Setter Property="ContentPadding" Value="4,0,0,0"/>
<Setter Property="Grid.Column" TargetName="Content" Value="1"/>
<Setter Property="Grid.Column" TargetName="Switch" Value="0"/>
<Setter Property="Width" TargetName="firstCol" Value="Auto"/>
<Setter Property="Width" TargetName="secCol" Value="*"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="ThumbIndicatorBrush" Value="{DynamicResource BlackBrush}"/>
<Setter Property="ThumbIndicatorDisabledBrush" Value="{DynamicResource GrayBrush4}"/>
<Setter Property="ThumbIndicatorWidth" Value="13"/>
<Setter Property="ToggleSwitchButtonStyle" Value="{DynamicResource MahApps.Metro.Styles.ToggleSwitchButton}"/>
<Setter Property="Validation.ErrorTemplate" Value="{DynamicResource ValidationErrorTemplate}"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
</Style>
我试过将字体粗细设置为粗体
名为 'Content' 的 ContentControl 失败。我什至尝试取出 ContentControl 并使用 TextBlock 并调整文本 属性 而不是内容 属性 但它仍然不支持字体粗细。我还尝试在默认模板上将其设置为粗体，但无法做到。任何人都知道我怎样才能使它变得大胆？
MahApps 的 ToggleSwitch 为 header 和内容使用默认字体。内容使用 'Segoe UI Semibold, Segoe UI, Lucida Sans Unicode, Verdana' 的 ToggleSwitchFontFamily。所以内容将使用已经是粗体的Segoe UI Semibold。
@punker76 的回答是正确的。我问这个问题的原因是 yes/no 与 metroheaders 字体和字体粗细不匹配。在他的回答中，他提出的其中一件事触发了我的思考过程以解决问题。因为它是不同的字体和半粗体。我没有意识到这是一种不同的字体，这让我觉得它只是不粗体，但它是一种不同的字体，这就是为什么它看起来与我真正想要的 MetroHeaders 不一样。所以我所做的是使用 TextElement.FontFamily 和 TextElement.FontWeight 附加属性并将它们附加到控件以获得我正在寻找的外观。
TextElement.FontFamily="{TemplateBinding controls:ControlsHelper.HeaderFontFamily}"
TextElement.FontWeight="Bold"
我已经为 MahApps ToggleSwitch 采用并创建了一个新样式。修改后如下图。我将其设置为在 Yes 和 No 之间交替，而不是 On 和 Off。我还更改了 ThumbIndicatorBrush 的大小和颜色。
我正在尝试将 'No'
加粗下面是我创建的样式。
<Style x:Key="RuleItemToggleButtonControlTemplate" TargetType="{x:Type controls:ToggleSwitch}">
<Setter Property="ContentPadding" Value="0,0,4,0"/>
<Setter Property="controls:ControlsHelper.HeaderFontSize" Value="{DynamicResource ToggleSwitchHeaderFontSize}"/>
<Setter Property="controls:ControlsHelper.HeaderMargin" Value="0,0,0,5"/>
<Setter Property="FontFamily" Value="{DynamicResource ToggleSwitchFontFamily}"/>
<Setter Property="FontSize" Value="{DynamicResource ToggleSwitchFontSize}"/>
<Setter Property="Foreground" Value="{DynamicResource TextBrush}"/>
<Setter Property="HeaderFontFamily" Value="{DynamicResource ToggleSwitchHeaderFontFamily}"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="IsTabStop" Value="True"/>
<Setter Property="OffSwitchBrush" Value="{DynamicResource GrayBrush4}"/>
<Setter Property="OnSwitchBrush" Value="{DynamicResource AccentColorBrush}"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type controls:ToggleSwitch}">
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="Disabled">
<Storyboard>
<DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Header"/>
<DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Content"/>
<DoubleAnimation Duration="0" To="0.75" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Switch"/>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="firstCol" Width="*"/>
<ColumnDefinition x:Name="secCol" Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ContentControl x:Name="Header" Grid.ColumnSpan="2" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" ContentStringFormat="{TemplateBinding HeaderStringFormat}" FontWeight="{TemplateBinding controls:ControlsHelper.HeaderFontWeight}" FontSize="{TemplateBinding controls:ControlsHelper.HeaderFontSize}" FontFamily="{TemplateBinding HeaderFontFamily}" IsTabStop="False" Margin="{TemplateBinding controls:ControlsHelper.HeaderMargin}"/>
<ContentControl x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsTabStop="False" Margin="{TemplateBinding ContentPadding}" Grid.Row="1"
Grid.Column="0" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
<controls:ToggleSwitchButton x:Name="Switch" BorderThickness="1" Height="22" Width="40" Background="{TemplateBinding Background}" Grid.Column="1" FocusVisualStyle="{x:Null}" IsChecked="{Binding IsChecked, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}" OffSwitchBrush="{TemplateBinding OffSwitchBrush}" OnSwitchBrush="{TemplateBinding OnSwitchBrush}" Grid.Row="1" Style="{TemplateBinding ToggleSwitchButtonStyle}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" ThumbIndicatorWidth="{TemplateBinding ThumbIndicatorWidth}" ThumbIndicatorDisabledBrush="{TemplateBinding ThumbIndicatorDisabledBrush}" ThumbIndicatorBrush="{TemplateBinding ThumbIndicatorBrush}" VerticalAlignment="Center"></controls:ToggleSwitchButton>
</Grid>
</Border>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsChecked" Value="True"/>
<Condition Property="Content" Value="{x:Null}"/>
</MultiTrigger.Conditions>
<Setter Property="Content" TargetName="Content" Value="Yes"/>
<Setter Property="ThumbIndicatorBrush" Value="{StaticResource AccentColorBrush}"/>
<Setter TargetName="Switch" Property="BorderBrush" Value="{StaticResource AccentColorBrush}"></Setter>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsChecked" Value="False"/>
<Condition Property="Content" Value="{x:Null}"/>
</MultiTrigger.Conditions>
<Setter Property="Content" TargetName="Content" Value="No"/>
<Setter Property="ThumbIndicatorBrush" Value="{StaticResource ControlBorderBrush}"></Setter>
<Setter TargetName="Switch" Property="BorderBrush" Value="{StaticResource ControlBorderBrush}"/>
</MultiTrigger>
<DataTrigger Binding="{Binding Header, RelativeSource={RelativeSource Self}}" Value="{x:Null}">
<Setter Property="Visibility" TargetName="Header" Value="Collapsed"/>
</DataTrigger>
<Trigger Property="ContentDirection" Value="RightToLeft">
<Setter Property="ContentPadding" Value="4,0,0,0"/>
<Setter Property="Grid.Column" TargetName="Content" Value="1"/>
<Setter Property="Grid.Column" TargetName="Switch" Value="0"/>
<Setter Property="Width" TargetName="firstCol" Value="Auto"/>
<Setter Property="Width" TargetName="secCol" Value="*"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="ThumbIndicatorBrush" Value="{DynamicResource BlackBrush}"/>
<Setter Property="ThumbIndicatorDisabledBrush" Value="{DynamicResource GrayBrush4}"/>
<Setter Property="ThumbIndicatorWidth" Value="13"/>
<Setter Property="ToggleSwitchButtonStyle" Value="{DynamicResource MahApps.Metro.Styles.ToggleSwitchButton}"/>
<Setter Property="Validation.ErrorTemplate" Value="{DynamicResource ValidationErrorTemplate}"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
</Style>
我试过将字体粗细设置为粗体 名为 'Content' 的 ContentControl 失败。我什至尝试取出 ContentControl 并使用 TextBlock 并调整文本 属性 而不是内容 属性 但它仍然不支持字体粗细。我还尝试在默认模板上将其设置为粗体，但无法做到。任何人都知道我怎样才能使它变得大胆？
MahApps 的 ToggleSwitch 为 header 和内容使用默认字体。内容使用 'Segoe UI Semibold, Segoe UI, Lucida Sans Unicode, Verdana' 的 ToggleSwitchFontFamily。所以内容将使用已经是粗体的Segoe UI Semibold。
@punker76 的回答是正确的。我问这个问题的原因是 yes/no 与 metroheaders 字体和字体粗细不匹配。在他的回答中，他提出的其中一件事触发了我的思考过程以解决问题。因为它是不同的字体和半粗体。我没有意识到这是一种不同的字体，这让我觉得它只是不粗体，但它是一种不同的字体，这就是为什么它看起来与我真正想要的 MetroHeaders 不一样。所以我所做的是使用 TextElement.FontFamily 和 TextElement.FontWeight 附加属性并将它们附加到控件以获得我正在寻找的外观。
TextElement.FontFamily="{TemplateBinding controls:ControlsHelper.HeaderFontFamily}"
TextElement.FontWeight="Bold"