Using the New Silverlight Designer in Visual Studio 2010
Silverlight developers everywhere rejoice! We now have a designer that can be used directly in Visual Studio 2010 which means you can drag-and-drop controls onto the design surface, access control properties, and modify them visually, set Grid columns and rows, plus more. Although I'm a huge fan of Expression Blend, it's nice to be able to modify controls directly without having to open up another program. If you're working on Silverlight 3 projects and are ready to move to Visual Studio 2010 you can continue to target version 3 while taking advantage of the new designer features.
I've found that the designer works great for most screens although it doesn't display some of my more complex layouts. That's not a big deal because those screens typically rely on a lot of custom templates and styles so I prefer to edit them in Blend anyway. Figure 1 is an example of what the new Visual Studio 2010 designer looks like. I personally find the split view to be the most useful since I still like to edit XAML by hand for some tasks. You can view the XAML or designer in full-screen mode if you'd like.
In addition to dragging controls onto the designer you can also double-click them to handle their default events. This is especially useful for Button controls where you'd like to quickly add a Click event handler. The new Properties window allows control properties and events to be accessed directly as in Figure 2.
One of my favorite features of the Properties window is that you can search for specific properties which is very useful when you can't remember the exact name of the property you're after. Although accessing property values and editing them without touching XAML is nice, one of the best features offered by the Properties window is the ability to set the DataContext, Source, Path, Converter and binding mode visually. For example, I use a custom AutoCompleteComboBox control in a lot of my screens that exposes an ItemsSource property. By highlighting the control and then locating the ItemsSource property in the Properties window I can handle the binding visually as in Figure 3.
The designer can also be used to define Grid columns and rows which is a huge boost to productivity especially if you're doing that by hand right now. Figure 4 is an example of a Grid control that has three rows and two columns added. By giving focus to the Grid in the designer I can click on the left edge to add rows and on the top edge to add columns.
You can also handle fixed sizing, star sizing and auto sizing (where the contents determine how big a row or column will be) by clicking on the menu in Figure 5.
Another great feature is the ability to reset the alignment, margins or size of a control showing in the designer. This is something I use a lot for margins since I may drag a control around on the interface to experiment with different placements but then want to remove the margin values that were added once I'm done. Just right-click on the target control and select Reset Layout --> All if you'd like to reset all alignment, margin, and size information for the control.
There's even more that the new Visual Studio 2010 Silverlight designer can do but this will hopefully whet your appetite and get you excited about making the move to 2010 if you haven't already.