Creating Hello World in Silverlight 2 - Page 3
       by kirupa  |  27 March 2008

In the previous page, you modified your textblock to say hello, world, and you also changed the font and font size. The last few things we are going to focus on are making some minor visual tweaks.

Resizing our Application
First, let's resize our application, because currently we are taking up a lot of space. The easiest way to resize your application is to look in your Objects and Timeline panel and select the object marked UserControl:

[ your UserControl is almost like the root element ]

With your UserControl object selected, look in the artboard, and find a corner with the resize adorner displayed. Once you have found a resize adorner, click on it with your mouse and begin dragging:

[ your resize adorner allows you to drag your selected object to a new size ]

Continue dragging your resize adorner inward to make your application's width and height smaller:

[ my application is now significantly smaller! ]

The size you choose to resize to is entirely up to you, but I'm going to keep it at a smaller size as shown above.

Changing the Background Color
The next thing we will do is change the background color of our application. From the Objects and Timeline panel, select the control labeled LayoutRoot:

[ LayoutRoot is actually a Grid control, but I'll discuss that at a later time ]

Once you have selected LayoutRoot, look in your Properties panel and find the category marked Brushes:

[ your Brushes category allows you to play with colors ]

Select the Background brush (it should be selected by default already as shown in the above image), and use the Color Editor to pick a color that you like. Lacking creativity at this moment, I'll pick a light-gray color:

[ select a single color that you would like to use ]

Notice that whatever color you pick, the background of your application changes to reflect that:

[ black text on a gray background - very colorful! ]

While you can actually do more than just have a single, solid-color background, we'll keep it simple this time around.

One More Thing
The very last thing we are going to do is move our textblock to the center of our application. This is actually a lot easier than you may think. Simply click on your hello, world text block and just drag it towards the center of your application:

[ dragging things around is a quick and dirty way of positioning items ]

And now - we are done with our little hello, world application. Hopefully the past few pages gave you a quick glimpse of Expression Blend and how to use it to create a very simple application.

If you are curious to see how my version of this application looks like, feel free to download and extract the Blend / Visual Studio 2008 solution files below:

Download Source Files

1 | 2 | 3