Zend Framework - Макет
Макет представляет собой общие части нескольких представлений, например, верхний и нижний колонтитулы страницы. По умолчанию макеты должны храниться вview/layout папка.
Конфигурация макета определяется под view_manager раздел в файле module.config.php.
Конфигурация скелетного приложения по умолчанию выглядит следующим образом:
'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. Эта переменная важна, так как она будет заменена сценарием просмотра (шаблоном) фактически запрошенной страницы.
Создание нового макета
Давайте создадим новый макет для нашего учебного модуля.
Для начала создадим tutorial.css file в каталоге «public / css».
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
Создать новый файл макета newlayout.phtmlв / myapp / module / Tutorial / view / layout / и скопируйте содержимое из существующего макета. Затем добавьтеtutorial.css таблица стилей с использованием HeadLink вспомогательный класс внутри раздела заголовка макета.
<?php echo $this->headLink()->appendStylesheet('/css/tutorial.css');?>
Добавить новый about ссылку в разделе навигации с помощью URL помощник.
<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',),
)
Добавить aboutAction функция в TutorialController.
public function aboutAction() {
}
Добавить about.phtml в myapp / module / Tutorial / view / tutorial / tutorial / со следующим содержимым.
<h2>About page</h2>
Теперь вы готовы, наконец, запустить приложение - http://localhost:8080/tutorial/about.