チュートリアル
文責：山田祥寛最終更新日：2005年06月15日
テンプレート・ファイルをカスタマイズしよう
|
 |
|
提供ツールの中には、見栄えを自分が好きなようにカスタマイズできるものがあります。たとえば、「Amazon書籍データベース検索」などが好例です。ダウンロードファイル内の「Template」フォルダに含まれている「XxxxxTemplate.ascx」というテンプレート・ファイルを書き換えることで、検索結果の表示レイアウトを容易に差し替えることができます。
ここでは、テンプレートに対応したサンプルの見栄えを変更したいという方のために、テンプレート・ファイルの記法について、カンタンに紹介します。
|
|
|
テンプレート・ファイルの種類を理解しよう
テンプレートは、多くの場合、以下の3つのテンプレート・ファイルから構成されます。
- HeaderTemplate.ascx
- ItemTemplate.ascx
- FooterTemplate.ascx
このうち、HeaderTemplate.ascx、FooterTemplate.ascxは、出力レイアウトの冒頭（ヘッダ）と末尾（フッタ）とを規定するためのテンプレートで、拡張子が「.ascx」である他は、普通のHTMLとなにも変わりありません。
ItemTemplate.ascxは、与えられたデータの数だけ繰り返し出力される「データ部のテンプレート」です。冒頭紹介した「Amazon書籍データベース検索」ツールであれば、検索結果の書籍情報を出力するために利用されます。ItemTemplate.ascxには、データの各項目を出力するための（ちょっとした）コードを埋め込むことができます。
ItemTemplate.ascxの書式を理解しよう
コード、と言っても、実に単純なものですので、恐れることはありません。ItemTemplate.ascxのコードを抜粋してみます
［ItemTemplate.ascx］
<%@ Control Language="C#" %>
<table border="0">
<tr>
<td>
<a href="http://www.amazon.co.jp/exec/obidos/ASIN/<%# DataBinder.Eval(((RepeaterItem)Container).DataItem, "Asin") %>/wings-22/" target="_blank">
<img src="<%# DataBinder.Eval(((RepeaterItem)Container).DataItem, "ImageUrlSmall") %>" border="0" /></a>
</td>
<td>
<font size="-1">
<%# DataBinder.Eval(((RepeaterItem)Container).DataItem, "ProductName") %>
<br />
<%# DataBinder.Eval(((RepeaterItem)Container).DataItem, "Author") %>
</font>
</td>
</table>
<p />
ItemTemplate.ascxで、ポイントとなるのは以下の2点です。
- @Controlディレクティヴ（命令）を記述する
先頭に、@Control命令を記述してください。ここは、おまじないのようなものだと思っておいていただければよいでしょう。提供ツールをカスタマイズする限りは、常に固定値となります。
<%@ Control Language="C#" %>
- データ項目を出力する
テンプレート内でデータ項目を出力するには、以下の構文で記述してください。
<%# DataBinder.Eval(((RepeaterItem)Container).DataItem, "項目名") %>
上の式をコピー＆ペーストして、項目名の部分だけを必要な名前に変更すればOKです。
テンプレートで利用可能な項目については、個々のツール紹介ページで紹介しています。合わせてこちらを参照してください。
