在 WPF 样式中设置嵌套元素的属性答案

【问题标题】：Set a property of a nested element in an WPF style在 WPF 样式中设置嵌套元素的属性
【发布时间】：2018-03-01 04:22:15
【问题描述】：

我有几种类似这样的样式（左、右、中），它们的区别仅在于哪些角（如果有）是圆角的。

<Style x:Key="ToggleRadioButtonLeft" 
       TargetType="{x:Type ToggleButton}" 
       BasedOn="{StaticResource {x:Type ToggleButton}}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <Border BorderBrush="Blue" 
                        Background="{TemplateBinding Background}"
                        Padding="15,0" 
                        BorderThickness="1" 
                        CornerRadius="10,0,0,10">  <!-- extract this -->
                    <ContentPresenter HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsChecked" Value="True">
            <Setter Property="Background" Value="Blue"/>
            <Setter Property="Foreground" Value="White"/>
        </Trigger>
        <Trigger Property="IsChecked" Value="False">
            <Setter Property="Background" Value="White"/>
            <Setter Property="Foreground" Value="Black"/>
        </Trigger>
    </Style.Triggers>
</Style>

我希望能够创建一个没有任何圆角的单一基本样式（即中心按钮样式），然后再创建两个基于它为左侧和最右侧元素设置圆角的基础样式，但我可以'不知道如何在派生样式中设置边框半径，因为它不是样式中的顶级元素。

【问题讨论】：

我成功使用了这个方法：stackoverflow.com/questions/9232502/…。简而言之：创建一个附加属性并通过样式设置器设置它的值。模板可以创建到该属性的绑定
@ASh 你能详细说明一下吗？这个问题发生的事情比我可以轻松解析的更复杂。
使用像<CornerRadius x:Key="RadiusLeft" BottomLeft="0" BottomRight="10" TopLeft="5" TopRight="7"/>这样的4个独立资源并在Style中使用它们DynamicResource。

标签： wpf xaml

【解决方案1】：

我知道以您正在寻找的方式自定义模板的 3 个选项

1) 创建一个从 ToggleButton 派生的 userControl，在其中添加一个 RadiusValue 依赖属性（CornerRadius 类型）并在控件模板中使用它：CornerRadius="{TemplateBinding RadiusValue}"。

2) 使用动态资源。

在遇到动态资源的障碍后 (Wpf dynamic resource lookup for Validation.ErrorTemplate) 我更喜欢第三个

3) 使用附加的依赖属性

起初我创建了一个 CornerRadius 类型的附加 DP（默认半径 = 3）

public static class Attached
{
    public static readonly DependencyProperty RadiusValueProperty =
        DependencyProperty.RegisterAttached("RadiusValue", typeof (CornerRadius), typeof (Attached), new FrameworkPropertyMetadata(new CornerRadius(3)));


    public static void SetRadiusValue(DependencyObject element, CornerRadius value)
    {
        element.SetValue(RadiusValueProperty, value);
    }

    public static CornerRadius GetRadiusValue(DependencyObject element)
    {
        return (CornerRadius)element.GetValue(RadiusValueProperty);
    }
}

之后我修改了自定义 ToggleButton 模板：

<Style x:Key="ToggleRadioButton" 
        TargetType="{x:Type ToggleButton}" 
        BasedOn="{StaticResource {x:Type ToggleButton}}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <Border BorderBrush="Blue" 
                Background="{TemplateBinding Background}"
                Padding="15,0" 
                BorderThickness="1" 
                CornerRadius="{Binding Path=(local:Attached.RadiusValue), 
                    RelativeSource={RelativeSource TemplatedParent}}"> 
                    <ContentPresenter HorizontalAlignment="Center"
                                VerticalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsChecked" Value="True">
            <Setter Property="Background" Value="Blue"/>
            <Setter Property="Foreground" Value="White"/>
        </Trigger>
        <Trigger Property="IsChecked" Value="False">
            <Setter Property="Background" Value="White"/>
            <Setter Property="Foreground" Value="Black"/>
        </Trigger>
    </Style.Triggers>
</Style>

唯一的变化（除了键）是

CornerRadius="{Binding Path=(local:Attached.RadiusValue), 
               RelativeSource={RelativeSource TemplatedParent}}">

最后根据ToggleRadioButton导出Left RadioButton的样式

<Style x:Key="ToggleRadioButtonLeft" 
        TargetType="{x:Type ToggleButton}" 
        BasedOn="{StaticResource ToggleRadioButton}">
    <Setter Property="local:Attached.RadiusValue" Value="10,0,0,10"/>
</Style>

【讨论】：