visual-studio之使用依赖对象进行彩色动画 WP8

我在它的 ControlTemplate 中使用一个我塑造它的按钮。我还在 controlTemplate 中添加了一个 Storyboard。 Storyboard更改了我的 controlTemplate 中元素的边框。我从后面的代码访问它并激活它，问题是当我在电话上执行此操作时存在延迟。我在 MVVM 结构之后构建了我的代码，我的观点是:

 <Button x:Name="Button1" BorderThickness="0" BorderBrush="Transparent"> 
        <Button.Template> 
            <ControlTemplate x:Name="Control"> 
                <Path x:Name="Control2" Style="{StaticResource style_ColorButton}" Data="{Binding Data}" Fill="{StaticResource Background}"> 
                    <Path.Resources> 
                        <Storyboard x:Name="StoryBoard1"> 
                            <ColorAnimation Storyboard.TargetName="Control2" Storyboard.TargetProperty="(Stroke).(SolidColorBrush.Color)" To="Blue" Duration="0"/> 
                        </Storyboard> 
                    </Path.Resources> 
                </Path> 
            </ControlTemplate>  
        </Button.Template> 

还有我激活 Storyboard的 ViewModel 部分:

   foreach (UIElement x in ElementsAtPoint) 
        { 
            f = x as FrameworkElement; 
            if (f is Path) 
            { 
                try {  
                h = f as Path; 
                Storyboard sb = h.Resources["StoryBoard1"] as Storyboard; 
                sb.Begin(); 
                    } 
                catch 
                { 
 
                } 
                break; 
            } 
        } 

我已经 read可以使用 Dependency 对象来制作动画，但我不确定它是如何工作的或者它是否会工作，但是任何尝试为动画实现依赖对象的帮助将不胜感激。

请您参考如下方法:

我建议使用 VisualStates 来完成您正在寻找的事情。我修改了按钮的样式以将故事添加到 MouseOver VisualState，然后将 MouseEnter 和 MouseLeave 的事件监听器添加到按钮。当您触摸设备并将手指拖过某个元素，然后再次将其拖离时，会触发这些事件。您可以修改下面的代码来检查是否有东西被拖动。你也可以看看 Drag/Drop functionality .

使用下面的样式

<Style x:Key="ButtonStyle" TargetType="Button"> 
    <Setter Property="Background" Value="Transparent"/> 
    <Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/> 
    <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/> 
    <Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/> 
    <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/> 
    <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMedium}"/> 
    <Setter Property="Padding" Value="10,5,10,6"/> 
    <Setter Property="Template"> 
        <Setter.Value> 
            <ControlTemplate TargetType="Button"> 
                <Grid Background="Transparent"> 
                    <VisualStateManager.VisualStateGroups> 
                        <VisualStateGroup x:Name="CommonStates"> 
                            <VisualState x:Name="Normal"/> 
                            <VisualState x:Name="MouseOver"> 
                                <Storyboard> 
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="White"/> 
                                    </ObjectAnimationUsingKeyFrames> 
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"> 
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Orange"/> 
                                    </ObjectAnimationUsingKeyFrames> 
                                </Storyboard> 
                            </VisualState> 
                            <VisualState x:Name="Pressed"> 
                                <Storyboard> 
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneButtonBasePressedForegroundBrush}"/> 
                                    </ObjectAnimationUsingKeyFrames> 
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"> 
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneAccentBrush}"/> 
                                    </ObjectAnimationUsingKeyFrames> 
                                </Storyboard> 
                            </VisualState> 
                            <VisualState x:Name="Disabled"> 
                                <Storyboard> 
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
                                    </ObjectAnimationUsingKeyFrames> 
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground"> 
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
                                    </ObjectAnimationUsingKeyFrames> 
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"> 
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/> 
                                    </ObjectAnimationUsingKeyFrames> 
                                </Storyboard> 
                            </VisualState> 
                        </VisualStateGroup> 
                    </VisualStateManager.VisualStateGroups> 
                    <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0" Margin="{StaticResource PhoneTouchTargetOverhang}"> 
                        <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/> 
                    </Border> 
                </Grid> 
            </ControlTemplate> 
        </Setter.Value> 
    </Setter> 
</Style> 

注意它有一个 MouseOver VisualState。然后分配样式并订阅事件处理程序

<Button Content="Drag over me" Style="{StaticResource ButtonStyle}"  MouseEnter="OnButtonMouseEnter" MouseLeave="OnButtonMouseLeave"/> 

并在事件处理程序中更改视觉状态。

private void OnButtonMouseEnter(object sender, MouseEventArgs e) 
{ 
    VisualStateManager.GoToState((Control)sender, "MouseOver", true); 
} 
 
private void OnButtonMouseLeave(object sender, MouseEventArgs e) 
{ 
    VisualStateManager.GoToState((Control)sender, "Normal", true); 
} 

有了这个，当您点击按钮并将手指拖到按钮上时，它会变成橙色并带有白色文本。