0 comments
.NET 
It is one of the problems that most Silverlight developers using Composite WPF have come across when working together with a designer on their team. The screens can be implemented using blend, but databinding is somewhat painful.
The only reason for this is that it’s quite impossible to link a data source at design time to the screen. Composite WPF simply isn’t build to support it. So you’re left with a designer who has to either specify custom binding expressions in Expression Blend or a developer who has to setup the bindings in Visual Studio.
In this article I’m going to show you how Microsoft Expression Blend 4 will make your life easier when you’re doing Composite WPF development in Silverlight or WPF.
Sample data sources
For the first time since Expression Blend was first invented you can specify sample data sources that will allow any designer to bind against a particular object without having to actually bind it. This eliminates the need to let the developer specify the databindings after the designer is done. It also eliminates the need to use custom binding expressions.
To bind a sample data source you need to select Data tab inside Expression blend. You will be greeted by a rather empty space with a couple of buttons in the top-right corner of the toolwindow.
Click on the Create sample data button and choose the Create sample data from class option to add a new sample data source. The application will display a special dialog that will allow you to select any type from one of the assemblies referenced in the project or from the project itself as a sample data source.
Once the data source is created you can drag the data source onto the designer view to link it to the DataContext property of the control being designed.
Now that you have linked the sample data you can use the normal databinding functionality in Expression Blend to bind the various controls on the view to the model.
The only thing left to do for the developer is to hook up the real model when he attaches the view to the presenter/controller and let the runtime do the rest.
Updated behavior for binding commands
Another new and good thing in Expression Blend 4 is the renewed support for commands. Composite WPF had this in the framework since it was first released for WPF.
The implementation of the commands in Silverlight however was a bit odd. A designer can’t use it properly, so the developer has to bind the commands to the buttons. Also it’s quite impossible to execute a command on any other event except the Click event of a ButtonBase derived control.
When you’re doing Silverlight 4 and you are planning on using commands I suggest you skip the default implementation of the command functionality in Composite WPF and go for the improved InvokeCommandAction in Expression Blend.
To find this behavior you can select the Assets tab in the top-left corner of the designer and select the behaviors category. There’s a quite substantial list of behaviors so you might have to search a bit to find the InvokeCommandAction.
Add this behavior to a control by dragging it onto a control to which you want to link the command. You will end up with a component tree that looks like something in the following screenshot.
To configure the action select it from the control tree. It will show up in the properties editor on the right-hand side of the designer where you can configure what event the action should trigger on and what command should be invoked.
Previously you could only invoke a command that was exposed statically exposed by a class. This however has changed since actions support databinding in Silverlight 4. This is a big improvement and will make the life of action developers a lot easier.
To bind the command to the model you need to click the database icon behind the command field. The following editor will show up.
This dialog will allow you to select a field that will be bound as the command to invoke when the configured event triggers the action.
Tip: Check out my other article on actions to get a better sense of how actions work.
New behavior for binding methods
Also new in Expression Blend 4 is the CallMethodAction. It works just like the InvokeCommandAction, but instead of invoking a command it allows you to bind to a method in the model.
When this action is dragged from the assets window onto the designer it will allow you to edit the properties as shown in the following screenshot.
The method name should match the name of the method you want to invoke on the model. The target object should be specified explicitly. You can either bind this to an element by clicking the bullseye or databind it by clicking the database icon.
If you’re used to binding commands on your view model and don’t really have the need to bind methods I suggest you leave the CallMethodAction well alone. Binding methods from the model in your view using actions isn’t particularly pretty. At least I think it’s something you should try to avoid. The main reason for this is that there isn’t any way of knowing that you bound a method that exists in the model. The runtime doesn’t tell you either, it just fails silently.
It is however a nice addition for those that need this kind of functionality for whatever reason.
Conclusion
Silverlight 4 and Expression Blend 4 got me pretty excited after an already very promising Silverlight 3 release last year. Microsoft really has done a great job to improve on the designer + developer concept.
This post covered some of the important things that are coming for designers and developers working on business applications using Composite WPF. These feature are of course also usable for developers and designers not using the framework.
There are more behaviors available, so I suggest you check them out by downloading the beta of Silverlight 4 + Blend here and here.