Take the 2-minute tour ×

Green & Red Arrows

Hi Experts,

I want to achieve a behavior that if "new value" is greater than "previous value" for a particular cell then I want to show a green color arrow as per the attached image above for "x" seconds and then it should fade away. And a red color arrow if "new value" is lower than "previous value".

Please guide how I can achieve it and it would be great if you can share some example. How can I mix data templates, animation & shapes to achieve this behavior?

Thanks SC

share|improve this question
Please edit all your question titles that have not already been fixed by someone else, the question title is not supposed to consist of a string of tags, it should describe the problem/question as concisely as possible. –  H.B. Oct 19 '11 at 16:50
OK I will be careful from next time and describe it appropriately. Regards, //SC –  SmoothCriminel Oct 19 '11 at 20:16

1 Answer 1

up vote 0 down vote accepted

I would go for the following:

  1. in the viewmodel for the value, expose property bool? isIncreasing.
  2. in the datatemplate for the value, set up a data trigger, which would show the appropriate arrow if isIncreasing is not null.

I don't see how animations are connected with the problem, however.

share|improve this answer
Thanks Vlad, I have similar logic to figure out if its going up or down but I just want to know how can I build ARROW using WPF animations/shapes. Or do I need to use an image? I am very poor at defining datatemplates... Regards, //SC –  SmoothCriminel Oct 19 '11 at 20:15
It's up to you, really. You can just use an image for the arrow, it's simpler. If you want your graphics to be scalable, you can use a Path instead. Something like this: <Path Fill="Green" StrokeThickness="0" Data="M 5,10 L 0,8 2,8 2,10 8,10 8,8 10,8 z"/> –  Vlad Oct 20 '11 at 9:09
And you still don't need animation for it. –  Vlad Oct 20 '11 at 9:09

Your Answer


