Introdução ao Wicket Framework

1. Visão geral

Wicket é uma estrutura orientada a componentes da web do lado do servidor Java que visa simplificar a construção de interfaces da web, introduzindo padrões conhecidos do desenvolvimento de UI de desktop.

Com o Wicket, é possível criar um aplicativo da Web usando apenas código Java e páginas HTML compatíveis com XHTML. Não há necessidade de Javascript, nem arquivos de configuração XML.

Ele fornece uma camada sobre o ciclo de solicitação-resposta, impedindo o trabalho em um nível baixo e permitindo que os desenvolvedores se concentrem na lógica de negócios.

Neste artigo, apresentaremos os fundamentos da construção do aplicativoHelloWorld Wicket, seguido por um exemplo completo usando dois componentes integrados que se comunicam entre si.

2. Configuração

Para executar um projeto Wicket, vamos adicionar as seguintes dependências:


    org.apache.wicket
    wicket-core
    7.4.0

Você pode querer verificar a última versão do Wicket noMaven Central repository, que no momento da sua leitura pode não coincidir com a usada aqui.

Agora estamos prontos para criar nosso primeiro aplicativo Wicket.

**3. HelloWorld Wicket**

Vamos começar subclassificando a classeWebApplication de Wicket, que, no mínimo, requer a substituição do métodoClass<? extends Page> getHomePage().

O Wicket usará essa classe como principal ponto de entrada do aplicativo. Dentro do método, basta retornar um objetoclass de uma classe chamadaHelloWorld:

public class HelloWorldApplication extends WebApplication {
    @Override
    public Class getHomePage() {
        return HelloWorld.class;
    }
}

O Wicket favorece a convenção sobre a configuração. A adição de uma nova página da web ao aplicativo requer a criação de dois arquivos: um arquivo Java e um arquivo HTML com o mesmo nome (mas extensão diferente) no mesmo diretório. A configuração adicional é necessária apenas se você desejar alterar o comportamento padrão.

No diretório do pacote do código-fonte, primeiro adicioneHelloWorld.java:

public class HelloWorld extends WebPage {
    public HelloWorld() {
        add(new Label("hello", "Hello World!"));
    }
}

entãoHelloWorld.html:

Como uma etapa final, adicione a definição do filtro dentro deweb.xml:


    wicket.examples
    
      org.apache.wicket.protocol.http.WicketFilter
    
    
        applicationClassName
        
          com.example.wicket.examples.HelloWorldApplication

É isso aí. Acabamos de codificar nosso primeiro aplicativo da Web Wicket.

Execute o projeto construindo um arquivowar, (mvn package da linha de comando) e implante-o em um contêiner de servlet como Jetty ou Tomcat.

Vamos acessarhttp://localhost:8080/HelloWorld/ no navegador. Uma página vazia com a mensagemHello World! deve aparecer.

4. Wicket Components

Os componentes no Wicket são tríades que consistem em uma classe Java, a marcação HTML e um modelo. Os modelos são uma fachada que os componentes usam para acessar os dados.

Essa estrutura fornece uma boa separação de preocupações e, ao dissociar o componente das operações centradas em dados, aumenta a reutilização de código.

The example that follows demonstra como adicionar o comportamento Ajax a um componente. Consiste em uma página com dois elementos: um menu suspenso e um rótulo. Quando a seleção suspensa mudar, o rótulo (e somente o rótulo) será atualizado.

O corpo do arquivo HTMLCafeSelector.html será mínimo, com apenas dois elementos, um menu suspenso e um rótulo:



    Address: address

No lado do Java, vamos criar o rótulo:

Label addressLabel = new Label("address",
  new PropertyModel(this.address, "address"));
addressLabel.setOutputMarkupId(true);

O primeiro argumento no construtorLabel correspondendo aowicket:id atribuído no arquivo HTML. O segundo argumento é o modelo do componente, um wrapper para os dados subjacentes que são apresentados no componente.

O métodosetOutputMarkupId torna o componente elegível para modificação via Ajax. Vamos agora criar a lista suspensa e adicionar o comportamento Ajax a ela:

DropDownChoice cafeDropdown
  = new DropDownChoice<>(
    "cafes",
    new PropertyModel(this, "selectedCafe"),
    cafeNames);
cafeDropdown.add(new AjaxFormComponentUpdatingBehavior("onchange") {
    @Override
    protected void onUpdate(AjaxRequestTarget target) {
        String name = (String) cafeDropdown.getDefaultModel().getObject();
        address.setAddress(cafeNamesAndAddresses.get(name).getAddress());
        target.add(addressLabel);
    }
});

A criação é semelhante à do rótulo, o construtor aceita o id do wicket, um modelo e uma lista de nomes de cafés.

Em seguida,AjaxFormComponentUpdatingBehavior é adicionado com o método de retorno de chamadaonUpdate que atualiza o modelo do rótulo uma vez que a solicitação ajax é emitida. Por fim, o componente do rótulo é definido como um destino para atualização.

Por fim, o componente do rótulo é definido como um destino para atualização.

Como você pode ver, tudo é Java, não era necessária uma única linha de Javascript. Para alterar o que o rótulo exibe, simplesmente modificamos um POJO. O mecanismo pelo qual a modificação de um objeto Java se traduz em uma alteração na página da Web ocorre por trás das cortinas e não é relevante para o desenvolvedor.

O Wicket oferece um grande conjunto de componentes habilitados para AJAX prontos para uso. O catálogo dos componentes com exemplos ao vivo está disponívelhere.

5. Conclusão

Neste artigo introdutório, cobrimos os fundamentos do Wicket, a estrutura da web baseada em componentes em Java.

O Wicket fornece uma camada de abstração que visa eliminar completamente o código de encanamento.

Incluímos dois exemplos simples, que podem ser encontradoson GitHub, para dar uma ideia de como é o desenvolvimento com este framework.

TOC

Introdução ao Wicket Framework