Introduction

"In the right light, at the right time, everything is extraordinary." — Aaron Rose</strong />

What is Silverlight?

"Silverlight is a cross-browser, cross-platform plug-in for delivering the next generation of Microsoft .NET–based media experiences and rich interactive applications for the Web." —http://silverlight.net/

This project is meant to provide some basic guidance on how to create your first Silverlight application. The topic is one of the most famous fractals in mathematics: Sierpinski Triangle. This should allow the reader to become familiar with both the basics of creating an application in Silverlight, and the basics of working with XAML objects both in files and programmatically through C#.

I always recommend building something like a "Hello World" application, when learning a new development platform. The Sierpinksi Triangle has just enough flavor to keep beginners interested without confusing the issue with unneeded complexity.

Prerequisites

In order to create Silverlight applications you will need a machine, I recommend a virtual PC, and have it set up with the following Silverlight prerequisites:

Runtimes

To get started with Silverlight, download the Silverlight 1.1 Alpha release to use .NET languages.

Background

"The Sierpinski triangle, also called the Sierpinski gasket, is a fractal named after Wac?aw Sierpi?ski who described it in 1915. Originally constructed as a curve, this is one of the basic examples of self-similar sets."

Sierpinski Triangle demonstrates the following features:

how to work with polygons and points

how to use brushes and colors

how to work with backgrounds and images

how to use the timer

Using the code

Working with Silverlight means in a large part you will eventually have to work with XAML. A simple fractal like a Sierpinki Triangle is perfect opportunity to learn enough to become familiar with XAML, without being so demanding to have to learn everything about XAML first.

Main Methods

drawSierpinskiTriangle()

This is the real work horse of the application. Part of the definition of a Sierpinski Triangle is that it is self similar. In other words a perfect candidate for recursion.

Basically we are taking sets of triangles with white borders, and randomly colored interiors and placing them on the canvas in a repeating recursive pattern.

Page_Loaded()

This method handles all of the initialization of the fractal's variables. It starts the recursion, and kicks off a timer that will handle randomizing the triangle's background colors once the fractal is done drawing.

timer_Tick()

This event will be on a timer once the fractal recursion is completed. It's job is to create a new random color brush, then choose a random triangle and fill its interior with the new color. This is completely a cosmetic effect, just something to give the demo a little color, literally.

Tips & Tricks

Browser.HtmlTimer

I found there is an HtmlTimer class in Silverlight 1.1. This class is undocumented and marked obsolete.

Visual Studio shows a warning after compilation: 'System.Windows.Browser.HtmlTimer' is obsolete: 'This is not a high resolution timer and is not suitable for short-interval animations. A new timer type will be available in a future release.

Points of Interest

One thing you might notice is that we are always recreating our brush objects, and that we are never reusing any of them. This is because in Silverlight 1.1 Alpha, at least, you can only use a brush on one object. It will generate an exception if you attempt to reuse it again.

Be sure to check out the timer code using System.Windows.Browser.HtmlTimer, for now, it is the easiest way to do draw animations.

Resources

History

2007.05.20 - Uploaded original article

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

Comments and Discussions

If you want "built-in" write a WPF XBAP which provides a full next-generation environment built-right in to the browser.

You can write Silverlight apps with the 2MB plugin and Notepad if you like. The toolset is just there to make your life easier. I'd add the Blend 2.0 beta to that list too so you can do WYSIWYG design.

Personally I'm quite surprised how functional 1.1 is, considering 1.0 is still in beta. Usually when something is in beta you don't get alpha's of the next version to play with. You can actually develop something meaningful with 1.1 and deploy it to the web (admittedly without Microsoft support). Most Alphas I've seen in the past have serious restrictions and omissions (you know, the parts they are still developing).

Microsoft has been in the software business long enough to know better. Their "alpha" releases should not have omissions and design flaws of this nature. It makes me think they've got the newbies working on the "next generation" stuff, not the pros!

If it did not have omissions and design flaws it would be a Release Candidate not an alpha.

I don't know, to me alpha means "it works, for the most part" things are ugly and slow. Beta is where you should have all your features implemented, but still buggy. If this were a beta I would be worried.

Basically Silverlight allows developers to use .NET languages like C# and Visual Basic .NET, along with XAML to create "user experiences" that will work on Safari (Apple), Opera, Firefox, and Internet Explore, and soon Windows Mobile. There is effort underway to allow Silverlight to run on Mono, Linux.

So at first look, Silverlight competes with Flash, but it is meant to be more than that. End goal I would think is to make Web application possibilities equal or greater than desktop possibilities.

And remember the real object (and the strongest sell point IMHO for the developers) here is true code reutilization, and clear delineation of logical layers in your application code!!

The Interface is designed by a designer with little regard to the underlying business objects except to provide the buttons, links, menus, display properties etc. Designers rarely get wrapped up in the details of the business and data abstraction layers. The designer uses a design tool like Expression Blend or the Expression Suite to create a "Project" and the Interface. The Programmer (using VS obviously, after all this is the MS development stack) opens the project created in Expression (Yes the very same solution/Project file without any massaging or conversion required) and provides all of the code behind the scenes to make everything work. Programmers usually don't implement snappy efficient UI experiences.

NOW for the really cool part!! The XAML used to create the Interface and make calls to program code can be used equally well in Windows applications and Web applications. No More "Gee, I really like how this works on Windows, can we make it work like that in a browser??" and then spending days or even weeks attempting to port a windows application to the web and then god knows how long explaing the subtlties of why Windows apps are different than Web Apps (Most executives really don't care about your technical issues, they just want things to work). IT's THE SAME CODE written once for use on in either environment so it WORKS!!

Do yourself some favors though if you plan on using this framework to develop applications that can exist in either environment.

1) Learn to how to work cooperatively with your designer, they will be a huge ally in the future.

2) Learn as much as you can about working with "Disconnected Data" and "Web Services". Web Services are a huge time saver for creating agnostic services that don't care how the data is represented. By nature though they are NOT persistent so you need to learn how to work with data in this environment, especially if you are from a traditional Client Server Windows desktop background.

3) Pay close attention to the separation of layers in your code, this helps immensely with both items 1 and 2 above. Make sure that Data Rules are implemented in the data layer, business rules are clearly defined and implemented ONE time in the Business Rules Layer, and the Interface DOES NOT HANDLE ANY Data rules or business rules.

Just my thoughts on the future of development, XAML, and the "Promise" of Silverlight.