Wicket - Brincando com Objetos

Wicket Brincando 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 à POO Queremos 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 Reduzida Não existe um “wicket-config.xml” :D Definição do controller no web.xml Componentes Definição Construção Customizaçã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 Spring Hibernate JasperReports Ajax Outros... ? É Java! Componentes Tabelas de Dados DatePicker Editor de texto Painel 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 JavaScript CSS URLs Amigáveis www.summa-tech.com

Componentes e Dados Tudo é componente No HTML: wicket:id No Java: propriedade “id” HTML Java new Label(“foo”); <span wicket:id=quot;foo”> 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>> PropertyModel +nome : String +cidade : String www.summa-tech.com

Componentes e Dados (5) Modelos Avançados Modelos não-atachados Guarda apenas o id na sessão Recupera o objeto quando necessário Libera o objeto após o uso Modelos Compostos Utiliza 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 Design da página Página <h1> <table> link (<a href>) www.summa-tech.com

Demonstração Design da página Página <h1> linhas (<tr>) <table> link (<a href>) www.summa-tech.com

Demonstração Design da página Página <h1> nome fone perfil linhas (<tr>) <table> link (<a href>) www.summa-tech.com

Demonstração Marcando o HTML <html> ... <body> <h1>Recursos</h1> <table border=quot;1quot;> <tr> <td>Bruno Borges</td> <td>8565-7739</td> Página <td>java developer</td> <h1> </tr> </table> </body> nome fone perfil linhas (<tr>) </html> <table> link (<a href>) www.summa-tech.com

Demonstração Marcando o HTML <html> ... <body> <h1>Recursos</h1> <table border=quot;1quot;> <tr wicket:id=quot;linhasquot;> <td>Bruno Borges</td> <td>8565-7739</td> <td>java developer</td> Página </tr> <h1> </table> </body> nome fone perfil </html> linhas (<tr>) link (<a href>) www.summa-tech.com

Demonstração Marcando o HTML <html> ... <body> <h1>Recursos</h1> <table border=quot;1quot;> <tr wicket:id=quot;linhasquot;> <td><span wicket:id=“nome”>Bruno ... <td><span wicket:id=“fone”>8565-7739 ... <td><span wicket:id=“perfil”>java developer ... Página </tr> <h1> </table> </body> nome fone perfil </html> linhas (<tr>) link (<a href>) www.summa-tech.com

Demonstração Do HTML para o Java public class RecursosPage extends WebPage { public RecursosPage() { } } Página <h1> nome fone perfil linhas (<tr>) <table> link (<a href>) 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 } <h1> } } nome fone perfil linhas (<tr>) <table> link (<a href>) 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 } <h1> protected void populateItem(ListItem item) { item.add(new Label(“nome”)); nome fone perfil item.add(new Label(“fone”)); linhas (<tr>) <table> item.add(new Label(“perfil”)); link (<a href>) } 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 Adicionando o link Apagar Página <h1> apagar nome fone perfil <table> link (<a href>) www.summa-tech.com

Demonstração Modificar o HTML ... <tr wicket:id=quot;linhasquot;> <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 <h1> nome fone perfil apagar linhas (<tr>) <table> link (<a href>) www.summa-tech.com

Demonstração Atribuir Wicket id ... <tr wicket:id=quot;linhasquot;> <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 <h1> nome fone perfil apagar linhas (<tr>) <table> link (<a href>) www.summa-tech.com

Demonstração Adicionar o componente em Java protected 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 <h1> <a wicket:id=“apagar” href=“#”>apagar</a> nome fone perfil apagar linhas (<tr>) <table> link (<a href>) www.summa-tech.com

Demonstração Adicionar o componente em Java protected 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(); Página RecursosDAO.apagarRecurso(r); <h1> } }); nome fone perfil apagar } linhas (<tr>) <table> link (<a href>) 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 onClick ao componente Link www.summa-tech.com

Demonstração Adicionando paginação à lista Página <h1> nome fone perfil apagar linhas (<tr>) navegacao <table> link (<a href>) 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”> Página <span>navegacao</span> <h1> </td> nome fone perfil apag </tr> linhas (<tr>) </table> navegacao <table> link (<a href>) 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”> Página <span wicket:id=“navegacao”> <h1> navegacao nome fone perfil apag </span> linhas (<tr>) </td> navegacao </tr> <table> </table> link (<a href>) www.summa-tech.com

Demonstração Tornar a ListView paginável public class RecursosPage extends WebPage { public RecursosPage() { add(new RecursosListView(“linhas”, recursos)); } private class RecursosListView extends PageableListView { Página private RecursosListView(String id, IModel m) <h1> { super(id, m, 2); nome fone perfil apag linhas (<tr>) } navegacao <table> Itens por página link (<a href>) www.summa-tech.com

Demonstração Adicionar componente navegação public class RecursosPage extends WebPage { public RecursosPage() { RecursosListView rlv = new RecursosListView(“linhas”, recursos); add(rlv); add(new PagingNavigator(“navegacao”, rlv)); } Página ... <h1> nome fone perfil apag linhas (<tr>) navegacao <table> link (<a href>) 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 Locke www.muppetlabs.com/~jonl/ Javapolis 2005 www.javapolis.com/confluence/display/JP05/Wicket JavaOne 2005 developers.sun.com/learning/javaoneonline/2005/web www.summa-tech.com

Fim ;) Exemplos www.wicket-library.com Incubadora wicket-stuff.sourceforge.net Site Oficial www.wicket-framework.org www.summa-tech.com

Wicket - Brincando com Objetos

by Bruno Borges on Dec 17, 2007

Accessibility

Categories

Tags

Upload Details

Usage Rights

1 Embed 11

Statistics

Wicket - Brincando com Objetos — Presentation Transcript