Shine Draw

Today, I try to upgrade my first sample in this blog to Silverlight 2. Out of my expectation, the code work perfectly and actually I can run the application directly after copy and paste the files.

Anyway, there are some interesting findings when updating the code. I will try to list them all during the upgrade.

Comparison

What’s the difference?

• DispatcherTimer vs CompositionTarget.Rendering

Source codes

•   3D Text Space [Silverlight 2, C#] (19.5 KiB, 1,455 hits)

Silverlight

DispatcherTimer vs CompositionTarget.Rendering

In Silverlight 2, it’s much simpler to simulate the  enter frame event by using CompositionTarget.Rednering. It enables you to modify the frame rate easily as well.

// C#
// New Method
Application.Current.Host.Settings.MaxFrameRate = fps;
CompositionTarget.Rendering += new EventHandler(CompositionTarget_Rendering);

void CompositionTarget_Rendering(object sender, EventArgs e)
{
	// do your stuff here
}

// Old Method
DispatcherTimer timer = new DispatcherTimer();
timer.Interval = new TimeSpan(0, 0, 0, 0, 1000/fps);
timer.Tick +=new EventHandler(_timer_Tick);
timer.Start();

void  timer_Tick(object sender, EventArgs e)
{
	// do your stuff here
}

The application is implemented based on 3D Text Space. You will notice that the number of characters displayed in the Silverlight version is much less than that in Flash. It’s because Text Rendering in Silverlight is CPU intensive and too many TextBlock objects will make the application crash.

I think there are some other ways to increase the performance of using TextBlock in Silverlight. However, I didn’t have any idea yet. If you have have any suggestions, please feel free to share with me.

Vote for this sample

Comparison

Flash implementation: 80 minutes(Implemented First)

Silverlight implementation: 50 minutes

Source codes

•   Spiral Text [Flash 9, AS3] (35.4 KiB, 543 hits)
•   Spiral Text [Silverlight 2, C#] (20.9 KiB, 535 hits)

Silverlight

Text Effect is a very common feature for many online application. Today, I am going to introduce you a simple, but also beautiful, text effect application. It’s time to decorate your application!

Vote for this sample

Comparison

Flash implementation: 70 minutes (Implemented First)
Silverlight implementation: 80 minutes
What’s the difference?

• String to ASCII Code: charCodeAt [AS3] vs Convert.ToInt16 [C#]

Source codes

•   Simple Text Effect [Flash 9, AS3] (142.4 KiB, 489 hits)
•   Simple Text Effect [Silverlight 2, C#] (20.6 KiB, 661 hits)

Silverlight

String to ASCII Code: charCodeAt [AS3] vs Convert.ToInt16 [C#]

When you are working with text, you shouldn’t miss out the following following codes which convert a string value and ASCII code.

// AS3
var text:String = "Testing";

// Get the ASCII code for the character "T"
text.charCodeAt(0)

// Get the string value of the ASCII code 80
var char:String = String.fromCharCode(10);

In C#, you can achieve the same result by using the System.Convert Class.

// C#
String text = "Testing";

// Get the ASCII code for the character "T"
Convert.ToInt16(text.ToCharArray()[0]));

// Get the string value of the ASCII code 80
String char = Convert.ToChar(80).ToString();

I have organized all my previous samples and grouped into the Gallery.

You may now access the Gallery via the Tab above or though the link below:

Flash vs Silverlight Gallery

Enjoy it~

This is the first application request by reader (submitted by Slyi). He saw a very interesting text effect implemented by JavaScript and he would like to migrate this to the Silverlight. I think this sample can be easily adopted by Silverlight.net since I greatly promoted their Product. ^_^

There will be no post tomorrow. It’s because I will spend my time too arrange all of my samples and make a show case gallery.

Vote for this sample

Comparison

Flash implementation: 30 minutes  
Silverlight implementation: 1 hour (Implemented First)
What’s the difference?

• flash.text.TextField [AS3] vs System.Windows.Controls.TextBlock [C#]

Source codes

•   Waving Text [Flash 9, AS3] (135.7 KiB, 457 hits)
•   Waving Text [Silverlight 2, C#] (17.8 KiB, 519 hits)

Silverlight

flash.text.TextField [AS3] vs System.Windows.Controls.TextBlock[C#]

Creating a text field in AS3 looks similar to that of C#. However, the TextFormat class makes styling of AS3 text easily. Besides, the text field in Flash supports HTML Text as well. (If I am not wrong, Silverlight doesn’t have any support for HTML Text.)

// AS3
// create text format
var format : TextFormat = new TextFormat();
format.size = FONT_SIZE;
format.font = FONT_FAMILY;
format.color = 0x0000FF;

// create the text block
var textField : TextField = new TextField();
textField.text =  "text";
textField.setTextFormat(format);
textField.selectable = false;
addChild(textField);

// get the actual width and height
var actualWidth:Number = textField.textWidth;
var actualHeight:Number = textField.textHeight;

The source file size of Flash is larger than Silverlight. It’s because I have embed the font in the FLA. You can see that even no font is embed in Silverlight, it still handles the text quite well. Hence, my vote is for Silverlight this time.

Moreover, Slyi found that animating the text will consume a lot of resources. What do you think ?

Note:
Performance Tip: Animating the size of text can potentially use a lot of system resources. This is because when Silverlight renders text, it uses hinting to smooth each text glyph. If you animate the text size (by using a Transform or FontSize), Silverlight will hint the glyphs for each frame, which is costly and could cause frame dropping. If your application requires dynamic scale changes of large text, it may be better to use vector graphics to represent the text.
http://msdn.microsoft.com/en-us/library/cc189010(VS.95).aspx

// C#
// create the text block
TextBlock textBlock = new TextBlock();
textBlock.Text = "text";
textBlock.FontSize = FONT_SIZE;
textBlock.FontFamily = new FontFamily(FONT_FAMILY);
textBlock.Foreground = new SolidColorBrush(Colors.Blue);
textBlock.TextAlignment = TextAlignment.Center;
LayoutRoot.Children.Add(textBlock);

// get the actual width and height
double actualWidth = textBlock.ActualWidth;
double actualHeight = textBlock.ActualHeight;