Richard Griffin, Steven Evans and I spent a week working on a Silverlight demo that Paul Dawson used as part of his ReMix presentation "WPF & Silverlight: A Loaded gun?" although I can't publish the demo yet, I thought it might be useful to go over some of the things we learnt putting it together.
Ensure you have correct bits installed
I know this sounds obvious – but if you're an alpha geek who installs all the latest CTPs, it's easy to get out of synch and then spend hours wondering why the project doesn't compile correctly. Follow the official instructions. If you don't want to contaminate your dev machine – create a VPC image and then tune it.
Also make sure you have the tool you need for testing / debugging / troubleshooting when things go wrong:
Update Blend 2.0 May CTP to work with Orcas Beta 1
Blend 2.0 May CTP doesn't integrate with Orcas Beta 1 projects out of the box – you need to create a Blend.exe.config file in the applications directory which updates Blend's MSBuild version to Orcas' version. The full steps are outlined in the Blend 2 May CTP Readme file.
Use Blend 2.0 May CTP for layout and adding controls
The build of Cider (the WPF design surface) that ships with Orcas Beta 1 does not support the Silverlight XAML schema yet (thus inside Orcas you always get the "code view" of .XAML files) so unless you want to do layout, animation and custom control addition by hand you'll need to do all of that in Blend.
One note of caution – Blend sometimes seems to create invalid xmlns directives when referencing external assemblies; the project will compile inside Blend, but not Orcas. Ctrl-Z is your friend in this scenario.
"Add Silverlight Link" NOT "Add Reference"
If you have a multi-project solution, one of the peccadilloes of Silverlight emerges – you can't link projects together using the standard "Add Reference" option – you have to use the new "Add Silverlight Link" option instead – otherwise project content (i.e. XAML files, folders and .dlls) are not updated correctly.
Define your Solution and Project structure
We knew from the start that we were going to have multiple projects within our solution. We wanted to separate out the website, Silverlight application and Silverlight controls. So we followed the Conchango reference build structure and then added three projects under the "Solutions" folder:
- ProjectName.App – this contains the Silverlight Application
- ProjectName.Controls – this contains all the reusable controls such as Buttons, Sliders etc
- ProjectName.Web – this contains the website which hosts the Silverlight app.
¦ ¦ +---Assets
¦ ¦ ¦ +---PageName
¦ ¦ ¦ +---Music
¦ ¦ ¦ +---Video
¦ ¦ +---ClientBin
¦ ¦ +---Properties
¦ ¦ +---Assets
¦ ¦ +---ClientBin
¦ ¦ +---Common
¦ ¦ +---Properties
Project.App was linked into ProjectName.Web throught the use of the "Add Silverlight Link" mentioned in the previous tip. Once the Solution is compiled this caused all the contents (Folders, XAML files and .dlls) to be copied into the ProjectName.Web project. So ensure your ProjectName.Web project is clean before you add it to Source Control – otherwise you'll hit problems when you build your project in the future.
To keep ProjectName.Web as clean of referenced files as possible, we settled on the convention of keeping all images, music and video in a folder called Assets. Because the design of our app is quite graphically intensive we decided to create a folder per XAML Page to contain its graphics.
Missing basic controls? Turn to the Community...
Silverlight 1.1 is an Alpha release after all – so much of the RTM functionality is still missing, including many of the intrinsic controls you'd use on a day to day basis (such as Button, TextBox etc). One solution is to use and modify the samples supplied as part of the Silverlight 1.1 Alpha SDK or you could try experimenting with the more extensive Layout System and Controls recently released by Dave Relyea.
Gather as many samples as you can
The best way to learn it to check out what everybody else is up to. For the first few weeks after Mix07 samples were a little thin on the ground (oh look! Another rotating rectangle that's clickable!). I found the following links quite useful:
When copying sample code ensure your Build Actions are correct
I first fell foul of this issue when I imported the Silverlight 1.1 Alpha SDK controls sample into our ".Controls" project. I selectively imported the files I wanted to use and could not, for the life of me, workout why the Button control would not load and caused a runtime error.
Because Silverlight 1.1 does not support the WPF style of XAML file / nested partial class code-behind, the workaround is having a XAML file as an embedded resource with the same name as the class file. In the constructor of the class reflection is used to extract the XAML file and instantiate it.
If you import the files into a project you will lose the Build Action settings which will specify that the XAML files are "Embedded Resource" rather than "SilverlightPage" thus when the class is instantiated the XAML file cannot be retrieved from the Assembly Manifest and the exception will be thrown.
Add ASP.NET Futures controls to the toolbox
A new drop of the ASP.NET Futures project was released to coincide with the release of Silverlight 1.1 Alpha. This project adds two ASP.NET server controls; a Media Control which simplifies the hosting of audio and video and a XAML Control which eases the pain of hosting XAML files.
To add the controls to the Toolbox you need to right click, select "Choose Options", select the ".NET Framework Components" tab, sort the list by Namespace and browse to Microsoft.Web.Preview.UI.Controls and select the "Xaml" and "Media" options. You should now be able to drag and drop the controls onto the page from the toolbar.
ASP.NET Futures XAML Control has a fundamental bug
The current implementation of the ASP.NET Futures XAML control causes the same "Click to activate" issue that has affected the Flash community for the past couple of years since the Microsoft / Eolas case. The simplest workaround is not to use the XAML control, as the default method for instantiating the Silverlight plug-in does not cause this behaviour. This issue should be fixed in the next release.
Enable Silverlight Debugging in Web Projects
If you are trying to debug your Silverlight application from within a Web Project and for some strange reason none of your breakpoints get hit – ensure that you've selected Silverlight Debugger option in the "Web Project Property Pages > Start Options > Debuggers" section.
Isolated Storage Quota