It has been a long time that I didn’t implement text effect comparison. Text Rendering is a very interest topic when comparing Flash and Silverlight. It’s because they have different rendering system which result in a dramatic differences on performance and readability.
If you are going to make animations using text, I am sure Flash is much more better. Take a look on my previous sample “Text Tunnel“.
Nevertheless, I didn’t stress on performance for this entry. Instead, you could see how I handle Color Animation differently.
Comparison
Flash implementation: 1 hour 20 minutes (Implemented First)
Silverlight implementation: 1 hour
What’s the difference:
- Color Animation: Timeline method (Flash) vs ColorAnimation (Silverlight)
Source codes
Matrix Text Effect [Flash 9, AS3] (34.5 KiB, 1,622 hits)
- Matrix Text Effect [Silverlight 2, C#] (14.1 KiB, 1,417 hits)
Flash
Silverlight
Color Animation: Timeline method (Flash)
Tween Class in AS3 is not able to modify the color of an object. Of course, you may still modify the color integer value directly. However, the value is calculated in a linear way and it will not be what you are looking for.
Let’s back into basic, we are still able to tween the color of an object using the timeline approach. I won’t go into too much details here since it’s a bit hard to describe. You may download the source code and study it on your own.
ColorAnimation and StoryBoard (Silverlight)
For Silverlight, we may tween the color of an UI object using the following code:
// C#
// create a text block
TextBlock textAnimation = new TextBlock();
textAnimation.Text = "Text";
textAnimation.Foreground = new SolidColorBrush(Colors.Black);
LayoutRoot.Children.Add(textAnimation);
// add a new story board to fade out the text color
Storyboard moveStoryboard = new Storyboard();
ColorAnimation colorAnimation = new ColorAnimation();
colorAnimation.To = Colors.White;
colorAnimation.Duration = new Duration(new TimeSpan(0, 0, 0, 0, FADE_DURATION));
Storyboard.SetTarget(colorAnimation, textAnimation);
Storyboard.SetTargetProperty(colorAnimation, new PropertyPath("(TextBlock.Foreground).(SolidColorBrush.Color)"));
moveStoryboard.Children.Add(colorAnimation);
moveStoryboard.Begin();
March 3rd, 2009 at 4:50 am
Man you’re making both Flash and C# look bad with your examples…
For Flash color tweening, if you’re not a poor newbie, you’re using tween classes like TweenLite, Tweener, gTween, etc. which perfectly and easily tween about anything, including colors and volume.
// complete color & position animation in one line instead of 18 in C#
TweenLite.to(target, time, { tint:targetColor, y:targetY });
March 3rd, 2009 at 8:27 am
I think the comparison is valid because you can easily write an extension method to hide the C# code but that really isn’t the point. There are loads of libraries out there to simplify tasks in .NET, Flash, whatever but I think sticking to what is in the core code is fine and a good comparison.
March 3rd, 2009 at 12:52 pm
I think there is some problem with the silverlight version, after going to half of the screen(bottom part), letters are not rendered as in the upper half part.
March 3rd, 2009 at 4:20 pm
Unhandled Error in Silverlight 2 Application Value was either too large or too small for a character. at System.Convert.ToChar(Int32 value)
at MatrixTextEffect.TextColumn._timer_Tick(Object sender, EventArgs e)
at System.Windows.CoreInvokeHandler.InvokeEventHandler(Int32 typeIndex, Delegate handlerDelegate, Object sender, Object args)
at MS.Internal.JoltHelper.FireEvent(IntPtr unmanagedObj, IntPtr unmanagedObjArgs, Int32 argsTypeIndex, String eventName)
March 3rd, 2009 at 5:05 pm
vCracker and BigBen:
My coding is not good enough to run in various computers. Anyway, I have fixed the problem. You may clear the cache and see the new version.
Philippe, thanks for the suggestion, those Tween Class are very useful. Hope we can have something similiar in Silverlight.
March 3rd, 2009 at 9:37 pm
In the Silverlight version I only see one line (with shadows) of text scrolling down.
March 3rd, 2009 at 9:48 pm
The silverlight example goes into alternate characters when it leaves your screen and when it comes back into your field of view it appears to have to purge the task and restart. Does this have to do with the random character generation? Either way this could pose issues for developers.
March 14th, 2009 at 5:51 am
AgTweener for Silverlight on CodePlex here:
http://agtweener.codeplex.com/Release/ProjectReleases.aspx?ReleaseId=14398
March 19th, 2009 at 10:14 pm
the silverlight version has some problem text is not showing properly
June 22nd, 2009 at 6:44 pm
How can i change text to only “1″ , ” 0″ in flash version
August 5th, 2009 at 10:52 pm
Silverlight is hanging if you scroll fast up an down an stop then
September 28th, 2009 at 8:42 am
[...] A matrix text falling effect created by Terence Tsang. [...]
November 10th, 2009 at 10:19 am
Thanks, was interesting to see the 2 running in the same browser. I’m still not convinced silverlight is reliable.
August 3rd, 2010 at 2:38 am
one of the wonderful website i ve ever seen …. thank u very much…