在wpf中使用BasedOn创建新样式

时间:2015-05-27 14:51:26

标签: wpf

我正在尝试更改我创建的按钮,使其显示灰色而不是红色。但是,我可以更改前景色,但不能更改分配给称为“buttonElipse”的elipse的前景色

<Style x:Key="RedRoundButton" TargetType="Button">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="FontFamily" Value="SourceSansPro-Regular"/>
    <Setter Property="FontSize" Value="36px"/>
    <Setter Property="Foreground" Value="{StaticResource RedBrush}"/>
    <Setter Property="Background" >
        <Setter.Value>
            <SolidColorBrush  Color="White" />
        </Setter.Value>
    </Setter>

    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <Ellipse Stroke="{StaticResource RedBrush}" StrokeThickness="2" Fill="White" Name="buttonElipse"/>
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="content"/>
                </Grid>

                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="buttonElipse" Property="Fill" Value="White" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="GreyRoundButton" TargetType="Button" BasedOn="{StaticResource RedRoundButton}">
    <Setter Property="Foreground" Value="{StaticResource GreyBrush}"/>
</Style>

当我想要覆盖触发器中的颜色时,我也想知道如何处理同样的问题?

2 个答案:

答案 0 :(得分:1)

我认为你要找的是TemplateBinding。您希望根据应用模板的控件中的属性值修改模板中项目的属性。

鉴于您拥有的模板,我认为您需要做的就是在Stroke上修改您将Ellipse属性设置为的内容:

<Ellipse Stroke="{TemplateBinding Foreground}" ... />

然后,只要您更改Foreground上的Button媒体资源,您也会更改Stroke上的Ellipse媒体资源。

至于更改模板触发器中的属性,您所拥有的应该可以正常工作。如果您希望能够从外部配置鼠标的颜色,那么您可能需要扩展Button类并添加一个名为MouseOverBrush的新DependencyProperty。然后,您可以在控件模板触发器中使用模板绑定来修改Ellipse,以便在鼠标位于Button上时使用该属性的值。

有关详细信息,请阅读Styling and TemplatingControl Authoring

答案 1 :(得分:0)

您可能想要做的是使用资源字典来定义颜色

{StaticResource xxx}

例如

<Setter TargetName="buttonElipse" Property="Fill" Value="{StaticResource ButtonEllipseOverBrush}" />

然后你可以覆盖Buttons资源,提供不同的颜色集。