ZendFrameworkでレイアウト機能を使う

1つのビューファイルの中に、ヘッダー、フッター、コンテンツ、を全て記入して作成してもいいのですが、全て別ファイルとして管理したほうが、後々のメンテナンスは楽になります。このように『複数のファイルを組み合わせてページを作る』ためのZendFrameworkのレイアウト機能である『Zend_Layout』について調べてみたいと思います。

1) 『views』フォルダの中に、新たに『layouts』というフォルダを作成します。そのファイルの中に『layout.phtml』、『header.phtml』、『footer.phtml』ファイルを作成します。

2) 『layout.phtml』ファイルを下記のように記述します。

<!DOCTYPE html>
<head>
 <meta charset="utf-8">
 <?php echo $this->headTitle()?>
 <meta name="description" content="<?php echo $this->description?>">
 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 <link rel="stylesheet" href="/css/style.css">
</head>
<body>
<div class="container">
<?=$this->render($this->content_header)?>
<?=$this->layout()->content?>
<?=$this->render($this->content_footer)?>
</div><!-- /container -->
</body>
</html>

3) 『header.phtml』ファイルを下記のように記述します。

<div class="header">
 <h1><?php echo $this->sitename?></h1>
 <h4><?php echo $this->description;?></h4>
</div>

4) 『footer.phtml』ファイルを下記のように記述します。

<div class="footer">
<p><?=$this->content_footer_text?></p>
</div>

5) 『controllers』フォルダにTestController.phpを作成し、下記のように記述します。

<?php
require_once 'Zend/Controller/Action.php';
require_once 'Zend/View.php';
require_once 'Zend/Layout.php';
class TestController extends Zend_Controller_Action{
 //初期化
 public function init(){
 define('APP_DIR', dirname(dirname(__FILE__)));
 define('LAYOUT_DIR', APP_DIR.'/views/layouts');
 //ヘッドタイトル情報をセットする
 $this->view->headTitle('Winrado徒然草');
 //連想配列による情報のセット
 $this->view->assign('sitename','WinRoad徒然草');
 $this->view->assign('description','Zend_Layoutの為のテストサイトです。');
 $this->view->assign('content_header','header.phtml');
 $this->view->assign('content_footer','footer.phtml');
 $this->view->assign('content_footer_text','copyright Winroad徒然草2011.');
 //Zend_layoutのためのオプションの指定
 $options=array(
 'layout'=>'layout',
 'layoutPath'=>LAYOUT_DIR,
 'content'=>'content');
 //Zend_layoutメソッドの開始
 $layout=Zend_Layout::startMvc($options);
 }
 public function indexAction()
 {
}
}

6) 『views/scripts』フォルダ内に『test』フォルダを作成し、その中にindex.phtmlファイルを作成します。中には下記のように記述します。

<div class="content">
<p>Zend_Layoutのサンプルコンテンツです</p>
</div>

7) 『zendapp』フォルダ内に『css』フォルダを作成し、下記のように記述します。

@charset "utf-8";
body{
 background:#DDDDDD;
 color:#666633;
 margin:0;
}
.header{
 background:#FFFFFF;
 font-size:14px;
 font-weight:bold;
 padding:10px;
}
.content{
 background:#ffeeee;
 color:#990000;
 padding:10px 20px 40px 20px;
}
.footer{
 background:#DDDDDD;
 text-align:right;
 font-size:9px;
}

8) ブラウザで確認してみます。『zend.winroad.info/test』と入力します。Zend_Layoutで指定されたレイアウト通りに作成されました。

Zend_Layoutのフォルダ構成

9) Zend_Layoutのフォルダ構成は、なるべくフォルダ構成は統一した方が、後々の管理が楽になりますので、基本的なフォルダ構成を考えてみたいと思います。

10) 今回、Viewsフォルダ内に新たにlayoutsというフォルダを作成し、これをレイアウト関係のスクリプトフォルダの保存場所としました。

11) 今回はアプリケーションフォルダ内に作成しましたが、基本的には、スタイルシート用フォルダは、別のアプリケーションでも使用することを考えて、ルートフォルダに作成する方がいいと思います。

Zend_Layoutの基本

12) Zend_Layoutを使うために、コントローラの設定を調べてみます。

  • require_once ‘Zend/Layout.php’;
    Zend_Layoutは’Zend_Layout.php’というファイルの中に用意されています。まず、このファイルを使用するために、require_onceでロードしておきます。
  • public function init()
    コントローラのメソッド内に、『init』というメソッドが作成されています。これは、クラスが呼び出された際、最初に実行されるメソッドです。一般に、クラスの初期化は、コンストラクタである__constructで行われることが多いのですが、コントローラの場合、このinitに用意するのが基本と言えます。
  • $options=array(…….);
    まず、レイアウトのための設定を、配列として用意します。
    array(
    ‘layout’=>レイアウト名;
    ‘layoutPath’=>レイアウトのパス;
    ‘content’=>コンテンツのキー);
  • Zend_Layout::startMVC(設定情報);
    実際に作成した設定データを元に、レイアウトを開始するためには、Zend_Layout内にあるメソッドを呼び出します。

本日は以上です。

このエントリーを含むはてなブックマーク Buzzurlにブックマーク livedoorクリップ Yahoo!ブックマークに登録

トラックバック&コメント

この投稿のトラックバックURL:

コメントをどうぞ

このページの先頭へ