手順 2：コントロールのカスタマイズ

前の手順では、WPF/Silverlight アプリケーションを作成し、プロジェクトにC1TileView コントロールを追加しました。アプリケーションをカスタマイズするには、次の手順に従います。

ページの C1TileView タグ内に AllowDrop="True" を追加して、ユーザーがコントロール内の項目に対してドラッグアンドドロップ操作を実行できるようにします。XAML マークアップは次のようになります。

XAML	コードのコピー
<c1:C1TileView x:Name="C1TileView1" AllowDrop="True"></c1:C1TileView>

C1TileView タグ内に３つのC1TileViewItem を追加します。XAML マークアップは次のようになります。

XAML	コードのコピー
<c1:C1TileView Name="C1TileView1" AllowDrop="True"> <c1:C1TileViewItem></c1:C1TileViewItem> <c1:C1TileViewItem></c1:C1TileViewItem> <c1:C1TileViewItem></c1:C1TileViewItem> </c1:C1TileView>

各 C1TreeViewItem に Background プロパティと Header プロパティを追加します。マークアップは次のようになります。

XAML	コードのコピー
<c1:C1TileView Name="C1TileView1" AllowDrop="True"> <c1:C1TileViewItem Background="Red" Header="赤色"></c1:C1TileViewItem> <c1:C1TileViewItem Background="Blue" Header="青色"></c1:C1TileViewItem> <c1:C1TileViewItem Background="Yellow" Header="黄色"></c1:C1TileViewItem> </c1:C1TileView>

XAML

コードのコピー

<c1:C1TileView Name="C1TileView1" AllowDrop="True">
    <c1:C1TileViewItem Background="Red" Header="赤色"></c1:C1TileViewItem>
    <c1:C1TileViewItem Background="Blue" Header="青色"></c1:C1TileViewItem>
    <c1:C1TileViewItem Background="Yellow" Header="黄色"></c1:C1TileViewItem>
</c1:C1TileView>

これで、各項目が異なる色で表示され、ヘッダーにテキストが表示されます。

この手順では、C1TileView コントロールにコンテンツを追加しました。次の手順では、このコントロールで可能な実行時の操作をいくつか示します。