将模板属性值绑定到模板化控件属性

时间:2011-04-15 13:10:07

标签: silverlight templates custom-controls expression-blend

标题有点模糊,问题是:

我正在使用我自己的模板交换模板来实现Silverlight 4按钮。是否可以将边角半径绑定到按钮高度?

例如,用户可以将设计器中的高度设置为30,然后模板内边框的角半径应为15.当高度为50时,角半径应为25,等等。

如果可能,我需要一个纯XAML解决方案。

由于

1 个答案:

答案 0 :(得分:3)

这不是纯Xaml解决方案。最终你需要一些东西,至少执行表达式y / 2,这不是任何现有的基于Xaml的组件当前提供的东西。

在Vs2010中打开项目。添加一个新项目......“Silverlight Templated Control”将其称为“RoundEndedButton”。

将来源替换为: -

public class RoundEndedButton : Button
{
    public RoundEndedButton()
    {
        this.DefaultStyleKey = typeof(RoundEndedButton);
        SizeChanged += new SizeChangedEventHandler(RoundEndedButton_SizeChanged);
    }

    public static readonly DependencyProperty CornerRadiusProperty =
        DependencyProperty.Register(
            "CornerRadius",
            typeof(CornerRadius),
            typeof(RoundEndedButton),
            new PropertyMetadata(new CornerRadius()));

    void RoundEndedButton_SizeChanged(object sender, SizeChangedEventArgs e)
    {
        SetValue(CornerRadiusProperty, new CornerRadius(e.NewSize.Height / 2));
    }

}

在themes / Generic.xaml中修改其默认模板。这是我非常简单的例子: -

<Style TargetType="local:RoundEndedButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:RoundEndedButton">
                <Border x:Name="Background" 
                        Background="{TemplateBinding Background}"
                        CornerRadius="{TemplateBinding CornerRadius}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        BorderBrush="{TemplateBinding BorderBrush}">
                    <ContentPresenter
                        x:Name="contentPresenter"
                        Content="{TemplateBinding Content}"
                        ContentTemplate="{TemplateBinding ContentTemplate}"
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                        Margin="{TemplateBinding Padding}"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

请注意在模板绑定中使用额外的CornerRadius属性。当然,现在切换回混合将此控件添加到曲面并在样式上获得创意。