How do I using resource colors in doubleanimation WPF?

Question

1.00/5 (3 votes)

See more:

Hi folks.
I tried to animate my ToggleButton during MouseEnter and MouseLeave.
Below code works when I use directly the color code.
But if I reference it to a resource, it doesn't work and give me exception.

Exeption Thrown:
System.Windows.Markup.XamlParseException: ''Set property 'System.Windows.Media.Animation.ColorAnimation.From' threw an exception.' Line number '137' and line position '46'.'
Inner Exception: ArgumentException: '#FF2E353F' is not a valid value for property 'From'.

Any kindly help please?

What I have tried:

This works Fine.

XML

<BeginStoryboard x:Name="BeginStoryboardNameR">
    <Storyboard>
        <ColorAnimation From="#015CBF" To="#007AFF" 
                        Storyboard.TargetName="templateRoot" 
                        Storyboard.TargetProperty="(Control.Background).(SolidColorBrush.Color)"
                        FillBehavior="HoldEnd"
                        Duration="0:0:.2"/>
    </Storyboard>
</BeginStoryboard>

This code doesn't work and gives me exception.

XML

<SolidColorBrush x:Key="MyBox.TButton.Bg" Color="#FF2E353F"/>

<BeginStoryboard x:Name="BeginStoryboardNameR">
    <Storyboard>
        <ColorAnimation From="{StaticResource MyBox.TButton.Bg}" To="#007AFF"
                        Storyboard.TargetName="templateRoot"
                        Storyboard.TargetProperty="(Control.Background).(SolidColorBrush.Color)"
                        FillBehavior="HoldEnd"
                        Duration="0:0:.2"/>
    </Storyboard>
</BeginStoryboard>

Posted 13-Dec-23 0:31am

Sh.H.

Updated 13-Dec-23 1:02am

v3

Add a Solution

Comments

Richard MacCutchan 13-Dec-23 6:38am

"it doesn't work and give me exception."
You have posted enough questions here to know that we cannot guess what you mean by "it doesn't work", nor can we guess what exceptions you see. So please use the Improve question link above, and add proper details of the problem.

Sh.H. 13-Dec-23 7:02am

Done.

Richard MacCutchan 13-Dec-23 7:13am

What is it about that exception message that you do not understand?

Sh.H. 17-Dec-23 14:34pm

I need to use the color as resource, not directly.

Richard MacCutchan 18-Dec-23 3:15am

Then create a Color resource.

Sh.H. 18-Dec-23 5:58am

Yes. And if you kindly pay attention to the post, you will see that Visual Studio sends exception about the Color Resource I made! And I need help on this. Thanks.

Richard MacCutchan 18-Dec-23 6:29am

How many times do we need to say this? The ColorAnimation From element requires a Color value or resource. So create a proper Color resource or use the actual value of the Color.

Sh.H. 18-Dec-23 6:45am

Thank you

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Dave Kreskowiak · Accepted Answer · 2023-12-13T05:01:00

Solution 1

Your resource is a SolidColorBrush, not a Color, which is what From expects.

I think your resource should be:

XAML

<Color x:Key="MyBox.TButton.Bg">#FF2E353F</Color>

Posted 13-Dec-23 5:01am

Dave Kreskowiak

Comments

Sh.H. 17-Dec-23 14:34pm

Doesn't work!

Dave Kreskowiak 17-Dec-23 21:16pm

Yeah, "doesn't work" is the most useless problem description ever.

Get any error messages? Paste the code as you're using it now, and that includes any other relevant resources and the Button XAML.

Sh.H. 17-Dec-23 23:56pm

The exception is still the same as before as I wrote in the main topic.
This is the exception:
ArgumentException: '#FF2E353F' is not a valid value for property 'From'.

Sh.H. 17-Dec-23 23:59pm

I think I should make any change in line Storyboard.TargetProperty

Dave Kreskowiak 18-Dec-23 1:12am

No, the target property is correct. It's yelling at you because you're not supplying a Color object. In the code you posted above, you're supplying a SolidColorBrush.

You can define a Color and a SolidColorBrush using the same Color, like this:

<Color x:Key="BackgroundColor">LightBlue</Color>
<Color x:Key="HightlightColor">Yellow</Color>
<SolidColorBrush x:Key="BackgroundBrush" Color="{StaticResource BackgroundColor}" />
<SolidColorBrush x:Key="HighlightBrush" Color="{StaticResource HightlightColor}" />

And in your ColorAnimation, you would use it like this:

<ColorAnimation Storyboard.TargetName="Border"
    Storyboard.TargetProperty="Background.Color"
    From="{StaticResource BackgroundColor}" 
    To="{StaticResource HightlightColor}" 
    Duration="0:0:0.3" 
    AutoReverse="True"
    RepeatBehavior="Forever" />

But, like I said before, you'd have to supply more of the XAML to see what's going on. What element is this StoryBoard inside? Is it in a ControlTemplate? How are you using this? Without this information, it's impossible to tell you what's going on.

Sh.H. 18-Dec-23 6:11am

Thanks for comment.
There is nothing more that I post in the topic.
So I don't know what I should do!

By the way, is there any possibility to use SolidColorBrush as template? I just want to know if works or not.

Dave Kreskowiak 18-Dec-23 9:43am

So when you hover the mouse over the button, the button turns light blue, doesn't it?

Sh.H. 18-Dec-23 12:50pm

No. When I hover the mouse over the button, the application crashes and the Visual Studio gives me the exception which I said in the topic.

Dave Kreskowiak 18-Dec-23 12:55pm

That exception can only be thrown because you haven't changed the SolidColorBrush resource to a Color resource. That's it. That's all it can be.

I'll say it again, show more of the XAML, like the Resources section you're using and the button. If you don't do this, you've not going to get an answer.

Sh.H. 18-Dec-23 12:57pm

Yeah but I did. But no luck! I wish I could send here screenshot.

Dave Kreskowiak 18-Dec-23 13:03pm

Show more of the XAML because there's stuff you're not telling us, nor showing that's important to solving the problem.

Sh.H. 18-Dec-23 13:11pm

Dear, there is nothing more!

Dave Kreskowiak 18-Dec-23 13:20pm

If you're still getting the exception abovee, it's because you defined a SolidColorBrush as a resource and you're feeding that resource to the From parameter in the ColorAnimation. The From parameter requires a Color object, not a SolidColorBrush.

I've told you what to do to fix that exception. It's up to you to actually do the work.

Sh.H. 19-Dec-23 0:10am

Thanks and I understood.
I have a question.
I also have another object on my UI which is a TextBox.
So I used the exact code with referring SolidColorBrush on it. There it works perfect.
So my question is, if the parameter require Color and not SolidColorBrush, why it works with SolidColorBrush on TextBox?
I should add that I tested it on also Button, Image, and TextBlock. All worked fine. The only object does not work is ToggleButton!!!!!!!!!

Dave Kreskowiak 19-Dec-23 9:14am

BECAUSE YOU NEED TO SUPPLY A COLOR OBJECT TO THE FROM PROPERTY AND NOT A SOLIDCOLORBRUSH!!!! HOW MANY TIMES DO I HAVE TO SAY THAT!!!!

The Background property can take a SolidColorBrush or Color. The From property can only take a color. YOU ARE CONFLATING THE BACKGROUND PROPERTY OF A CONTROL WITH THE FROM PROPERTY OF A COLORANIMATION. THE TWO PROPERTIES ARE NOT THE SAME!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Dave Kreskowiak 18-Dec-23 13:39pm

Wait a minute. What is "templateRoot"? Like I said, you have to provide ALL of the relevant XAML, not just this little snippet.

Sh.H. 19-Dec-23 0:06am

TemplateRoot is the name of the ToggleButton I used in the UI, which I want the animation works on it.

Dave Kreskowiak 19-Dec-23 9:12am

You're still not getting it. The StoryBoard cannot be applied directly to a button. It CAN however, be applied to a ControlTemplate or some other Style element the button is built from. You STILL have not shown what is containing the StoryBoard and ColorAnimation.