单击按钮时的动态视觉效果

时间:2014-12-14 00:27:57

标签: c# wpf button onclick

单击按钮时,我想制作一些非常简单的视觉效果。我有一个图像作为按钮的背景,也就是说,单击按钮时旋转的图像,或发光或其他...

当我在寻找一些代码示例或者一些帮助时,我会发现只是以静态的方式增强按钮的视觉效果,而不是在点击或扫描时。

我想我必须将Triggers和其他东西一起使用,但我是WPF的新手,因为我无法真正找到信息,所以我不能指向试用的某个方向。

点击按钮时动态视觉效果的一些简单代码示例将非常受欢迎。

这就是其中一个按钮的样子:

<Button Name="B_play" Click="B_play_OnClick" Margin="30,10,0,5" Width="63.54" Height="63.782">
                <Button.Content>
                    <Image Source=".../source/to/image.png"/>
                </Button.Content>
            </Button>

1 个答案:

答案 0 :(得分:1)

您可以使用动画和触发器,请参阅: example

或搜索谷歌的wpf按钮动画

 <Style TargetType="{x:Type Button}">
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation From="1" To="0.8" RepeatBehavior="Forever" AutoReverse="True" Duration="00:00:00.3" Storyboard.TargetProperty="RenderTransform.ScaleX" />
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation To="1" Duration="00:00:00.4" Storyboard.TargetProperty="RenderTransform.ScaleX" />
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.ExitActions>
            </Trigger>
        </Style.Triggers>
        <Setter Property="RenderTransform">
            <Setter.Value>
                <ScaleTransform CenterX="120" CenterY="30" ScaleX="1" />
            </Setter.Value>
        </Setter>
    </Style>