Setting up the development environment

Follow these steps to prepare the development environment:

1. Download the following files:
   
2. Run the installers in the same order in which they appear in the above table and follow the steps to complete the installation wizards.
3. Once the installations have successfully finished, run Visual Studio 2010 or Visual Web Developer 2010 (or later).
4. Select File | New | Project... or press Ctrl+Shift+N. Select Visual C# | Silverlight under Installed Templates in the New Project dialog box. You will see many Silverlight templates, including Silverlight Business Application and WCF RIA Services Class Library, as shown in the following screenshot:

Discovering the rich controls offered by the Silverlight Toolkit

Silverlight Toolkit is a Microsoft project offering many rich controls, components, and utilities that can help us to enhance our Silverlight UI (User Interface). As we want to create a very attractive UI for SharePoint, it is convenient to get familiar with its features. Follows these steps to see the controls in action and to change the values for many of their properties.

1. Select Start | All Programs | Microsoft Silverlight 4 Toolkit April 2010 | Toolkit Samples and your default web browser will display a web page with a Silverlight application displaying a list of the controls organized in ten categories as follows:
   • Controls
   • Data
   • DataForm
   • Data Input
   • DataVisualization
   • Input
   • Layout
   • Navigation
   • Theming
   • Toolkit

   By default, the default.htm web page is located at C:\Program Files (x86)\Microsoft SDKs\Silverlight\v4.0\Toolkit\Apr10\Samples in 64-bit Windows versions.

2. Click on a control name under the desired category and the right panel will display the control with different values assigned for its properties, creating diverse instances of the control. For example, the following screenshot shows many instances of the Rating control under the Input category.
3. Click on the buttons shown at the bottom of the web page and you will be able to see both the XAML and the C# code used to create the sample for the control. For example, the following screenshot shows the XAML code for the DataGrid control example, DataGridSample.xaml. You can also click on DataGridSample.xaml.cs and check the C# part. This control appears under the Data category.

Browsing themes with sample controls

Silverlight Toolkit also includes 11 themes that allow us to change and improve the overall look-and-feel for our Silverlight UI. They are:

• Bubble Creme
• Bureau Black
• Bureau Blue
• Expression Dark
• Expression Light
• Rainier Purple
• Rainier Orange
• Shiny Blue
• Shiny Red
• Twilight Blue
• Whistler Blue

Click on Theme Browser under the Theming category and you will be able to select one of the themes shown in the previous list to preview the look-and-feel of many controls. The following screenshot shows the preview for the Whistler Blue theme: