使用一個新的主模板
從 圖 3 可以看出,AdminIndexAction 生成的摘要視圖與這個 WASP 應用程序的其他公共頁面擁有相同的布局和外觀。這毫不奇怪,因為所有的視圖都使用相同的主模板,這個主模板位於 $WASP_ROOT/app/templates/Master.php。然而,出於美學需要或者是為了在用戶移動到應用程序的另一個區域時向用戶提供視覺警示,客戶通常要求應用程序的管理視圖具有不同的外觀和風格。
使用Agavi,這一點不難辦到 — 只需創建一個不同的主模板,在 Agavi 中注冊,然後在視圖的setupHtml()方法中引用這個模板。
步驟 1:創建一個新的主模板
首先,在 $WASP_ROOT/app/templates/AdminMaster.php 創建一個新的主模板,然後使用清單20 中的代碼填充該模板。
清單20. AdminMaster 模板
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<base href="<?php echo $ro->getBaseHref(); ?>" />
<link rel="stylesheet" type="text/css" href="/css/default.css" />
<link rel="stylesheet" type="text/css" href="/css/admin.css" />
<title><?php if(isset($t['_title'])) echo htmlspecialchars($t['_title']) .
' - '; echo AgaviConfig::get('core.app_name'); ?></title>
</head>
<body>
<!-- begin header -->
<div id="header">
<div id="logo">
<img src="/images/logo-admin.jpg" />
</div>
<div id="menu">
</div>
</div>
<!-- end header -->
<!-- begin body -->
<div id="body">
<?php echo $inner; ?>
</div>
<!-- end body -->
<!-- begin footer -->
<div id="footer">
<p>Powered by <a href="http://www.agavi.org/">Agavi</a>.
Licensed under <a href="http://www.creativecommons.org/">Creative Commons
</a>.</p>
</div>
<!-- end footer -->
</body>
</html>
在上述相同位置使用這些附加規則(見清單21)創建一個新的CSS文件並將它存儲為 $WASP_ROOT/pub/css/admin.css。