在XAML中设置按钮单击触发器上的按钮内容 [英] Set button content on button click trigger in xaml

问题描述

我想在XAML中使用触发器来设置按钮内容，而无需编写代码：

I would like to set button content using trigger in XAML without writing code behind:

每次单击按钮时，都应该更改内容：
例如，第一次单击按钮，按钮内容=高，第二次单击，按钮内容=再见，第三次单击，按钮内容=高。

Every time button is clicked, content should be changed: Something like button clicked first time, button content = "Hi", Second time clicked, button content = "Bye", Third time clicked, button content = "Hi" again.

    <Button x:Name="btn" Content="Hi">
        <Button.Triggers>
            <EventTrigger RoutedEvent="Button.Click">
                <BeginStoryboard>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.Target="{x:Reference btn}"
                                           Storyboard.TargetProperty="Content">
                            <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                        Value="Bye"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
                <StopStoryboard>
                </StopStoryboard>
            </EventTrigger>
        </Button.Triggers>
    </Button>

因此它可以将按钮内容一次设置为Bye，但是如何在按钮上将其设置回Hi。下一步单击??

So it works for setting button content once to Bye, but how to set it back to Hi on the next click ??

我也不知道这是否是设置触发器的最有效方法，如果您有更好的解决方案，请放心。

I am also not sure if this is the most efficient way of setting the trigger, if you have better solution, feel free.

推荐答案

您想要一个具有两种状态的按钮，这似乎正是ToggleButton的含义。
这是一种样式，可根据需要更改内容：

You want a button with two state, which seem exactly what a ToggleButton is. Here is a style changing the Content like you want:

<Style x:Key="ToggleButtonStyle1" TargetType="{x:Type ToggleButton}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ToggleButton}">
                        <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                            <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="Button.IsDefaulted" Value="True">
                                <Setter Property="BorderBrush" TargetName="border" Value="Red"/>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="border" Value="#FFBEE6FD"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FF3C7FB1"/>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" TargetName="border" Value="#FFC4E5F6"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FF2C628B"/>
                            </Trigger>
                            <Trigger Property="IsChecked" Value="True">
                                <Setter Property="Content" TargetName="contentPresenter" Value="Bye"/>

                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter Property="Background" TargetName="border" Value="#FFF4F4F4"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FFADB2B5"/>
                                <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

这篇关于在XAML中设置按钮单击触发器上的按钮内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！