頁面布局
在這個單元中我們將看到如何使用模板標簽系統構造一個標准的模板頁面。這個例子我們使用了一個簡單的HTML頁面布局，請看下圖：
這個頁面有多個標准單元組成,就像頁面設計者和開發者熟悉的那樣.這個頁面的主體由3個包含的單元組成:頁眉,頁內容主體和頁腳.我們現在就看看這些單元並且了解如何使用模板標簽系統來實現.
頁主體
下面的代碼單元顯示的是主體:
The Page Body Layout
1
<@ saleMonth = data.getValueBean('SALE_MONTH') @>
<@ saleTitle = data.getValueBean('SALE_TITLE') @>
<@ dealHeading = data.getValueBean('DEAL_HEADING') @>
<@ salesAreaID = "Central District" @>
<html>
<head>
<link rel='stylesheet' type='text/CSS' href="./style/pageStyles.css"/>
<title>
2 <@ =viewConfig.getAppTitle @>
</title>
</head>
<body>
<table class='pageLayoutTable'>
<!-- PAGE HEADER -->
<tr>
<td class='pageHeader'>
<!-- including the page header component -->
<!-- The base template base directory is "./tpl" -->
3 <@ include 'pageHeader.ssp' @>
</td>
</tr>
<!-- PAGE CONTENTS -->
<tr valign='top'>
<td class='pageContent'>
<!-- including the page contents component -->
4 <@ include 'sale/pageContent.ssp' @>
</td>
</tr>
<!-- PAGE FOOTER -->
<tr>
<td class='pageFooter'>
<!-- including the page footer omponent -->
5 <@ include 'pageFooter.ssp' @>
</td>
</tr>
</table>
</body>
</html>
1:頁聲明
第一個有趣的條目是頁頂部的頁聲明(1).我們在頁面開始聲明了這些變量,因此這些變量將能在下面的頁面和像頁眉那樣的包含頁所使用.
2:頁標題
下一步我們使用表達式來初始化頁面標題(2).這個值能夠從配置文件中view-resources元素利用ViewResourcesConfig->getAppTitle來得到:
<view-resources
appTitle = "Flash Jacks' Sleek Tab Site"
...
</view-resources>
3:頁眉
頁眉是下一個有趣的條目(3).在這裡我們使用包含指令來插入頁眉模板文件到頁主體中.我們將在下一個子單元中來看一看頁眉.
我們僅僅使用了頁面直接去讀取頁眉,不論頁的組件存儲在哪裡.這是一個好機會來介紹模板標簽系統的目錄設置.默認情況下,模板目錄布局如下所示(注意這些路徑相對於我們的應用程序):
The Default PhpMVC_Tags Template Directory Layout Paths (relative)
The Template Files './WEB-INF/tpl'
The Compiled Template Files './WEB-INF/tpl_C'
如果需要的話我們可以在配置文件的view-resources結點來重新定義他們,就像這樣:
<view-resources
...
tplDir = "./WEB-INF/tpl-admin"
tplDirC = "./WEB-INF/tpl_admin_C"
...
</view-resources>
4:頁內容主體
這是另外一個包含指令被用來插入模板文件(4)到主體中.注意包含的文件位於模板目錄的sales子目錄中:
"./WEB-INF/tpl/sale/pageContent.ssp"
5:頁腳
又是一個包含指令,就像頁眉一樣.
頁眉單元
在這個例子中頁眉模板文件('pageHeader.ssp')只是一個簡單的單元,就像這樣:
<!-- Page Header -->
<span>
<@ =viewConfig.getAppTitle @>
</span>
當主體頁面(包括包含的頁面)被編譯的時候,頁眉的表達式被轉換成下面這樣:
<!-- Page Header -->
<span>
<?php print $viewConfig->getAppTitle(); ?>
</span>
被編譯的頁面被存儲在編譯模板目錄中,就像上面所說的,默認的編譯模板目錄是:
'./WEB-INF/tpl_C'
頁內容主體單元
頁內容主體模板文件有一點復雜.文件('sale/pageContent.ssp')內容顯示如下:
...
1
<@ item1=data->getValueBean("ITEM_1") @>
<@ products=data->getValueBean("PRODUCTS_ARRAY") @>
2
<h4><@=dealHeading @> <@=saleMonth @></h4>
3
<b>Clearance deals</b>
<table class='productsTable'>
<tr>
<td class='prodItemDesc'>
<@ =item1.getName @>
</td>
<td class='prodItemValue'>
<@ =item1.getCost @>
</td>
</tr>
</table>
4
<b>Todays specials</b>
<table class='productsTable'>
<?php foreach($products as $item) { ?>
<tr>
<td class='prodItemDesc'>
<@ =item.getName @>
</td>
<td class='prodItemValue'>
<@ =item.getCost @>
</td>
</tr>
<?php } ?>
</table>
<b>Our Staff at Your Service</b>
...
5
<table class='productsTable'>
<tr>
<td class='prodItemDesc'>
<b>Area Manager: </b>
</td>
<td class='prodItemDesc'>
<@ =viewConfig.getAreaManager @>
</td>
</tr>
...
</table>
1:一些更多的聲明
在頁面頂部所顯示的額外聲明(1)能讓我們聲明頁變量以便下面能夠使用.在內容被處理之後,這些聲明將在編譯後像下面這樣顯示:
<?php $item1=$data->getValueBean("ITEM_1"); ?>
...
<?php $products=$data->getValueBean("PRODUCTS_ARRAY"); ?>
2:使用表達式來顯示內容單元標題
現在我們使用兩個表達式(2)來顯示內容單元的標題.注意我們聲明這些變量是"全局"變量在主頁面的頂部.處理完後,表達式將轉換這些代碼,就像這樣:
<?php print $dealHeading; ?> <?php print $saleMonth; ?>
當頁面被顯示到用戶的浏覽器中,內容單元的標題看起來就像這樣:
Jack's Super Deals for : May 2010.
3:使用表達式來顯示一些數據條目
現在我們能顯示一些實際的數據(3).在這個頁內容主體單元中我們訪問一些在PhpMVCTabAction類的ActionObject中的產品條目數據.一個簡化版的PhpMVCTabAction類在下面展示:
class PhpMVCTabAction extends Action {
...
function execute($mapping, $form, &$request, &$response) {
// Our value bean container
$valueBeans =& new ValueBeans();
// Define some strings we need on our View template page
// These could be defined globally in the phpmvc-config.xml file.
// See: ExtendedController example.
$appTitle = "Flash Jack's Include Page";
$saleMonth = "May 2010";
$saleTitle = "Flash Jack's Super Sale";
$dealHeading = "Jack's Super Deals for :";
...
// Save the string variables to our Value object
$valueBeans->addValueBean('APP_TITLE' , $appTitle);
$valueBeans->addValueBean('SALE_MONTH' , $saleMonth);
$valueBeans->addValueBean('SALE_TITLE' , $saleTitle);
$valueBeans->addValueBean('DEAL_HEADING' , $dealHeading);
...
// Some float values we could receive from a database query
// Note: The prices are formatted in the Products class constructor.
// Eg: "$ n,nnn.nn"
$price1 = 125.00;
...
// Setup some clearance deals (individual object instances):
// Note: The Product class file was included in our local prepend.php file
$item1 = new Product('Super Duper', $price1);
...
$valueBeans->addValueBean('ITEM_1', $item1);
...
// Todays specials (array of object instances)
$products = array();
$products[] = new Product('Gooses Bridle', $price3);
...
$valueBeans->addValueBean('PRODUCTS_ARRAY', $products);
// Our staff
$staff1 =& new Staff('Bruce', 'Sales', 'Karate');
...
$valueBeans->addValueBean('STAFF_1', $staff1);
...
// Save the Value object
$this->saveValueObject($request, $valueBeans);
在上面的代碼中,我們能看到$item1被創建並被保存成ActionObject的valueBeans條目.Bean數據條目現在能在模板頁面中被重新獲得:
<@ item1=data->getValueBean("ITEM_1") @>
我們可以像下面那樣顯示條目的值:
<@ =item1.getName @>
...
<@ =item1.getCost @>
4:顯示數組
我們也可以直接使用一些PHP代碼在我們的模板頁上.在這個分離的MVC模式中,我們應該僅在這裡編寫代碼去操縱這些通過ActionObject和ViewResourcesConfig實例(可能我們的自定義Bean也可以)提供的數據.在上面的也內容單元('sale/pageContent.ssp')中,我們使用一個PHP的foreach語法(4)來循環讀取$products數組.我們能在上面的PhpMVCTabAction類中看到$products數組被創建並被保存在ActionObject中,就和上面的$item1 Bean相似.在foreach循環中我們能使用表達式來顯示產品數據:
<?php foreach($products as $item) { ?>
<tr>
<td class='prodItemDesc'>
<@ =item.getName @>
</td>
<td class='prodItemValue'>
<@ =item.getCost @>
</td>
</tr>
<?php } ?>
5:顯示ViewResourcesConfig屬性
最後我們從view-resources元素所定義的ViewResourcesConfig屬性來顯示"Area Manager"(5)在我們的內容頁:
<view-resources
appTitle = "Flash Jacks' Sleek Tab Site"
...
className = "MyViewResourcesConfig">
<!-- We can set some properties on our custom ViewResourcesConfig class -->
<set-property property="areaManager" value="Joe J. Blogs Esq."/>
</view-resources>
但是注意在這個例子中我們使用了一個繼承ViewResourcesConfig類的對象(MyViewResourcesConfig)來設置一些自定義的屬性.我們定義了一個擴展ViewResourcesConfig類的對象,在配置文件裡使用className="MyViewResourcesConfig"屬性,並且MyViewResourcesConfig類定義在文件"MyViewResourcesConfig.php"中.MyViewResourcesConfig類(classes/MyViewResourcesConfig.php)實現了setter/getter方法去處理自定義屬性("areaManager"),這個屬性我們在view-resources結點中定義:
class MyViewResourcesConfig extends ViewResourcesConfig {
// ----- Properties ----------------------------------------------------- //
var $areaManager = '';
function getAreaManager() {
return $this->areaManager;
}
function setAreaManager($areaManager) {
$this->areaManager = $areaManager;
}
我們現在能使用表達式在我們的頁面上實現"Area Manager"了:
<@ =viewConfig.getAreaManager @>
注意:在真實的應用程序中數據能從關系型數據庫中得到.
頁腳單元
頁腳單元和上面討論過的頁眉單元的處理相類似.頁腳模板文件('tpl/pageFooter.ssp')就像這樣:
<!-- Page Footer -->
<span>
<@ =viewConfig.getCopyright @>
</span>
當主體頁面(包括包含的頁面)被編譯,在頁腳中的表達式被轉換成下面這樣:
<!-- Page Footer -->
<span>
<?php print $viewConfig->getCopyright(); ?>
</span>
編譯的頁眉頁面被存儲在編譯模板目錄.默認的編譯模板目錄是:
'./WEB-INF/tpl_C'
