out 25

Criação de Layouts com Zend Framework

Layout, PHP, Programação, Zend Framework, Zend_Layout 2 Comentários Zend Framework

Em boa parte das aplicações e dos sites é muito comum que a interface visual do mesmo se mantenha ao longo das páginas e somente seu conteúdo e alguns elementos visuais variem de uma página para outra, por isso é bastante desnecessário que toda essa interface visual seja totalmente recriada a cada nova página que for criada, mesmo que isso se resuma a copiar e colar o código em um novo arquivo. Para resolver esse problema o Zend Framework possui a classe Zend Layout que será demonstrada nesse artigo.

Habilitando o Zend Layout

Para que o framework interprete que sua aplicação está utilizando a classe Zend_Layout para renderizar a interface visual você primeiro precisa habilitar seu funcionamento, o que é feito inserindo no seu arquivo Bootstrap.php a seguinte instrução:

public function _initLayout(){
	Zend_Layout::startMvc(array(
		'layout'=> 'default',
		'layoutPath' => '../application/views/scripts/layout'
	));
}

No código acima está sendo criado um método _initLayout() que será executado no início da aplicação (assim como qualquer outro método iniciado por “_init” criado na classe de Bootstrap) e nele está sendo chamado o método estático startMVC() da classe Zend_Layout para esse método está sendo passado um array com dois elementos, o primeiro, cuja chave é “layout” informa o nome do arquivo do layout que será usado pela aplicação (nesse caso “default”) e o segundo “layoutPath” informa o caminho para esse arquivo, nesse caso ele será armazenado no diretório application/views/scripts/layout.

Criando o Layout

Agora que já o uso de Zend_Layout já foi habilitado é preciso criar o arquivo default.phtml dentro do diretório application/views/scripts/layout, nesses exemplos vamos inserir a seguinte marcação HTML nele:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Minha Aplicação com Layout</title>
    </head>
    <body>
        <?php echo $this->layout()->content;?>
    </body>
</html>

Tudo o que foi feito foi criar um arquivo HTML simples com apenas uma instrução em PHP “echo $this->layout()->content;” essa instrução irá inserir nesse local do código o conteúdo da sua Action.

Inserção de Conteúdo

Após o layout ter sido habilitado e criado você pode dar prosseguimento ao desenvolvimento da sua aplicação normalmente, para esse exemplo vamos criar a página inicial da sua aplicação, dessa forma criaremos o arquivo IndexController no sue diretório de controllers da seguinte forma:

<?php
class Admin_IndexController extends Zend_Controller_Action
{
    public function init(){}

    public function indexAction(){
        $this->view->tituloPagina = 'Titulo da Página';
    }
}

No código acima foi criado o método indexAction que recebe apenas uma instrução criando a variável tituloPagina para ser passada para a view que ficará da seguinte forma:

<h1><?php echo $this->tituloPagina; ?></h1>

Sim, isso mesmo, já que já criamos todo o arquivo com o layout anteriormente a view só precisa ter o conteúdo da página mesmo, que no nosso exemplo é só uma tag h1 com o titulo da página, obviamente em um caso real haveria mais conteúdo do que esse, mas isso não muda o fato de torna o trabalho com layout muito mais simples.

Realizando Chamadas a Outros Arquivos no Layout

É muito provável que sua aplicação não tenha somente um titulo como conteúdo, muito provavelmente ela terá um menu, o código desse menu pode ser inserido juntamente com o arquivo default.phtml, mas também pode ser que você queira deixa-lo em um arquivo separado para facilitar a manutenção, isso é muito simples, basta criar dentro da mesma pasta do arquivo default.phtml um outro arquivo (que chamaremos de nav.phtml) e inserir a marcação do seu menu nele, algo similar ao apresentado abaixo:

<ul>
	<li><a href="index/index"></a>Home</li>
	<li><a href="index/news"></a>News</li>
	<li><a href="index/contato"></a>Contato</li>
</ul>

O menu do exemplo é composto de somente uma lista não ordenada de três itens com links para suas respectivas páginas. Agora é preciso alterar o arquivo de Layout para incluir a chamada para o arquivo do menu, ele ficará da seguinte forma:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Minha Aplicação com Layout</title>
    </head>
    <body>
        <?php echo $this->render('nav.phtml');?>
        <?php echo $this->layout()->content;?>
    </body>
</html>

O que foi feito foi somente incluir a referência ao arquivo do menu logo antes do conteúdo, nesse caso o menu será apresentado juntamente com sua página.

Trocando e Desabilitando o Layout

Em alguns caso pode ser que uma determinada ação dentro da sua aplicação utilize um layout diferente então será necessário trocar esse layout, também é possível que outra ação não utilize layout algum, nos dois casos a solução é simples e é apresentada abaixo:

class Admin_IndexController extends Zend_Controller_Action
{
	public function init(){}

	public function indexAction(){
		$this->view->tituloPagina = 'Titulo da Página';
	}

	public function newsAction(){
		Zend_Layout::getMvcInstance()->setLayout('novolayout.phtml');
		Zend_Layout::getMvcInstance()->setLayoutPath('../application/views/scripts/novolayout');

	}

	public function contatoAction(){
		Zend_Layout::getMvcInstance()->disableLayout();
	}
}

No exemplo acima foram criadas mais duas Actions, a primeira para a página de notícias que utiliza um layout diferente, esse layout está disponível em um arquivo novolayout.phtml na pasta application/views/scripts/novolayout conforme definido pelos métodos setLayout() e setLayoutPath() respectivamente, já a outra Action é responsável pela página de contato que não utiliza layout, nesse caso o layout foi desabilitado pelo método disableLayout() conforme mostrado acima.

Conclusão

Esse é apenas o básico sobre Layout com Zend Framework, você pode fazer muitas outras coisas com essa classe, mas só com isso já é possível perceber que o Zend_Layout poupa muito do trabalho que seria gasto caso a mesma marcação HTML tivesse que ser reproduzida em todas as páginas onde ela fosse usada. Para uma visão melhor das outras possibilidade da classe consulte a documentação oficial da classe Zend_Layout.

2 respostas para “Criação de Layouts com Zend Framework”

  1. Adilio Costa disse:

    Paulo, meus parabéns pelo tutorial, excelente explicação!

  2. Andre disse:

    Muito boa explicação! Resolveu meu problema com precisão! =]

Deixe uma resposta