wpf 如何从 XAML 访问元素资源中的故事板?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15848381/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to access a storyboard within an element resources from XAML?
提问by Mimi
Consider this code:
考虑这个代码:
<UserControl x:Class="MyApp.MyControl"
...
xmlns:local="clr-namespace:MyApp"
DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}">
<UserControl.Template>
<ControlTemplate>
<ControlTemplate.Resources>
<Storyboard x:Key="MyStory">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="brdBase">
<SplineColorKeyFrame KeyTime="0:0:1" Value="Red"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<Border x:Name="brdBase" BorderThickness="1" BorderBrush="Cyan" Background="Black">
...
</Border>
<ControlTemplate.Triggers>
<Trigger SourceName="brdBase" Property="IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource MyStory}"/>
</Trigger.EnterActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</UserControl.Template>
</UserControl>
The above code works with no problem. Now, I wanna bind key-frame value of MyStoryto a DP (named SpecialColor) of this user-control like so:
上面的代码没有问题。现在,我想将 的关键帧值绑定MyStory到SpecialColor这个用户控件的 DP(命名),如下所示:
<Storyboard x:Key="MyStory">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="brdBase">
<SplineColorKeyFrame KeyTime="0:0:1" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type local:MyControl}}, Path=SpecialColor}"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
which makes an error:
这会导致错误:
Cannot freeze this Storyboard timeline tree for use across threads.
无法冻结此 Storyboard 时间线树以跨线程使用。
It's possible to do this using code behind. But how can I do it in XAML only?
可以使用背后的代码来做到这一点。但是我怎么能只在 XAML 中做到这一点呢?
Code-Behind Aided Solution:
代码隐藏辅助解决方案:
?Step 1:Putting the MyStorystoryboard into the brdBaseresources.
? 第 1 步:将MyStory故事板放入brdBase资源中。
<UserControl.Template>
<ControlTemplate>
<Border x:Name="brdBase" BorderThickness="1" BorderBrush="Cyan" Background="Black">
<Border.Resources>
<Storyboard x:Key="MyStory">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="brdBase">
<SplineColorKeyFrame KeyTime="0:0:1" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type local:MyControl}}, Path=SpecialColor}"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</Border.Resources>
...
</Border>
<ControlTemplate.Triggers>
<Trigger SourceName="brdBase" Property="IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource MyStory}"/>
</Trigger.EnterActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</UserControl.Template>
Error:Cannot find resource named 'MyStory'. Resource names are case sensitive.
错误:找不到名为“MyStory”的资源。资源名称区分大小写。
?Step 2:Eliminating Triggeron IsMouseOverproperty and begin the MyStoryfrom code behind.
? 第2步:消除Trigger对IsMouseOver财产,并开始MyStory从后面的代码。
<UserControl.Template>
<ControlTemplate>
<Border x:Name="brdBase" BorderThickness="1" BorderBrush="Cyan" Background="Black" MouseEnter="brdBase_MouseEnter">
<Border.Resources>
<Storyboard x:Key="MyStory">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="brdBase">
<SplineColorKeyFrame KeyTime="0:0:1" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type local:MyControl}}, Path=SpecialColor}"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</Border.Resources>
</Border>
</ControlTemplate>
</UserControl.Template>
C# Code-Behind:
C# 代码隐藏:
private void brdBase_MouseEnter(object sender, MouseEventArgs e)
{
Border grdRoot = (Border)this.Template.FindName("brdBase", this);
Storyboard story = grdRoot.Resources["MyStory"] as Storyboard;
story.Begin(this, this.Template);
}
?Step 3:The solution is already done, but it doesn't work at the first time. Fortunately, there is a workaround for this issue. It's enough to put the ControlTemplatein a Style.
? 第3步:解决方案已经完成,但第一次不起作用。幸运的是,这个问题有一个解决方法。将ControlTemplatea放入Style.
(I need other Triggertypes than EventTriggerand must wrap the UserControlelements with the ControlTemplate.)
(我需要其他Trigger类型,EventTrigger并且必须UserControl用ControlTemplate.包裹元素。)
Update:
更新:
The idea about using ObjectDataProviderfailed.
使用的想法ObjectDataProvider失败了。
- An ObjectDataProviderresource cannot be used to provide a storyboard!!! The error report is:
- XamlParseException:Set property 'System.Windows.Media.Animation.BeginStoryboard.Storyboard' threw an exception.
- InnerException:'System.Windows.Data.ObjectDataProvider' is not a valid value for property 'Storyboard'.
- The AssociatedControlDP is always null.
- 一个ObjectDataProvider的资源不能被用于提供故事板!错误报告是:
- XamlParseException:设置属性“System.Windows.Media.Animation.BeginStoryboard.Storyboard”引发异常。
- InnerException:'System.Windows.Data.ObjectDataProvider' 不是属性 'Storyboard' 的有效值。
- 该AssociatedControlDP总是空。
Here is the code:
这是代码:
<UserControl.Template>
<ControlTemplate>
<ControlTemplate.Resources>
<local:StoryboardFinder x:Key="StoryboardFinder1" AssociatedControl="{Binding ElementName=brdBase}"/>
<ObjectDataProvider x:Key="dataProvider" ObjectInstance="{StaticResource StoryboardFinder1}" MethodName="Finder">
<ObjectDataProvider.MethodParameters>
<sys:String>MyStory</sys:String>
</ObjectDataProvider.MethodParameters>
</ObjectDataProvider>
</ControlTemplate.Resources>
<Border x:Name="brdBase" BorderThickness="1" BorderBrush="Cyan" Background="Black">
<Border.Resources>
<Storyboard x:Key="MyStory">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="brdBase">
<SplineColorKeyFrame KeyTime="0:0:1" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type local:MyControl}}, Path=SpecialColor}"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</Border.Resources>
...
</Border>
<ControlTemplate.Triggers>
<Trigger SourceName="brdBase" Property="IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource dataProvider}"/>
</Trigger.EnterActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</UserControl.Template>
The StoryboardFinder class:
StoryboardFinder 类:
public class StoryboardFinder : DependencyObject
{
#region ________________________________________ AssociatedControl
public Control AssociatedControl
{
get { return (Control)GetValue(AssociatedControlProperty); }
set { SetValue(AssociatedControlProperty, value); }
}
public static readonly DependencyProperty AssociatedControlProperty =
DependencyProperty.Register("AssociatedControl",
typeof(Control),
typeof(StoryboardFinder),
new FrameworkPropertyMetadata(null, FrameworkPropertyMetadataOptions.None));
#endregion
public Storyboard Finder(string resourceName)
{
//
// Associated control is always null :(
//
return new Storyboard();
}
}
采纳答案by Mimi
What if this code was true?
如果这段代码是真的呢?
<UserControl x:Class="MyApp.MyControl"
...
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:l="clr-namespace:MyApp"
DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}">
<UserControl.Resources>
<Style TargetType="{x:Type l:MyControl}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type l:MyControl}">
<Border x:Name="brdBase" BorderThickness="1" BorderBrush="Cyan" Background="Black">
<Border.Resources>
<Storyboard x:Key="MyStory">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="brdBase">
<SplineColorKeyFrame KeyTime="0:0:1" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type l:MyControl}}, Path=SpecialColor}"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</Border.Resources>
<i:Interaction.Triggers>
<l:InteractiveTrigger Property="IsMouseOver" Value="True">
<l:InteractiveTrigger.CommonActions>
<BeginStoryboard Storyboard="{StaticResource MyStory}"/>
</l:InteractiveTrigger.CommonActions>
</l:InteractiveTrigger>
</i:Interaction.Triggers>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
</UserControl>
If so, I could have a Trigger on IsMouseOverproperty...
如果是这样,我可以在IsMouseOver财产上触发...
I'm glad to say it's a working code :) I could only use EventTriggerin <Border.Triggers>tag. It was the limitation. So I started thinking about this idea: What if I could have a custom trigger which can work in FrameworkElement.Triggersscope? Here is the code:
我很高兴地说这是一个有效的代码 :) 我只能EventTrigger在<Border.Triggers>标签中使用。这是限制。所以我开始考虑这个想法:如果我可以有一个可以在FrameworkElement.Triggers范围内工作的自定义触发器怎么办?这是代码:
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Windows;
using System.Windows.Interactivity;
using System.Windows.Media.Animation;
namespace TriggerTest
{
/// <summary>
/// InteractiveTrigger is a trigger that can be used as the System.Windows.Trigger but in the System.Windows.Interactivity.
/// <para>
/// Note: There is neither `EnterActions` nor `ExitActions` in this class. The `CommonActions` can be used instead of `EnterActions`.
/// Also, the `Actions` property which is of type System.Windows.Interactivity.TriggerAction can be used.
/// </para>
/// <para>?</para>
/// <para>
/// There is only one kind of triggers (i.e. EventTrigger) in the System.Windows.Interactivity. So you can use the following triggers in this namespace:
/// <para>1- InteractiveTrigger : Trigger</para>
/// <para>2- InteractiveMultiTrigger : MultiTrigger</para>
/// <para>3- InteractiveDataTrigger : DataTrigger</para>
/// <para>4- InteractiveMultiDataTrigger : MultiDataTrigger</para>
/// </para>
/// </summary>
public class InteractiveTrigger : TriggerBase<FrameworkElement>
{
#region ___________________________________________________________________________________ Properties
#region ________________________________________ Value
/// <summary>
/// [Wrapper property for ValueProperty]
/// <para>
/// Gets or sets the value to be compared with the property value of the element. The comparison is a reference equality check.
/// </para>
/// </summary>
public object Value
{
get { return (object)GetValue(ValueProperty); }
set { SetValue(ValueProperty, value); }
}
public static readonly DependencyProperty ValueProperty =
DependencyProperty.Register("Value",
typeof(object),
typeof(InteractiveTrigger),
new FrameworkPropertyMetadata(null, FrameworkPropertyMetadataOptions.None, OnValuePropertyChanged));
private static void OnValuePropertyChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
{
InteractiveTrigger instance = sender as InteractiveTrigger;
if (instance != null)
{
if (instance.CanFire)
instance.Fire();
}
}
#endregion
/// <summary>
/// Gets or sets the name of the object with the property that causes the associated setters to be applied.
/// </summary>
public string SourceName
{
get;
set;
}
/// <summary>
/// Gets or sets the property that returns the value that is compared with this trigger.Value property. The comparison is a reference equality check.
/// </summary>
public DependencyProperty Property
{
get;
set;
}
/// <summary>
/// Gets or sets a collection of System.Windows.Setter objects, which describe the property values to apply when the trigger object becomes active.
/// </summary>
public List<Setter> Setters
{
get;
set;
}
/// <summary>
/// Gets or sets the collection of System.Windows.TriggerAction objects to apply when this trigger object becomes active.
/// </summary>
public List<System.Windows.TriggerAction> CommonActions
{
get;
set;
}
/// <summary>
/// Gets a value indicating whether this trigger can be active to apply setters and actions.
/// </summary>
private bool CanFire
{
get
{
if (this.AssociatedObject == null)
{
return false;
}
else
{
object associatedValue;
if (string.IsNullOrEmpty(SourceName))
associatedValue = this.AssociatedObject.GetValue(Property);
else
associatedValue = (this.AssociatedObject.FindName(SourceName) as DependencyObject).GetValue(Property);
TypeConverter typeConverter = TypeDescriptor.GetConverter(Property.PropertyType);
object realValue = typeConverter.ConvertFromString(Value.ToString());
return associatedValue.Equals(realValue);
}
}
}
#endregion
#region ___________________________________________________________________________________ Methods
/// <summary>
/// Fires (activates) current trigger by setting setter values and invoking all actions.
/// </summary>
private void Fire()
{
//
// Setting setters values to their associated properties..
//
foreach (Setter setter in Setters)
{
if (string.IsNullOrEmpty(setter.TargetName))
this.AssociatedObject.SetValue(setter.Property, setter.Value);
else
(this.AssociatedObject.FindName(setter.TargetName) as DependencyObject).SetValue(setter.Property, setter.Value);
}
//
// Firing actions..
//
foreach (System.Windows.TriggerAction action in CommonActions)
{
Type actionType = action.GetType();
if (actionType == typeof(BeginStoryboard))
{
(action as BeginStoryboard).Storyboard.Begin();
}
else
throw new NotImplementedException();
}
this.InvokeActions(null);
}
#endregion
#region ___________________________________________________________________________________ Events
public InteractiveTrigger()
{
Setters = new List<Setter>();
CommonActions = new List<System.Windows.TriggerAction>();
}
protected override void OnAttached()
{
base.OnAttached();
if (Property != null)
{
object propertyAssociatedObject;
if (string.IsNullOrEmpty(SourceName))
propertyAssociatedObject = this.AssociatedObject;
else
propertyAssociatedObject = this.AssociatedObject.FindName(SourceName);
//
// Adding a property changed listener to the property associated-object..
//
DependencyPropertyDescriptor dpDescriptor = DependencyPropertyDescriptor.FromProperty(Property, propertyAssociatedObject.GetType());
dpDescriptor.AddValueChanged(propertyAssociatedObject, PropertyListener_ValueChanged);
}
}
protected override void OnDetaching()
{
base.OnDetaching();
if (Property != null)
{
object propertyAssociatedObject;
if (string.IsNullOrEmpty(SourceName))
propertyAssociatedObject = this.AssociatedObject;
else
propertyAssociatedObject = this.AssociatedObject.FindName(SourceName);
//
// Removing previously added property changed listener from the associated-object..
//
DependencyPropertyDescriptor dpDescriptor = DependencyPropertyDescriptor.FromProperty(Property, propertyAssociatedObject.GetType());
dpDescriptor.RemoveValueChanged(propertyAssociatedObject, PropertyListener_ValueChanged);
}
}
private void PropertyListener_ValueChanged(object sender, EventArgs e)
{
if (CanFire)
Fire();
}
#endregion
}
}
I've also created other trigger types (i.e. InteractiveMultiTrigger, InteractiveDataTrigger, InteractiveMultiDataTrigger) as well as some more actions which makes it possible to have a conditional and multi-conditional EventTriggers. I'll publish them all if you professional guys confirm this solution.
我还创建了其他触发器类型(即InteractiveMultiTrigger, InteractiveDataTrigger, InteractiveMultiDataTrigger)以及一些更多的操作,这使得有条件和多条件的 EventTriggers 成为可能。如果您的专业人士确认此解决方案,我会将它们全部发布。
Thanks for your attention!
感谢您的关注!
回答by Erti-Chris Eelmaa
Well, you can't really bind to "To" nor From, because the storyboard has to be frozen, in order to work efficiently with cross-threading.
好吧,你不能真正绑定到“To”或 From,因为故事板必须被冻结,以便有效地使用交叉线程。
Solution1)Simplest solution without hacks(involves code-behind): Add MouseOver event handler & in the event handler, locate necessary animation, set the "To" property directly, so you won't use binding and the "freezing" can be done. This way you won't hardcode anything :).
解决方案1)最简单的没有hacks的解决方案(涉及代码隐藏):在事件处理程序中添加MouseOver事件处理程序&,定位必要的动画,直接设置“To”属性,这样你就不会使用绑定并且可以完成“冻结” . 这样你就不会硬编码任何东西:)。
Solution2)There is a cool hack that supports XAML only( a little bit of converter magic ofcourse ), but I do not suggest it. It's cool nonetheless :) WPF animation: binding to the "To" attribute of storyboard animationSee answer by Jason.
解决方案 2)有一个很酷的 hack 只支持 XAML(当然还有一点转换器魔法),但我不建议这样做。尽管如此,它还是很酷 :) WPF 动画:绑定到情节提要动画的“To”属性请参阅 Jason 的回答。
There are few things more that you can try:
您还可以尝试以下几件事:
Solution3)Don't use Dependency properties, but rather implement INotifyProperthChanged. This way you still can BIND "To". Note that I think this should theoretically work, but I have not tried.
解决方案 3)不要使用依赖属性,而是实现 INotifyProperthChanged。这样你仍然可以绑定“到”。请注意,我认为这在理论上应该可行,但我还没有尝试过。
Solution4)Apply Mode=OneTime to your binding. Maybe it works?
解决方案 4)将 Mode=OneTime 应用于您的绑定。也许它有效?
Solution5)Write your own attached behavior that will evaluate dependency property on correct thread and set "To" property. I think that will be nice solution.
解决方案5)编写您自己的附加行为,该行为将评估正确线程上的依赖属性并设置“To”属性。我认为这将是一个很好的解决方案。
Here is good duplicate too: WPF Animation "Cannot freeze this Storyboard timeline tree for use across threads"
这里也有很好的重复:WPF Animation“无法冻结这个故事板时间线树以供跨线程使用”

