手順 1：ユーザーインターフェイスの作成

この手順では、最初に Visual Studio で Silverlight グリッドアプリケーションを作成します。引き続き、アプリケーションのユーザーインターフェイス（UI）を作成してカスタマイズし、プロジェクトに C1DataGrid コントロールを追加します。

プロジェクトを設定するには、次の手順に従います。

Visual Studio で、［ファイル］→［新しいプロジェクト］を選択します。
［新しいプロジェクト］ダイアログボックスの左ペインから言語を選択し、テンプレートリストから［Silverlight アプリケーション］を選択します。プロジェクトの［名前］「StealthPaging」を入力し、［OK］をクリックします。［新しい Silverlight アプリケーション］ダイアログボックスが表示されます。
［OK］をクリックしてデフォルト設定を受け入れ、［新しい Silverlight アプリケーション］ダイアログボックスを閉じると、プロジェクトが作成されます。
ソリューションエクスプローラに移動して StealthPaging プロジェクトを右クリックし、コンテキストメニューから［参照の追加］を選択します。
［参照の追加］ダイアログボックスで、System.Runtime.Serialization アセンブリを見つけ、［OK］ボタンをクリックして参照をプロジェクトに追加します。ダイアログボックスが閉じ、参照が追加されます。
MainPage.xaml ファイルが開いていない場合は、ソリューションエクスプローラに移動し、MainPage.xaml 項目をダブルクリックします。

XAML ビューで、カーソルを<Grid x:Name="LayoutRoot" Background="White">タグの直後に置き、次のマークアップを追加します。

XAML	コードのコピー
<!-- グリッドレイアウト--> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="Auto" /> </Grid.RowDefinitions>

この行定義は、アプリケーションのレイアウトを定義します。

プロジェクトの XAML ウィンドウで、カーソルを</Grid>タグの真上に置き１回クリックします。

ツールボックスに移動し、［C1DataGrid］アイコンをダブルクリックして、MainPage.xaml にグリッドコントロールを追加します。XAML マークアップは次のようになります。

XAML	コードのコピー
<UserControl x:Class="StealthPaging.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" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml"> <Grid x:Name="LayoutRoot" Background="White"> <!-- グリッドレイアウト--> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <c1:C1DataGrid /> </Grid> </UserControl>

XAML

コードのコピー

<UserControl x:Class="StealthPaging.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"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml">
    <Grid x:Name="LayoutRoot" Background="White">
        <!-- グリッドレイアウト-->
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <c1:C1DataGrid />
    </Grid>
</UserControl>

C1.Silverlight.DataGrid 名前空間とタグがプロジェクトに追加されていることがわかります。

<c1:C1DataGrid>タグに既存のコンテンツが含まれている場合は、そのコンテンツを削除します。次のようになります。

XAML	コードのコピー
<c1:C1DataGrid />

x:Name="peopleDataGrid" を<c1:C1DataGrid>タグに追加して、グリッドに名前を付けます。次のようになります。

XAML	コードのコピー
<c1:C1DataGrid x:Name="peopleDataGrid" />

コントロールに一意の識別子を付けると、コードでその C1DataGrid コントロールにアクセスできるようになります。

AutoGenerateColumns="True" CanUserAddRows="False" を<c1:C1DataGrid>タグに追加して、グリッドをカスタマイズします。次のようになります。

XAML	コードのコピー
<c1:C1DataGrid x:Name="peopleDataGrid" AutoGenerateColumns="True" CanUserAddRows="False" />

このマークアップは、列を自動的に生成するようにグリッドを設定し、新しい行の追加を無効にします。

</c1:C1DataGrid>タグの直後に次のマークアップを追加します。

XAML	コードのコピー
<TextBlock x:Name="txtStatus" Grid.Row="1" Text="準備完了" Margin="0,5,0,0" />

この TextBlock は、ステータス情報テキストを表示するために使用されます。

ここまでの成果

アプリケーションを実行すると、ページにグリッドとテキスト（グリッドの下）が含まれていることがわかります。これで、基本的なグリッドアプリケーションを作成できました。ただし、グリッドは空白でデータが入っていません。この後の手順では、グリッドをデータソースに連結し、コードにステルスページングを追加します。