ビューとテンプレートは、「4. アクション」が主にプログラム的な処理を担当したのに対し、 クライアントへの表示を担当する部分です。アクションの処理結果を受け取り、適切な表示形式に整形して出力するところを担います。
特にWEBアプリケーションフレームワークの場合、使用するビュー(タイプ)により、処理されるテンプレート形式が決まります。
アクションは(ファイルの存在が)任意でしたが、ビュー/テンプレートは存在しなければなりません。 ビューに関してはフレームワークに組み込まれている既存のビューを使用することにより、意識する(作成する)ことはありませんが、 テンプレートは必ず作成することになります。
<テンプレートが必要ない状況>
・アクション内で終了する場合やリダイレクトする場合
・nullビュー使用時
・WEBアプリケーションフレームワーク以外のフレームワーク
ここでは、ビューの設定とテンプレートの作成方法について説明します。
まず、ビューが起動されるまでの流れを示します。
例えば「/example.php/example1/index.html」のようなURLにアクセスした場合、 下記のようなアクション/テンプレートがデフォルトで呼び出されます。
[ URL ]
/example.php/example1/index.html
・アクションファイル
(アクションディレクトリ)/Example1/Index.php
・アクションクラス名
Example1_Index
・テンプレートファイル
(テンプレートディレクトリ)/Example1/Index.html
ビュー処理は、フレームワークに実装されているビューを呼び出す形になります。 どのようなビューを呼び出すかは、routers.xml に設定されているビュータイプによって決まります。
下記例では、全ての処理に smarty ビューを使用する設定です。
…
<router path="/(.+).php"
viewType="smarty" />
…
アクション内で動的にビュータイプを切り替えることもできます。
function execute(&$data, &$context) { ... $context->setViewType('smarty'); ... }
routers.xml にビュータイプが設定されていない場合、 デフォルトで default ビュータイプ(PHPスクリプトをテンプレートに使用するタイプ)が使用されます。
また、使用されるテンプレートファイルをデフォルトから変更するには、routers.xml を使用します。
下記例では、/Abc.html にアクセスされたリクエストを
/Index.php アクションと /Index.html テンプレートにそれぞれ処理をフォワードする設定です。
…
<router path="/Abc.php"
forwardAction="/Index.php"
forwardTemplate="/Index.html" />
…
アクション内で動的にテンプレートファイルを切り替えることもできます。
function execute(&$data, &$context) { ... $context->setTemplateFile('example2/session1.html'); ... }
ビュータイプ(viewType)は数種類存在し、使用できるビュータイプはフレームワークにより異なります。
SyL WEBアプリケーションフレームワーク関連
SyL WEBアプリケーションフレームワークでは、大きく分けてテンプレートが必要なタイプと、必要でないタイプに分かれます。
ビュータイプ | テンプレート | 内容 |
---|---|---|
default | ○ | テンプレートにPHPコードを記述する場合に使用します。デフォルトビュータイプです。 |
smarty | ○ | テンプレートにSmartyコードを使用する場合に設定します。 |
download | × | ファイルをダウンロードする場合に使用します。 |
image | × | 画像を表示する場合に使用します。 主に<img>タグで指定した画像をフレームワークから出力する場合に使用します。 |
xml | × | 汎用XMLを表示する場合に設定します。 アクション側で、SyL_XmlWriterオブジェクトを作成し、ビュー側に渡す必要があります。 |
rss | × | RSSを表示する場合に設定します。 アクション側で、SyL_XmlRssWriterオブジェクトを作成し、ビュー側に渡す必要があります。 |
またレイアウト機能を使用できるビュータイプは下記の2つです。
※レイアウトの説明はこちらを参照
ビュータイプ | テンプレート | 内容 |
---|---|---|
layout.default | ○ | テンプレートにPHPコードを記述して、レイアウト機能を使用します。 |
layout.smarty | ○ | テンプレートにSmartyコードを使用して、レイアウト機能を使用します。 |
SyL JavaScript出力フレームワーク関連
SyL JavaScript出力フレームワークでは、アクション処理後、テンプレートを使用せず、
アクション処理結果を自動的に特定の形式に変換し、JavaScriptタグやJSON形式でクライアントに出力します。
<script type="text/javascript" src="..."></script>
ただし、アクション処理を必要としないタイプもあります。
ビュータイプ | 内容 |
---|---|
js.default | JavaScriptコードをクライアントに出力します。 アクションで出力する内容をセットすることもできますが、外部からの「import」パラメータにより読み込むJavaScriptライブラリを決めることもできます。 デフォルトビュータイプです。 |
js.login | 認証をJavaScriptと連動して行うためのライブラリをクライアントに出力します。 出力する内容が決まっているので、アクション処理があったとしても意味を持ちません。 |
json | SyL JavaScript出力フレームワークからJavaScriptに結果を受け渡す場合に使用します。 アクションの処理結果が、JavaScriptのオブジェクトを生成するコードに変換され、クライアントに送信されます。 |
jsonp | SyL JavaScript出力フレームワークからJavaScriptに結果を受け渡す場合に使用します。 アクションの処理結果が、JavaScriptのオブジェクトを生成するコードに変換され、コールバック関数の引数となったコードがクライアントに送信されます。 |
SyL XMLRPCフレームワーク関連
SyL XMLRPCフレームワークでは、xmlrpc ビュータイプの1種類のみです。 テンプレートファイル作成の必要はありません。
ビュータイプ | 内容 |
---|---|
xmlrpc | XMLRPCレスポンスを作成する場合に設定します。 アクション側で、SyL_XmlRpcBuilderServerオブジェクトを作成し、ビュー側に渡す必要があります。 |
SyL コマンドラインフレームワーク関連
ビュー自体必要ありません。(詳細には、後述の null ビュータイプが使用されます)
SyL フレームワーク全般
ビュータイプ | 内容 |
---|---|
null | ビュー(テンプレート)側で何も処理をしないタイプです。 |
レイアウトは、HTMLをいくつかの単位に分割し、各ページで共通で表示する部分と個別に表示する部分に分け管理する機能です。
例えば、WEBサイト中のヘッダやフッタは、どのページでも同じ表示をさせる場合が多々あります。 このような場合、レイアウト機能を使用し、共通表示部分(ヘッダ、フッタ)と個別表示部分と分けて管理すれば、 共通表示部分(ヘッダ、フッタ)に後々修正が入ったとしても、1ファイル修正すれば済むことになり、メンテナンス性が向上します。
レイアウトを使用する場合は、まず画面上のどの部分を分割するかを決定します。 次に分割した部分をインクルードする基本となるHTML(基本レイアウトファイル)を作成します。
下記例は、Smartyレイアウトを使用した場合で、ヘッダやフッタ、個別表示部分をinclude句で指定し、 その引数に仮の変数名を記述しておきます。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>レイアウトテストページ</title> </head> <body> <div id="container"> <div id="header"> {include file=$_HEADER_} </div> <div id="contents"> {include file=$_CONTENTS_} </div> <div id="footer"> {include file=$_FOOTER_} </div> </div> </body> </html>
次にレイアウト設定ファイル(layouts.xml)を編集します。
基本レイアウトファイルのパスをlayout要素のfile属性に記述し、 基本レイアウトファイル内に指定した変数とその変数に対する読み込むファイルを、template要素(共通部分)/view要素(個別部分)に設定します。
… <layout name="default" file="common/default.html" enable="true"> <template name="_HEADER_" file="common/header.html" /> <view name="_CONTENTS_" /> <template name="_FOOTER_" file="common/footer.html" /> </layout> …
最後にアクション設定ファイルを有効にすれば、レイアウトが使用できるようになります。
routers.xml のlayoutName要素に前述のlayoutで指定した名前を指定し、viewType要素をレイアウトを使用可能なビュータイプに設定します。
… <router path="/Abc.php" forwardAction="/Index.php" forwardTemplate="/Index.html" viewType="layout.smarty" layoutName="default" /> …
テンプレートを通常のPHPファイルとして使用する場合に指定します。
アクションから受け取ったパラメータは、<?php echo ... ?>や<?= ... ?> で出力します。
Smartyテンプレートを使用します。
アクションから受け取ったパラメータは、{$hoge} で出力します。
※事前にSmartyをインストールし、関連する定数(config.xml内)を適切に設定してておく必要があります。
クライアントにファイルをダウンロードさせたい場合に使用します。
ダウンロード前にプログラム(アクション処理)を挟むことにより、特定の条件の場合のみダウンロードさせるようなことが可能です。
アクション側で、$contextオブジェクトにダウンロードしたいファイル(または変数データ)を設定すると、自動的にダウンロードビューに切り替わります。
※テンプレートは必要ありません。
例)ダウンロードファイルコード … function execute(&$data, &$context) { // ダウンロードしたいファイルのパス $file = '/path/to/download.file'; // ダウンロードファイルをビューにセット $context->setDownloadFile($file); } …
クライアントに表示される画像をプログラムから出力する場合に使用します。
画像表示前にプログラム(アクション処理)を挟むことにより、特定の条件の場合のみ画像を表示させるようなことが可能です。
アクション側で、$contextオブジェクトに表示したいファイルを設定すると、自動的に画像ビューに切り替わります。
※テンプレートは必要ありません。
例)画像ファイル表示コード … function execute(&$data, &$context) { // 画像ファイルのパス $file = '/path/to/download.file'; // 画像ファイルをビューにセット $context->setDisplayImageFile($file); } …
汎用XMLを表示したい場合に使用します。
アクション側のパラメータ(プロパティ)で、事前にSyL_XmlWriterオブジェクトを生成し、コンテキスト情報にセットしておきます。
※テンプレートは必要ありません。
例)XML表示コード … function execute(&$data, &$context) { // XML書き込みクラスをロード SyL_Loader::lib('Xml.Writer'); // XML書き込みオブジェクト取得 $xml =& new SyL_XmlWriter(); $xml->addDeclaration(); $xml->addStartElement('aaa'); $xml->addStartElement('bbb'); $xml->addElement("ccc", array('attr'=> 'test'), 'texttext'); ... $xml->addEndElement(); $xml->addEndElement(); // XML書き込みオブジェクトをコンテキストにセット $context->setDisplayXml($xml); } …
RSSを配信したい場合に使用します。
アクション側のパラメータ(プロパティ)で、事前にSyL_XmlRssWriterオブジェクトを生成し、配信情報をコンテキストにセットしておきます。
※テンプレートは必要ありません。
例)RSS表示コード … function execute(&$data, &$context) { // RSS書き込みオブジェクト SyL_Loader::lib('Xml.Rss.Writer'); // RSS書き込みオブジェクト取得(RSS ver.2.0) $rss =& SyL_XmlRssWriter::getInstance('2.0'); $rss->setChannel('title', '...'); $rss->setChannel('link', '...'); ... // RSS書き込みオブジェクトをコンテキストにセット $context->setDisplayRss($rss); } …