wicket - brincando com objetos
DESCRIPTION
Apresentação sobre o Apache WicketTRANSCRIPT
www.summa-tech.com
WicketWicketBrincando com
Objetos... na Web! :D
www.summa-tech.com
Agenda
Wicket: de volta à POO
Introdução
Conceitos Aplicados
Componentes e Dados
Demonstração
Aplicação Real
Perguntas
Fim ;)
www.summa-tech.com
Wicket: de volta à POOQueremos usar OO na Web!
Componentes são reutilizáveis (sério!)
Componentes podem ser independentes
MVC em Objetos e não em “Requests”
HTML e Java integrados, não amarrados
www.summa-tech.com
Introdução
Projeto iniciado em 2004 por Jonathan Locke
Evangelista Java
Trabalhou na Microsoft e na JavaSoft
Motivação: componentizar e manipular HTML de forma transparente com Objetos
Prêmio: CCEs, NPEs e *Es quase inexplicáveis: nunca mais.
Diversão
www.summa-tech.com
Introdução
Web...
www.summa-tech.com
Introdução
Frameworks Web: muitos e poucos
www.summa-tech.com
Conceitos Aplicados
Gerência de Sessão automatizada
Configuração ReduzidaNão existe um “wicket-config.xml” :DDefinição do controller no web.xml
ComponentesDefiniçãoConstruçãoCustomização
www.summa-tech.com
Conceitos Aplicados (2)Composição de páginas
Painéis
Bordas
Herança de código HTML
Suporte avançado a i18n e CSS
Por página: pagina_en.html
Por resource bundle: pagina_en.properties
Por hierarquia
www.summa-tech.com
Conceitos Aplicados (3)Integração
SpringHibernateJasperReportsAjaxOutros... ? É Java!
ComponentesTabelas de DadosDatePickerEditor de textoPainel com abas, navegação, menu em árvore...
www.summa-tech.com
Conceitos Aplicados (4)Gerência de estado
Sessões “type-safe”
Botão Voltar
Estratégia de duplo-clique
Suporte a Testes Unitários
JUnit
Mensagens de erro e log detalhadas
www.summa-tech.com
Conceitos Aplicados (5)Ajax
Dojo, Scriptaculous, YUI, ...Componentes Nativos/Extensões (Wicket: Core, Extensions, Stuff)
Contribuição de HTML Header hierárquica
JavaScriptCSS
URLs Amigáveis
www.summa-tech.com
Componentes e Dados
Tudo é componente
No HTML: wicket:id
No Java: propriedade “id”
<span wicket:id="foo”> new Label(“foo”);
HTML Java
www.summa-tech.com
Componentes e Dados (2)
Reutilização
Painéis permitem agrupamento
Componentes aninhados
cep/numero
rua
cidade
www.summa-tech.com
Componentes e Dados (2)
Reutilização
Painéis permitem agrupamento
Componentes aninhados
cep/numero
rua
cidade
www.summa-tech.com
Componentes e Dados (2)
Reutilização
Painéis permitem agrupamento
Componentes aninhados
cep/numero
rua
cidade
www.summa-tech.com
Componentes e Dados (3)
Reutilização
Painéis permitem agrupamento
Componentes aninhados
Empacotar um JAR
HTML, JavaScript, CSS, Imagens
Classes
Classpath, e pronto! Reutilize!
www.summa-tech.com
Componentes e Dados (4)
Modelos conectam componentes Wicket aos seus POJOs
Modelos são o cérebro da aplicação
Label(“nome”, model)
<<Pessoa>>
+nome : String+cidade : String
PropertyModel
www.summa-tech.com
Componentes e Dados (5)
Modelos Avançados
Modelos não-atachadosGuarda apenas o id na sessão
Recupera o objeto quando necessário
Libera o objeto após o uso
Modelos CompostosUtiliza o id do componente para recuperar os dados
Ex: new Label(“pessoa.endereco.rua”, ...);
www.summa-tech.com
Demonstração
www.summa-tech.com
Demonstração
www.summa-tech.com
Demonstração
Design da página
Página
<table>
link (<a href>)
<h1>
www.summa-tech.com
Demonstração
Design da página
Página
<table>
link (<a href>)
<h1>
linhas (<tr>)
www.summa-tech.com
Demonstração
Design da página
Página
<table>
link (<a href>)
<h1>
linhas (<tr>)nome fone perfil
www.summa-tech.com
Demonstração
Marcando o HTML
<html> ...<body><h1>Recursos</h1><table border="1"><tr>
<td>Bruno Borges</td><td>8565-7739</td><td>java developer</td>
</tr></table></body></html>
Página
<table>
linhas (<tr>)nome fone perfil
link (<a href>)
<h1>
www.summa-tech.com
Demonstração
Marcando o HTML
<html> ...<body><h1>Recursos</h1><table border="1"><tr wicket:id="linhas">
<td>Bruno Borges</td><td>8565-7739</td><td>java developer</td>
</tr></table></body></html>
Página
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
www.summa-tech.com
Demonstração
Marcando o HTML
<html> ...<body><h1>Recursos</h1><table border="1"><tr wicket:id="linhas"><td><span wicket:id=“nome”>Bruno ...<td><span wicket:id=“fone”>8565-7739 ...<td><span wicket:id=“perfil”>java developer ...</tr></table></body></html>
Página
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
www.summa-tech.com
Demonstração
Do HTML para o Java
public class RecursosPage extends WebPage { public RecursosPage() { }}
Página
<table>
linhas (<tr>)nome fone perfil
link (<a href>)
<h1>
www.summa-tech.com
Demonstração
Do HTML para o Java
public class RecursosPage extends WebPage { public RecursosPage() { add(new RecursosListView(“linhas”, recursos)); }
private class RecursosListView extends ListView { private RecursosListView(String id, IModel m) { super(id, m); } }}
Página
<table>
linhas (<tr>)nome fone perfil
link (<a href>)
<h1>
www.summa-tech.com
Demonstração
Do HTML para o Java
public class RecursosPage extends WebPage { public RecursosPage() { add(new RecursosListView(“linhas”, recursos)); }
private class RecursosListView extends ListView { private RecursosListView(String id, IModel m) { super(id, m); } protected void populateItem(ListItem item) { item.add(new Label(“nome”)); item.add(new Label(“fone”)); item.add(new Label(“perfil”)); }
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
www.summa-tech.com
Demonstração
Sumário
Criar o HTML (ou ter ele pronto)
Identificar componentes
Atribuir wicket:id
Criar classe da página
Adicionar componentesà página
www.summa-tech.com
Demonstração
www.summa-tech.com
Demonstração
Adicionando o link Apagar
Página
<table>
nome fone perfil
link (<a href>)
<h1>
apagar
www.summa-tech.com
Demonstração
Modificar o HTML
...<tr wicket:id="linhas"><td><span wicket:id=“nome”>Bruno Borges</span></td><td><span wicket:id=“fone”>8565-7739 </span></td><td><span wicket:id=“perfil”>java developer </span></td><td><a href=“#”>apagar</a></td></tr>... Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apagar
www.summa-tech.com
Demonstração
Atribuir Wicket id
...<tr wicket:id="linhas"><td><span wicket:id=“nome”>Bruno Borges</span></td><td><span wicket:id=“fone”>8565-7739 </span></td><td><span wicket:id=“perfil”>java developer </span></td><td><a href=“#” wicket:id=“apagar”>apagar</a></td></tr>... Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apagar
www.summa-tech.com
Demonstração
Adicionar o componente em Javaprotected void populateItem(ListItem item) { item.add(new Label(“nome”)); item.add(new Label(“fone”)); item.add(new Label(“perfil”)); item.add(new Link(“apagar”));}
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apagar<a wicket:id=“apagar” href=“#”>apagar</a>
www.summa-tech.com
Demonstração
Adicionar o componente em Javaprotected void populateItem(ListItem item) { item.add(new Label(“nome”)); item.add(new Label(“fone”)); item.add(new Label(“perfil”)); item.add(new Link(“apagar”) { protected void onClick() { Recurso r = (Recurso)getParent() .getModelObject(); RecursosDAO.apagarRecurso(r); } });}
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apagar
www.summa-tech.com
Demonstração
Sumário
Modificar HTML: adicionar link apagar
Atribuir wicket:id ao link
Adicionar componente Link ao ListItem
Adicionar evento onClickao componente Link
www.summa-tech.com
Demonstração
www.summa-tech.com
Demonstração
Adicionando paginação à lista
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apagar
navegacao
www.summa-tech.com
Demonstração
Adicionar o componente de navegacao ao HTML
… <td><span wicket:id=“perfil”>java dev</span></td> <td><a href=“#” wicket:id=“apagar”>apagar</td></tr><tr> <td colspan=“4”> <span>navegacao</span> </td></tr></table>
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apag
navegacao
www.summa-tech.com
Demonstração
Atribuir wicket:id
… <td><span wicket:id=“perfil”>java dev</span></td> <td><a href=“#” wicket:id=“apagar”>apagar</td></tr><tr> <td colspan=“4”> <span wicket:id=“navegacao”> navegacao </span> </td></tr></table>
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apag
navegacao
www.summa-tech.com
Demonstração
Tornar a ListView paginável
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apag
navegacao
public class RecursosPage extends WebPage { public RecursosPage() { add(new RecursosListView(“linhas”, recursos)); }
private class RecursosListView extends PageableListView { private RecursosListView(String id, IModel m) { super(id, m, 2); }
Itens por página
www.summa-tech.com
Demonstração
Adicionar componente navegação
Página
<table>
linhas (<tr>)
nome fone perfil
link (<a href>)
<h1>
apag
navegacao
public class RecursosPage extends WebPage { public RecursosPage() { RecursosListView rlv = new RecursosListView(“linhas”, recursos); add(rlv); add(new PagingNavigator(“navegacao”, rlv)); }
...
www.summa-tech.com
Demonstração
Sumário
Modificar HTML: adicionar painel de navegação
Atribuir wicket:id ao <span>
Mudar a herança da ListView para PageableListView
Adicionar componente de navegação à página
www.summa-tech.com
Demonstração
Resumo
Exemplo de 10 minutos
Java e HTML puros
Sem novidades para o HTML
Sem configurações em XML
Caso muito comum em projetos: paginação e manipulação em tabelas de dados
www.summa-tech.com
Perguntas
Wicket realmente utiliza a sessão (HttpSession)?
Wicket está sendo utilizado e é um projeto ativo?
Onde encontrar maiores informações?
www.summa-tech.com
Fim ;)
Jonathan Lockewww.muppetlabs.com/~jonl/
Javapolis 2005www.javapolis.com/confluence/display/JP05/Wicket
JavaOne 2005developers.sun.com/learning/javaoneonline/2005/webtier/TS-8617.html
www.summa-tech.com
Fim ;)
Exemploswww.wicket-library.com
Incubadorawicket-stuff.sourceforge.net
Site Oficialwww.wicket-framework.org