Question

我想在点击按钮后更改按钮的视图。例如，我有两个模板beforeClicking和afterClicking：

<Style TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button" x:Name="beforeClicking">
                <Border Name="border" Background="Transparent" BorderThickness="1" BorderBrush="Black">
                    <ContentPresenter/>
                </Border>                    
            </ControlTemplate>
            <!--It is not permitted, but that is pseudocode(what I want)
             <ControlTemplate TargetType="Button" x:Name="afterClicking">
                <Border Name="border" Background="Transparent" BorderThickness="10" BorderBrush="Black">
                    <ContentPresenter/>
                </Border>                    
            </ControlTemplate>
            -->
        </Setter.Value>
    </Setter>
</Style>

我想要的是当没有点击按钮时，应该永久使用模板beforeClicking，不应该改变任何内容（模板或视图）。但是，如果用户点击，则按钮应该使用永久使用模板afterClicking，不应更改按钮视图。

这是第一次点击该按钮使用模板afterClicking。在第二次单击时，该按钮使用模板beforeClicking。在第三次单击时，该按钮使用模板afterClicking。在第四次单击时，该按钮使用模板afterClicking。等等。

由于使用了MVVM方法，我希望仅通过XAML获得此类行为。

如何实现这样的行为？

Answer 1

您可以使用EventTrigger处理点击。在事件触发器中，您提供了故事板，但在故事板中，您无法更改模板。

您可以在附加财产中执行此操作，但查看您的示例，您不需要，更典型的是，您会影响单个属性：

==讨论后：ToggleButton版本：==

<Style TargetType="Button">
    <Setter Property="BorderThickness" Value="1" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Name="border" Background="Transparent" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="Black">
                    <ContentPresenter/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <EventTrigger RoutedEvent="Click">
            <EventTrigger.Actions>
                <BeginStoryboard>
                    <Storyboard>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="BorderThickness">
                            <DiscreteThicknessKeyFrame Value="10" KeyTime="0" />
                        </ThicknessAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger.Actions>
        </EventTrigger>
    </Style.Triggers>
</Style>

Answer 2

如果我是你，我会使用System.Windows.Interactivity.Behavior而不是EventTriggers，遗憾的是EventTriggers是您在xaml事件与操作相关联的唯一方法，唯一的问题是{{1} 1}}仅适用于EventTriggers个对象，您无法创建TriggerAction。这是因为它是一个抽象类，抽象方法是内部的，不能从外部的PresentationFramework库中覆盖。以下是准备Behavior类的示例：

TriggerAction

以下是如何编写xaml代码的示例：

public class ChangeTemplateBehavior : System.Windows.Interactivity.Behavior<Button>
{
    public static readonly DependencyProperty ControlTemplate1Property = DependencyProperty.Register("ControlTemplate1", typeof(ControlTemplate), typeof(ChangeTemplateBehavior), new PropertyMetadata(default(ControlTemplate)));

    public ControlTemplate ControlTemplate1
    {
        get
        {
            return (ControlTemplate)GetValue(ControlTemplate1Property);
        }
        set
        {
            SetValue(ControlTemplate1Property, value);
        }
    }

    public static readonly DependencyProperty ControlTemplate2Property = DependencyProperty.Register("ControlTemplate2", typeof(ControlTemplate), typeof(ChangeTemplateBehavior), new PropertyMetadata(default(ControlTemplate)));

    public ControlTemplate ControlTemplate2
    {
        get
        {
            return (ControlTemplate)GetValue(ControlTemplate2Property);
        }
        set
        {
            SetValue(ControlTemplate2Property, value);
        }
    }

    protected override void OnAttached()
    {
        base.OnAttached();
        this.AssociatedObject.Click += AssociatedObject_Click;
    }

    void AssociatedObject_Click(object sender, RoutedEventArgs e)
    {
        if (this.AssociatedObject.Template == this.ControlTemplate2)
        {
            this.AssociatedObject.Template = this.ControlTemplate1;
        }
        else
        {
            this.AssociatedObject.Template = this.ControlTemplate2;
        }
    }
}

单击按钮后如何更改模板

2 个答案: