aula 10 - trabalhando com templates - programação web
TRANSCRIPT
Programação Web
Fatec IpirangaAnálise e Desenvolvimento de Sistemas
Aula 10 – Trabalhando com Templates
Dalton [email protected]
São Paulo, Novembro, 2011
Aula baseada no tutorial: http://raelcunha.com/template.php
Para que servem os Templates?
Boas práticas de programação presumem que tenhamos nosso sistemas organizado em 3 camadas:
– Camada de interface: o que é utilizado pelo usuário no acesso ao sistema;
– Camada de lógica: onde fica a lógica do sistema, fluxos de informação, processos, cálculos, etc,
– Camada de persistência de dados: onde são guardados os dados – Banco de Dados.
Os templates servem para separar camada de interface e lógica!
Para que servem os Templates?
Na prática, teremos:– Arquivos HTML: contém toda a interface de
relação com o usuário, objetos de interface, configuração visual, cores, fontes, blocos, menus, etc...
– Arquivos PHP: irão incorporar os arquivos HTML, podendo configurar determinadas partes de sua exibição conforme suas necessidades expecíficas.
Biblioteca de Template
O PHP possui várias bibliotecas de templates para apoiar esse tipo de desenvolvimento.
– Exemplos: smarty, phptemplate, zend, etc...
No entanto, muitas são complexas e difíceis de utilizar, demandando tempo de estudo;
Iremos utilizar uma biblioteca das mais simples, que no entanto atende aos requisitos para separação do sistema em camadas:
– Baixar o arquivo e instalar no diretório do programa;
– http://raelcunha.com/packages/extra/template/files/Template_pt-br.zip
Começando...
Vamos gerar inicialmente dois arquivos:– Ola.php
– Ola.html
<?php
require("Template.class.php");
$tpl = new Template("ola.html"); $tpl->show(); ?>
<html><body>
Olá Mundo, com templates PHP!
</body></html>
Configurando variáveis
<html><body>
Olá {FULANO}, com templates PHP!
</body></html>
<?php
require("Template.class.php");
$tpl = new Template("ola.html"); $tpl->FULANO = "TESTE"; $tpl->show(); ?>
Checando se variáveis existem
<?php
require("Template.class.php");
$tpl = new Template("layout.html"); // Checando existência da variável antes da atribuição if($tpl->exists("FULANO")) $tpl->FULANO = "TESTE"; $tpl->show(); ?>
Trabalhando com blocos
<html><body>
<p>Quantidade de produtos cadastrados no sistema:</p>
<!-- BEGIN BLOCK_QUANTIDADE --><div class="destaque">Existem {QUANTIDADE} produtos cadastrados.</div><!-- END BLOCK_QUANTIDADE -->
<!-- BEGIN BLOCK_VAZIO --><div class="vazio">Não existe nenhum produto cadastrado.</div><!-- END BLOCK_VAZIO -->
</body>
</html>
Trabalhando com blocos<?php
require("Template.class.php");
$tpl = new Template("hello.html"); // Vamos supor que esta quantidade veio do banco de dados $quantidade = 5; // Se existem produtos cadastrados, vamos exibir a quantidade if($quantidade > 0){ $tpl->QUANTIDADE = $quantidade; $tpl->block("BLOCK_QUANTIDADE"); } // Caso não exista nenhum produto, exibimos a mensagem de vazio else { $tpl->block("BLOCK_VAZIO"); } $tpl->show(); ?>
Trabalhando com blocos e tabelas
<html><body>
<p>Produtos cadastrados no sistema:</p>
<table border=1>
<tr><td>Nome</td><td>Quantidade</td></tr>
<!-- BEGIN BLOCK_PRODUTO --><tr>
<td> {NOME} </td><td> {QUANTIDADE} </td>
</tr><!-- END BLOCK_PRODUTO -->
</table>
</body></html>
Trabalhando com blocos e tabelas<?php
require("Template.class.php");
$tpl = new Template("hello.html"); // Simulando produtos cadastrados no banco de dados $produtos = array( array("nome" => "Sabão em Pó", "quantidade" => 15), array("nome" => "Escova de Dente", "quantidade" => 53), array("nome" => "Creme Dental", "quantidade" => 37) );
// Listando os produtos foreach($produtos as $p){ $tpl->NOME = $p["nome"]; $tpl->QUANTIDADE = $p["quantidade"]; $tpl->block("BLOCK_PRODUTO"); } $tpl->show(); ?>
Trabalhando com layouts<html><body><div id="layout" style="width:500px">
<div id="cabecalho" style="background-color:#FFA500;"><h1 style="margin-bottom:0;">{TITULO}</h1></div>
<div id="menu" style="background-color:#FFD700;height:400px;width:100px;float:left;"><b>Menu</b><br /><a href="{LINK1}">{OPCAO1}</a><br /><a href="{LINK2}">{OPCAO2}</a><br />{OPCAO3}</div>
<div id="conteudo" style="background-color:#EEEEEE;height:400px;width:400px;float:left;">
<form action="exemplosimples.php" method="post"><fieldset><br><legend>Informacoes pessoais:</legend>Nome: <input type="text" name="nome" size="30" /><br />email: <input type="text" name="email" size="30" /><br />Data de nascimento: <input name="data" type="text" size="10" /><br><textarea rows="10" cols="30" name="areatexto"> Informacoes extras: </textarea> <br>
<input type="submit" name = "enviar" value="Enviar" />
</fieldset></form></div><div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">Copyleft FATEC Ipiranga</div>
</div></body></html>
Trabalhando com layouts
<?php
require("Template.class.php");
$tpl = new Template("layout.html"); $tpl->TITULO = "fatec ipiranga"; $tpl->OPCAO1 = "OPCAO MENU 1"; $tpl->LINK1 = "http://www.facebook.com";
$tpl->OPCAO2 = "OPCAO MENU 2"; $tpl->LINK2 = "http://www.google.com.br";
$tpl->show(); ?>