DataGridのColumnsプロパティの設定

DataGridのColumnsプロパティの設定

DataGridコントロールの[共通]プロパティ内のColumnsの横にある[…]ボタンをクリックして、「コレクションエディター」を起動します。[Add]ボタンでDataGridTextColumnを4つ追加します。追加したDataGridTextColumnの、[共通]を展開して表示されるHeaderプロパティに、DataGridTextColumの上から順番に「氏名、年齢、住所、勤務先」と指定します。デフォルトでチェックの付いている、CanUserReorderや、CanUserResizeのチェックは外しておきます（図5）。

図6のようにDataGridコントロールにヘッダが表示されます。書き出されるXAMLには不要なプロパティが追加されますので、最終的にはBindingプロパティを指定して、リスト1のようなコードにしてください。Bindingプロパティに指定する名称は、VBコード内のクラス内で定義するプロパティ名と同じである必要があります。

リスト1: 書き出された 編集したXAMLコード（MainPage.xaml）

「コレクションエディター」内で、DataGridTextColumnのHeaderプロパティに設定した内容が書き出されています。

（1）Bindingプロパティは手動で指定しています。

（1）要素のBindingプロパティに「氏名、年齢、住所、勤務先」を指定する。

ソリューションエクスプローラー内からSL4_DataGridPrintを選択し、マウスの右クリックで表示される[メニューから、「追加（D） > 既存の項目（G）」と選択して、XML文書ファイル（リスト2）を追加します。また、XMLデータはLINQ to XMLで処理するため、「プロジェクト（P） > 参照の追加（F）」からSystem.Xml.Linqを追加しておきます。

ダウンロード・ファイルには、XML文書ファイルは追加済みです。

リスト2: 個人情報を記録したXML文書ファイル（sampleData.xml）

印刷用のテンプレートとなるUserControlを作成する

印刷用のテンプレートとなるUserControlを作成します。VS2010のメニューから「プロジェクト（P） > 新しい項目の追加（W）」と選択し、表示される画面から、「Silverlight ユーザーコントロール」を選択します。「名前（N）」はデフォルトのSilverlightControl1.xamlのままにしておきます（図7）。

Silverlight User Controlの画面をレイアウトする（SilverlightControl1.xaml）

まず、UserControlのWidthに260、Heightに160を指定します。XAMLコード内に、と要素を使って、1行1列のGridを作成します。

その中にTextBlockコントロールをレイアウトし、Textプロパティに「氏名、年齢、住所、勤務先」をバインドします。ここで指定する名称は、VBコード内のクラスで定義するプロパティ名と同じである必要があります。

レイアウトしたTextBlockの文字サイズ、太字、文字色等を指定します。最後に、これらのTextBlockコントロールをStackPanelコントロールでくくり、Marginプロパティに10を指定して、データの周囲に10ピクセルの余白を設けます。リスト3のように記述してください（図8）。

リスト3: 1行1列のGridを作成した（SilverlightControl1.xaml）