Question

这是我的自定义按钮：

<Style TargetType="local:AnswerButton">
    <Setter Property="Background" Value="{StaticResource BlueGradient}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:AnswerButton">
                <Grid>
                    <Border BorderBrush="Blue" BorderThickness="2" CornerRadius="10">
                        <Border Name="myBorder" Background="{TemplateBinding Background}" CornerRadius="9">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="100"/>
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0"
                                       TextAlignment="Center" VerticalAlignment="Center" 
                                       Text="{TemplateBinding Option}" Foreground="Yellow" />
                                <TextBlock Grid.Column="1"
                                       TextAlignment="Left" VerticalAlignment="Center" 
                                       Text="{TemplateBinding Text}" Foreground="Black" />
                            </Grid>
                        </Border>
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

如何设置自定义按钮的动画？我试过这个：

    ColorAnimation myColorAnimation = new ColorAnimation();
    myColorAnimation.From = Colors.Blue;
    myColorAnimation.To = Colors.Green;
    myColorAnimation.AutoReverse = true;
    myColorAnimation.Duration = TimeSpan.FromSeconds(1);


    Storyboard.SetTargetName(myColorAnimation, "myBorder");
    Storyboard.SetTargetProperty(myColorAnimation,
        new PropertyPath(Border.BackgroundProperty));
    Storyboard myStoryboard = new Storyboard();
    myStoryboard.Children.Add(myColorAnimation);

    myStoryboard.Begin();

但目标名称存在问题。我知道这是错的，但我如何将目标设置为自定义控件？我的页面中有4个，我想将这个动画设置为选择的动画：

    <Controls:AnswerButton Name="btnAnswerA" Tap="AnswerButton_Tap"/>
    <Controls:AnswerButton Name="btnAnswerB" Tap="AnswerButton_Tap"/>
    <Controls:AnswerButton Name="btnAnswerC" Tap="AnswerButton_Tap"/>
    <Controls:AnswerButton Name="btnAnswerD" Tap="AnswerButton_Tap"/>

我不在乎它是在代码中还是在xaml中但是如何通过coloranimation使一些自定义按钮闪烁（闪烁）？感谢

编辑：我尝试使用visualstatemanager的许多选项，就像在Thaven的回答中一样，但它没有帮助。真的没有人知道哪里可能有问题？

Answer 1

我有一个非常简单的想法，我希望这对你有好处。你有每个按钮的点击事件，对吗？

 private void Button1_Click_1(object sender, RoutedEventArgs e)
    {
        DispatcherTimer dispatcherTimer = new DispatcherTimer();
        dispatcherTimer.Tick += dispatcherTimer_Tick;
        dispatcherTimer.Interval = new TimeSpan(0, 0, 0, 0, 10);
        dispatcherTimer.Start();

    }
    private void dispatcherTimer_Tick(object sender, EventArgs e)
    {

        Random rnd = new Random();            
        Button1.Background = new System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromArgb(
                      Convert.ToByte(rnd.Next(255)),
                      Convert.ToByte(rnd.Next(255)),
                      Convert.ToByte(rnd.Next(255)),
                      Convert.ToByte(rnd.Next(255))
                      ));             
    }

Answer 2

如果我理解你的问题是正确的，你不知道如何将动画设置为你选择的你的按钮按钮，并在按下按钮时运行。

有几种方法可以实现这一目标。其中之一是使用视觉状态。

在您的情况下，xaml代码应该如下所示：

    <Style TargetType="local:AnswerButton">
<Setter Property="Background" Value="Blue"/>
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="local:AnswerButton">
            <Grid>
                <Grid.Resources>
                    <Storyboard x:Name="AnimateChosen"/>
                </Grid.Resources>
                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="CommonStates">
                        <VisualStateGroup.Transitions>
                            <VisualTransition GeneratedDuration="0:0:0.2" To="Pressed"/>
                            <VisualTransition GeneratedDuration="0:0:0.2" To="Normal"/>
                        </VisualStateGroup.Transitions>
                        <VisualState x:Name="Normal"/>
                        <VisualState x:Name="Pressed">
                            <Storyboard>
                                <ColorAnimation Duration="0" To="Lime" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="myBorder" d:IsOptimized="True"/>
                            </Storyboard>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>
                <Border BorderBrush="Blue" BorderThickness="2" CornerRadius="10" Background="Black">
                    <Border x:Name="myBorder" CornerRadius="9" Background="Blue">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="100"/>
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Column="0"
                                TextAlignment="Center" VerticalAlignment="Center" 
                                Text="{TemplateBinding Option}" Foreground="Yellow" />
                            <TextBlock Grid.Column="1"
                                TextAlignment="Left" VerticalAlignment="Center" 
                                Text="{TemplateBinding Text}" Foreground="Black" />
                        </Grid>
                    </Border>
                </Border>
            </Grid>
        </ControlTemplate>
    </Setter.Value>
</Setter>

有关Windows Phone中动画和视觉样式的更多信息：

http://windowsphonegeek.com/articles/WP7-Animations-in-depthndash-Overview-and-Getting-Started

http://www.windowsphonegeek.com/articles/WP7-working-with-VisualStates-How-to-make-a-ToggleSwitch-from-CheckBox

Answer 3

我认为你应该使用Expression Blend来制作这个动画。您可以实时查看那里的转换，并进行适当的更改而无需编译。

这是一本很好的指南http://msdn.microsoft.com/en-us/magazine/cc721608.aspx

WP7 - 自定义按钮中的闪烁背景

3 个答案: