SilverLight – Layout Managers

January 14, 2009 By: Dave

I know it is customary to start out presentations of new technology with a “Hello World” application, but if you have any interest in SilverLight you’ve probably already seen one of those and it really didn’t help you a whole lot.

Where we really need to start off is at the beginning, with the foundational concepts that will enable you to get moving on your own basic SilverLight application. What you need to know is how SilverLight is like and unlike other things you might already know.

The best place to start in that regard is with the Layout Managers.

There are three basic layout managers available to you in SilverLight. By nesting layout managers within other layout managers you can achieve the various types of layouts you might be looking for.

Canvas Layout
The one that will feel the most familiar to Windows programmers is the Canvas Layout. Any controls you place within a Canvas Layout will be absolute positioned within the layout container.

Grid Layout
The Grid Layout will feel most familiar to web developers who have used the table tags for all of their layouts. You can use the Grid Layout to create fixed or relative sized cells and you can place controls within a cell or have them span a cell. This works a lot like the Windows Forms Grid Layout manager.

So that a grid defined like this:

Can be used to place elements like this:

Stacked Layout
The last layout manager places controls in a row or a column one after the other. Either one under the other, or next to each other side by side.

Other Places Talking About SilverLight Layout Managers:

New layout controls in the Silverlight Toolkit – If you have special layout requirements you can use the DockPanel or WrapPanel source code as a starting point for your own layout control. I also recommend checking out Dave Relyea’s twopart series on the Silverlight 2 Layout System …

Silverlight Layout Control – Getting Started with XAML … – This video shows how to use XAML to create complex layouts using the AgLayoutControl™ Suite for Silverlight.

Silverlight – Layout Management – Silverlight and WPF support a flexible layout management system that enables developers and designers to easily coordinate how controls are positioned within a UI surface. This layout system supports both a fixed …

Silverlight 2.0 Layout Management – This is the most powerful layout container in Silverlight. It allows you to organize your elements into an invisible grid of rows and columns. Many elements can be placed inside a cell. That element can be another layout container. …

Silverlight Layout Control: building complex layouts from simple … – With the release of Silverlight 2 Beta 1, all developers got a long awaited layout management system and some useful panels: StackPanel and Grid. In addition to Canvas, these containers were intended to satisfy all the layout needs …

Other post in Silverlight