Today I will show you how to make this:
In WPF (with sound).
Full source code can be found on a GitHub page.
How it works?
- Behavior attached to window listens to key-presses
- When sequence for Konami Code is completed then it lanuches Storyboard animation
- Storyboard moves raptor and plays raptor squeak.
Behavior is an attachable piece of code to various XAML elements. It’s part of Blend SDK (you can find it on nuget, but it is not official Microsoft release).
Usage of KonamiCodeBehavior looks like this:
Storyboard with a Key
EasterEgg is animation which should be launched when Konami Code is entered.
If you want to know how that behavior was written you should look at
KonamiCodeBehavior.cs file – duh.
Animation code looks like this:
MediaTimeline tells what media should be played and by who.
Storyboard.TargetName="MediaElement" points to
<MediaElement Name="MediaElement" /> defined inside Window content which does heavy-lifting of playing sounds.
Then we have
ThicknessAnimationUsingKeyFrames which have defined:
- What object will be manipulated –
- What property of that object will be modified –
- How long all operation should take –
Keyframes are like bus stops for modified value.
Initial margin value for image is
"0,0,0,-300" which means, whole picture under window canvas (picture is 300 px in height).
So first stop for value is
"0,0,0,0" which should be done at
0:0:0.5 after animation is started.
LinearThicknessKeyFrame tells how that value should change over time. It should be changed in linear fashion.
Second stop moves raptor outside window canvas.
Last keyframe is
DiscreteThicknessKeyFrame which means value is change instantly at
KeyTime. Which resets image position to starting one.