Esse mini-tutorial tem o intuito de servir como pontapé inicial ao desenvolvimento de JSF com o plugin visual do NetBeans. Veja que não é intuito explicar JSF, e sim, e tão apenas, mostrar como usar o Visual JSF. A versão do NetBeans que estamos utilizando para esse blog é a 6.7.1.
Inicialmente, é necessário que se instale os plugins para desenvolvimento de aplicações com o Visual JSF. Para fazer isso, siga os seguintes passos:
Após instalados os plugins, iremos criar um projeto web com o Visual JSF. Para isto, siga os passos abaixo:
Veja que a primeira figura mostra as páginas web, neste caso a Page1, que é criada como padrão, e a segunda figura mostra a estrutura de código em Java. Veja que, também por padrão, o plugin do Visual JSF cria para você 4 backing beans (BB): um backing bean chamado Page1, representando o BB da Page1.jsp, e os BBs ApplicationBean1, SessionBean1 e RequestBean1, representando, respectivamente, BBs de Aplicação, Sessão e Requisição. Você pode criar outros BBs e configurá-los no faces-config.xml. O plugin gera esses BBs apenas para facilitar a vida do programador, não sendo este obrigado a usá-los.
Escolha o nome da página, o pacote onde o backing bean da página irá ficar e clique em finalizar. Veja que o nome do BB, por padrão, é o mesmo nome da página. Para alterar é necessário mudar no faces-config.xml.
Ela representa a área visual de sua página. Tudo que você colocar aí, visualmente, será mostrado na mesma posição e com as mesmas configurações escolhidas, ou seja, esse é um editor wysiwyg (What You See Is What You Get). Perceba na figura que o botão Design no canto esquerdo superior está selecionado, que é exatamente a visão de design que temos. Se quisermos visualizar o JSP (ou JSF, como queira) por trás dessa tela, clique em JSP. Se você quiser ver o BB desta página, clique em Java. Isso tudo serve para diminuir o temp0 de desenvolvimento com opções de edição integradas.
Para adicionar componentes a uma página, basta clicar no componente JSF na paleta do lado direito do editor, quanto estiver no modo de visualização Design, e arrastar e soltar na área que se deseja da página, como pode ser visto na figura abaixo. Na paleta propriedades pode-se configurar qualquer propriedade do componente. Isso facilita a vida do programador JSF, pois não é mais necessário fazer isso em código.
Para se fazer o binding do componente com o BB, ou faz-se no próprio código JSF ou visualmente, clicando com o botão direito do mouse em cima do componente e escolhendo a opção Add Binding Attribute (traduza se seu Netbeans estiver em português), como mostrado na figura abaixo.
Para se configurar quais elementos irão ser mostrados nas colunas, é necessário configurar o layout da tabela. Para isso, clique com botão direito do mouse em cima da tabela e clique em Table Layout. Eu configurei previamente, no BB da página Page1, um atributo chamado Clientes, que nada mais é que uma lista de objetos do tipo Cliente. Assim, iremos linkar os dados da tabela à lista de clientes. Quando aparecer a tela de Table Layout, escolha a propriedade Clientes. Veja que por padrão todas as colunas serão preenchiadas com os atributos da classe Cliente, que são CPF e nome. Se desejar remover alguma coluna, basta colocá-la como disponível. Veja a figura abaixo mostrando como configurar a tabela.
Por último, para esse primeiro post de Visual JSF, iremos ver como se pode pegar referências de qualquer BB, quer seja de Aplicação, Sessão ou Requisição. Suponha que você tenha um BB de requisição (request) chamado BBR, e um BB de application (aplicação) chamado BBAp. Para você pegar uma referência do BBAp estando dentro do BBR, basta executar o método getBean(String nomeBB). Esse método encontra-se implementado na classe AbstractPageBean que todo BB do Visual JSF herda. Assim, para o exemplo acima, a linha abaixo resolveria: