I am writing a custom control for a WPF application. I want to use a color animation in a Storyboard
in a VisualState
definition. The To
property of that animation should be bound to a dependency property of my control object. This does not appear to work.
I have found a thread in a Silverlight forum describing the exact same problem, in which it is claimed that this works in SL4 RTM: http://forums.silverlight.net/forums/p/174655/423324.aspx.
However, when I try using the code posted in my VS2010 WPF application then it does not work, meaning that the color does not change. The only binding I have been able to do within a VisualState
Storyboard
is to StaticResource
.
A开发者_JAVA百科ny ideas?
EDIT:
Added code snippets:
from Generic.xaml:
<Style TargetType="{x:Type local:TestCustomControl}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:TestCustomControl}">
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Name="MyBorder">
<Border.Background>
<SolidColorBrush Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ColdColor}" />
</Border.Background>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver">
<Storyboard>
<!-- This works: -->
<!--<ColorAnimation Storyboard.TargetProperty="Background.Color" Storyboard.TargetName="MyBorder" To="Red" Duration="0:0:0.2"/>-->
<!-- This also works: -->
<!--<ColorAnimation Storyboard.TargetProperty="Background.Color" Storyboard.TargetName="MyBorder" To="{StaticResource HotColorRes}" Duration="0:0:0.2"/>-->
<!-- This doesn't work: -->
<ColorAnimation Storyboard.TargetProperty="Background.Color" Storyboard.TargetName="MyBorder" To="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=HotColor}" Duration="0:0:0.2"/>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
TestCustomControl.cs:
public class TestCustomControl : Button
{
static TestCustomControl()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof(TestCustomControl), new FrameworkPropertyMetadata(typeof(TestCustomControl)));
}
public Color HotColor
{
get { return (Color)GetValue(HotColorProperty); }
set { SetValue(HotColorProperty, value); }
}
// Using a DependencyProperty as the backing store for HotColor. This enables animation, styling, binding, etc...
public static readonly DependencyProperty HotColorProperty =
DependencyProperty.Register("HotColor", typeof(Color), typeof(TestCustomControl), new UIPropertyMetadata(Colors.Aqua));
public Color ColdColor
{
get { return (Color)GetValue(ColdColorProperty); }
set { SetValue(ColdColorProperty, value); }
}
// Using a DependencyProperty as the backing store for ColdColor. This enables animation, styling, binding, etc...
public static readonly DependencyProperty ColdColorProperty =
DependencyProperty.Register("ColdColor", typeof(Color), typeof(TestCustomControl), new UIPropertyMetadata(Colors.Aqua));
}
It will work as expected if you specify x:Name
attribute for <ColorAnimation>
in Generic.xaml like this:
<!-- This WILL work: -->
<ColorAnimation x:Name="PART_ColorAnimation"
Storyboard.TargetProperty="Background.Color"
Storyboard.TargetName="MyBorder"
Duration="0:0:0.2" />
and set binding for To
property later in code behind in time when the template will be already applied to control by overriding OnApplyTemplate() in TestCustomControl.cs:
public override void OnApplyTemplate()
{
var colorAnimation = (ColorAnimation)Template.FindName("PART_ColorAnimation", this);
if(colorAnimation == null)
return;
var binding = new Binding("HotColor") { Source = this };
BindingOperations.SetBinding(colorAnimation,
ColorAnimation.ToProperty,
binding);
}
Hope that help.
精彩评论