Can figure this one out, I have some staticresources in aaplication.xaml
These staticresources i use in differtent places, per design. Now i want to use a Staticresource to a Coloranimation in a Storyboard but i can't get it to work i get the error:
An object of the type "System.Windows.Media.SolidColorBrush" cannot be applied to a property that expects the type "System.Nullable1[[System.Windows.Media.Color,....]]
Code so far:
Application.XAML
<Application.Resources>
<SolidColorBrush x:Key="GreenLight" Color="#0CAF12" />
</Application.Resources>
In a usercontrol label style:
<Setter Property="Label.Content" Value="Connected" />
<DataTrigger.EnterActions>
<BeginStoryboard Name="StoryConnected">
<Storyboard Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
<ColorAnimation Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" To="{StaticResource GreenLight}" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<RemoveStoryboard BeginStoryboardName="StoryConnected" />
</DataTrigger.ExitActions>
This won't work because the Storyboard cannot be frozen when you bind the To property:
To="{Binding Color, Source={StaticResource GreenLight}}"
So you actually need to set the To property to a Color object, i.e. define your resource like this:
<Color x:Key="GreenLight">#0CAF12</Color>
Related
I am using a third party grid control. I would like to animate row color from regular background to light green when MVVM property value changes to 'Success'
I have the following code
<dxg:GridControl.RowStyle>
<Style TargetType="{x:Type dxg:GridRowContent}" >
<Style.Triggers>
<DataTrigger Binding="{Binding RowData.Row.State}" Value="Success">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.Target="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}}"
Storyboard.TargetProperty="Background"
From="White" To="LightGreen" Duration="0:0:5" />
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
</DataTrigger>
</Style.Triggers>
</Style>
</dxg:GridControl.RowStyle>
I am getting the following error
System.Windows.Data Error: 2 : Cannot find governing FrameworkElement or FrameworkContentElement for target element. BindingExpression:(no path); DataItem=null; target element is 'ColorAnimation' (HashCode=47149397); target property is 'Target' (type 'DependencyObject')
I have to somehow get the reference to the object of type dxg:GridRowContent for Target of Storyboard. Mode=FindAncestor does not find it either.
Any clue ?
You don't need to set Storyboard.Target as by default it should apply to your row and change Storyboard.TargetProperty to Background.Color as this is ColorAnimation and Background is a Brush
<ColorAnimation
Storyboard.TargetProperty="Background.Color"
From="White"
To="LightGreen"
Duration="0:0:5" />
Trying to perform a simple red blinking effect for a single row in a DevExpress grid.
I've applied the following style on the grid's row:
<Style x:Key="AlertedRowStyle" TargetType="{x:Type dxg:GridRowContent}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Row.IsAlerted}" Value="False">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation
Storyboard.TargetProperty="Background"
To="Red"
Duration="0:0:0.500"
AutoReverse="True"
RepeatBehavior="Forever">
<ColorAnimation.EasingFunction>
<CircleEase EasingMode="EaseOut" />
</ColorAnimation.EasingFunction>
</ColorAnimation>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation
Storyboard.TargetProperty="Background"
To="White"
Duration="0:0:0.500" />
</Storyboard>
</BeginStoryboard>
</DataTrigger.ExitActions>
</DataTrigger>
</Style.Triggers>
</Style>
It causes the following exception:
'System.Windows.Media.Animation.ColorAnimation' animation object cannot be used to animate property 'Background' because it is of incompatible type 'System.Windows.Media.Brush'.
Also tried to change the Storyboard.TargetProperty to Background.Color and got:
Cannot resolve all property references in the property path 'Background.Color'. Verify that applicable objects support the properties.
How can I solve this issue?
Storyboard.TargetProperty="Background.Color" is right. Try
<Style x:Key="AlertedRowStyle" TargetType="{x:Type dxg:GridRowContent}">
<Setter Property="Background" Value="Transparent" />
<Style.Triggers>
...
I guess Background is Null and so the Storyboard can not find something to animate.
Try
Storyboard.TargetProperty="Background.(SolidColorBrush.Color)"
worked for me.
you can open a new thread. In this thread you use a loop. In this loop you can change the Backcolor of the row. In the loop you sleep the thread for 0.3 sec or something. So it should look like blinking.
regards
What I want to do is define all the BeginTimes of my Animation using a resource.
For example, I want:
<sys:TimeSpan x:key="SomeResource">... </sys:TimeSpan>
...
<DoubleAnimation BeginTime={StaticResource SomeResource}/>
Obviously sys:TimeSpan is not the correct type to use. How do I define my resource so I can reference it as a resource when defining my animations?
I also want to do this purely in XAML.
Thanks.
System.TimeSpan is the correct type to use since is this is the type of BeginTime. You can also do the same for Duration (but using the System.Windows.Duration type instead).
Here is an example using a StaticResource in an animation (after 2 seconds, fade in for 1 second):
<Button Content="Placeholder"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Opacity="0.5">
<Button.Resources>
<sys:TimeSpan x:Key="FadeInBeginTime">0:0:2</sys:TimeSpan>
<Duration x:Key="FadeInDuration">0:0:1</Duration>
</Button.Resources>
<Button.Style>
<Style>
<Style.Triggers>
<EventTrigger RoutedEvent="UIElement.MouseEnter">
<BeginStoryboard x:Name="FadeInBeginStoryBoard">
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
To="1"
BeginTime="{StaticResource FadeInBeginTime}"
Duration="{StaticResource FadeInDuration}" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="UIElement.MouseLeave">
<StopStoryboard BeginStoryboardName="FadeInBeginStoryBoard" />
</EventTrigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
Assuming you have declared the sys namespace as:
xmlns:sys="clr-namespace:System;assembly=mscorlib"
Hope this helps!
I would like to do something that is seemingly quite simple, but I cannot figure out how to do it. I have a ColorAnimation that is triggered when the MouseEnter event occurs. It simply changes the background color of a Border from one color to another color.
Unfortunately, I can't figure out how to put anything but hardcoded colors into this ColorAnimation. So it looks currently like this:
<Style x:Key="MouseOverStyle">
<Style.Triggers>
<EventTrigger RoutedEvent="Mouse.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Duration="0:0:0.5" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)"
To="Red" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
However, I'd like do something either like this:
<SolidColorBrush x:Key="MyEventColor" Color="{Binding EventColor}" />
<Style x:Key="MouseOverStyle">
<Style.Triggers>
<EventTrigger RoutedEvent="Mouse.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Duration="0:0:0.5" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)"
To="{StaticResource MyEventColor}" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
Or like this:
<Style x:Key="MouseOverStyle">
<Style.Triggers>
<EventTrigger RoutedEvent="Mouse.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Duration="0:0:0.5" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)"
To="{Binding EventColor}" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
When I try to do either of those, an exception gets thrown. For the first, it throws an exception telling me essentially that the "Color" property can't take a SolidColorBrush value...which makes sense...but it certainly doesn't help me out because the ColorAnimation won't let me animate the "(Border.Background).(SolidColorBrush)" property...it will only let me animate the "(Border.Background).(SolidColorBrush.Color)" property....
The exception on the second example basically tells me that it "Cannot freeze this Storyboard timeline tree for use across threads" ...so it sounds like the ColorAnimation is trying to do this binding in some other thread than the UI thread or something? Whatever it's trying to do...it isn't working.
How the heck can I do such a simple task?
For the first one, you could use {StaticResource MyColor} with MyColor defined as such:
<Color x:Key="MyColor">#FF00FF00</Color>
However, this doesn't solve your problem: you can't bind to animation properties since those properties need to be frozen (unchangeable) for the animation to work. Either try to remove your dependence on a binding, or recreate the storyboard with the correct color from code behind when the color changes.
I am trying to create a simple (I think) animation effect based on a property change in my ViewModel. I would like the target to be a specific textblock in the control template of a custom control, which inherits from Window.
From the article examples I've seen, a DataTrigger is the easiest way to accomplish this. It appears that Window.Triggers doesn't support DataTriggers, which led me to try to apply the trigger in the style. The problem I am currently having is that I can't seem to target the TextBlock (or any other child control)--what happens is which the code below is that the animation is applied to the background of the whole window.
If I leave off StoryBoard.Target completely, the effect is exactly the same.
Is this the right approach with the wrong syntax, or is there an easier way to accomplish this?
<Style x:Key="MyWindowStyle" TargetType="{x:Type Window}">
<Setter Property="Template" Value="{StaticResource MyWindowTemplate}"/>
<Style.Triggers>
<DataTrigger Binding="{Binding ChangeOccurred}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard BeginTime="00:00:00" Duration="0:0:2" Storyboard.Target="{Binding RelativeSource={RelativeSource AncestorType=TextBlock}}"
Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
<ColorAnimation FillBehavior="Stop" From="Black" To="Red" Duration="0:0:0.5" AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
</DataTrigger>
</Style.Triggers>
</Style>
Update
Should have also mentioned that I tried to name the TextBlock and reference it via StoryBoard.TargetName (as Timores suggested), and got the error "TargetName property cannot be set on a Style Setter."
EDIT: I have overseen the fact that the TextBlock is in the ControlTemplate of your custom Window/Control. I do not think that it is possible to target a control within the ControlTemplate from a Storyboard outside of this ControlTemplate. You could however define a property on your custom Window which you then databind to your ChangeOccurred property, and then add the trigger to your ControlTemplate which will now get triggered by the custom Control's property rather than the Window's ViewModel's property (of course, indirectly it is triggered by the ViewModel because ChangeOccurred is bound to the property of the custom Window which in turn triggers the animation - uh, complex sentence, hope you understand). Is this an option? Could you follow? ;-)
Maybe some code helps:
public class MyCustomWindow : Window
{
public static readonly DependencyProperty ChangeOccurred2 = DependencyProperty.Register(...);
public bool ChangeOccurred2 { ... }
// ...
}
And some XAML:
<local:MyCustomWindow ChangeOccurred2="{Binding ChangeOccurred}" ... >
<!-- Your content here... -->
</local:MyCustomWindow>
<!-- Somewhere else (whereever your ControlTemplate is defined) -->
<ControlTemplate TargetType="{x:Type local:MyCustomWindow}">
<!-- your template here -->
<ControlTemplate.Triggers>
<Trigger Property="ChangeOccurred2" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard BeginTime="00:00:00" Duration="0:0:2"
Storyboard.TargetName="txtWhatever"
Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
<ColorAnimation FillBehavior="Stop"
From="Black" To="Red"
Duration="0:0:0.5"
AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
Note: I named the Window's property ChangeOccurred2 because I wanted it to be distinguishable from the ViewModel's ChangeOccurred property. Of course, you should choose a better name for this property. However, I am missing the background for such a decision.
My old answer:
So, you want to animate a TextBlock which is in the content of a (custom) Window?!
Why do you want to set the style on the Window, and not on the TextBlock itself? Maybe you should try something like this (did not test this!):
<local:MyCustomWindow ... >
<!-- ... -->
<TextBlock x:Name="textBlockAnimated" ... >
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<DataTrigger Binding="{Binding ChangeOccurred}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard BeginTime="00:00:00" Duration="0:0:2"
Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
<ColorAnimation FillBehavior="Stop"
From="Black" To="Red"
Duration="0:0:0.5"
AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
<!-- ... -->
</local:MyCustomWindow>
The {Binding ChangeOccurred} might not be sufficient. You might have to add a DataContext to the TextBlock, or add a RelativeSource or something.
Is the TextBlock in the MyWindowTemplate ?
If so, give the TextBlock a name and use Storyboard.TargetName to reference it.
See another question in SO