- Zend Framework 教程
- Zend Framework - 首页
- Zend Framework - 简介
- Zend Framework - 安装
- 框架应用程序
- Zend Framework - MVC 架构
- Zend Framework - 概念
- Zend Framework - 服务管理器
- Zend Framework - 事件管理器
- Zend Framework - 模块系统
- 应用程序结构
- Zend Framework - 创建模块
- Zend Framework - 控制器
- Zend Framework - 路由
- Zend Framework - 视图层
- Zend Framework - 布局
- 模型与数据库
- 不同的数据库
- 表单与验证
- Zend Framework - 文件上传
- Zend Framework - Ajax
- Cookie 管理
- 会话管理
- Zend Framework - 身份验证
- 邮件管理
- Zend Framework - 单元测试
- Zend Framework - 错误处理
- Zend Framework - 实例
- Zend Framework 有用资源
- Zend Framework - 快速指南
- Zend Framework - 有用资源
- Zend Framework - 讨论
Zend Framework - 布局
布局代表多个视图的公共部分,例如页眉和页脚。默认情况下,布局应存储在view/layout文件夹中。
布局配置在模块的module.config.php文件中的view_manager部分定义。
框架应用程序的默认配置如下:
'view_manager' => array( 'display_not_found_reason' => true, 'display_exceptions' => true, 'doctype' => 'HTML5', 'not_found_template' => 'error/404', 'exception_template' => 'error/index', 'template_map' => array( 'layout/layout' => __DIR__ . '/../view/layout/layout.phtml', 'application/index/index' => __DIR__ . '/../view/application/index/index.phtml', 'error/404' => __DIR__ . '/../view/error/404.phtml', 'error/index' => __DIR__ . '/../view/error/index.phtml', ), 'template_path_stack' => array( __DIR__ . '/../view', ),
这里,template_map用于指定布局。如果找不到布局,则会返回错误。让我们看一下框架应用程序的主要布局。
Layout.phtml
<?= $this->doctype() ?> <html lang = "en"> <head> <meta charset = "utf-8"> <?= $this->headTitle('ZF Skeleton Application')->setSeparator(' - ')> setAutoEscape(false) ?> <?= $this->headMeta() ->appendName('viewport', 'width = device-width, initial-scale = 1.0') ->appendHttpEquiv('X-UA-Compatible', 'IE = edge') ?> <!-- Le styles --> <?= $this->headLink(['rel' => 'shortcut icon', 'type' => 'image/vnd.microsoft.icon', 'href' => $this->basePath() . '/img/favicon.ico']) ->prependStylesheet($this->basePath('css/style.css')) ->prependStylesheet($this->basePath('css/bootstraptheme.min.css')) ->prependStylesheet($this->basePath('css/bootstrap.min.css')) ?> <!-- Scripts --> <?= $this->headScript() ->prependFile($this->basePath('js/bootstrap.min.js')) ->prependFile($this->basePath('js/jquery-3.1.0.min.js')) ?> </head> <body> <nav class = "navbar navbar-inverse navbar-fixed-top" role = "navigation"> <div class = "container"> <div class = "navbar-header"> <button type = "button" class = "navbar-toggle" data- toggle = "collapse" data-target = ".navbar-collapse"> <span class = "icon-bar"></span> <span class = "icon-bar"></span> <span class = "icon-bar"></span> </button> <a class = "navbar-brand" href = "<?= $this->url('home') ?>"> <img src = "<?= $this->basePath('img/zf-logo-mark.svg') ?> " height = "28" alt = "Zend Framework <?= \Application\Module:: VERSION ?>"/> Skeleton Application </a> </div> <div class = "collapse navbar-collapse"> <ul class = "nav navbar-nav"> <li class = "active"><a href = "<?= $this->url('home') ?>">Home</a></li> </ul> </div> </div> </nav> <div class = "container"> <?= $this->content ?> <hr> <footer> <p>© 2005 - <?= date('Y') ?> by Zend Technologies Ltd. All rights reserved.</p> </footer> </div> <?= $this->inlineScript() ?> </body> </html>
正如你分析布局一样,它主要使用了我们在上一章讨论过的视图助手。仔细观察,布局使用了一个特殊的变量$this->content。这个变量很重要,因为它将被实际请求页面的视图脚本(模板)替换。
创建新的布局
让我们为我们的教程模块创建一个新的布局。
首先,让我们在“public/css”目录下创建一个tutorial.css文件。
body { background-color: lightblue; } h1 { color: white; text-align: center; }
在/myapp/module/Tutorial/view/layout/目录下创建一个新的布局文件newlayout.phtml,并复制现有布局的内容。然后,使用HeadLink助手类在布局头部部分添加tutorial.css样式表。
<?php echo $this->headLink()->appendStylesheet('/css/tutorial.css');?>
使用URL助手在导航部分添加一个新的about链接。
<li><a href = "<?= $this->url('tutorial', ['action' => 'about']) ?>">About</a></li>
此布局页面是教程模块应用程序的公共页面。更新教程模块配置文件中的view_manager部分。
'view_manager' => array( 'template_map' => array( 'layout/layout' => __DIR__ . '/../view/layout/newlayout.phtml'), 'template_path_stack' => array('tutorial' => __DIR__ . '/../view',), )
在TutorialController中添加aboutAction函数。
public function aboutAction() { }
在myapp/module/Tutorial/view/tutorial/tutorial/目录下添加about.phtml文件,内容如下。
<h2>About page</h2>
现在,您可以运行应用程序了:https://127.0.0.1:8080/tutorial/about。
广告