WPF Fade Animation

Question

How would I make a control fade in/out when it becomes Visible.

Below is my failed attempt:

Answer 1

You can't directly use the Visibility property for a fade out because setting a trigger on it will first Hide/Collapse the control, THEN animate it. So basically you'll got an animation on a collapsed control => nothing.

One "reliable" way would be to introduce a new Dependency Property (attached or not), say IsOpen and setting a property trigger IsOpen=True on it with:

EnterAction:

• Make sure Visibility is set to Visible
• Fade in the Opacity from 0 to 1

ExitAction:

• Visibility set to Visible at keyframe 0 and Collapsed/Hidden at the last Keyframe
• Fade out the Opacity from 1 to 0.

Here's an example: