Step 1 of 4: Creating a Silverlight Application

In this step you'll begin in Visual Studio to create a Silverlight grid application using ComponentOne DataGrid for Silverlight. You'll create a new Silverlight project and add the C1DataGrid control to your application.

To set up your project and add a C1DataGrid control to your application, complete the following steps:

1.   In Visual Studio, select File | New | Project.

2.   In the New Project dialog box, select a language in the left pane, and in the templates list select Silverlight Application. Enter a Name for your project and click OK. The New Silverlight Application dialog box will appear.

3.   Click OK to accept default settings, close the New Silverlight Application dialog box, and create your project. The MainPage.xaml file should open.

4.   In the Solution Explorer, right-click the project name and choose Add Reference. In the Add Reference dialog box, locate and select the C1.Silverlight.DataGrid assembly and click OK to add reference to your project.

5.   Add the XAML namespace to the UserControl tag with the following markup: xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml".

The namespaces will now appear similar to the following:

<UserControl x:Class="C1DataGrid.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400">

This is a unified namespace that will enable you to work with most ComponentOne WPF or Silverlight controls without adding multiple namespaces.

6.   Add the <c1:C1DataGrid x:Name="c1dg"></c1grid:C1DataGrid> tag within the Grid tags on the page to add the C1DataGrid control to the application.

The XAML will appear similar to the following:

<Grid x:Name="LayoutRoot" Background="White">

    <c1:C1DataGrid x:Name="c1dg"></c1grid:C1DataGrid>

</Grid>

This will add a C1DataGrid control named "c1dg" to the application. By giving the control a unique identifier, you'll be able to access the C1DataGrid control in code.

 What You've Accomplished

You've successfully created a basic grid application. In the next step you'll add a XML data source to your project and bind the grid to a data source.