Continuação... Criando a Interface e adiante

Transcrição

1 Continuação... Criando a Interface e adiante

2 Criando a interface Para criar a interface utilizaremos JavaServer Faces Biblioteca PrimeFaces Documentação de PrimeFaces

3 JavaServer Faces JavaServer Faces É um framework que tem o objetivo simplificar o desenvolvimento de interfaces para web Fornece um conjunto de componentes para interação com o usuário É baseado em eventos: o evento no cliente causa uma resposta do servidor

4 Aplicações web

5 Aplicações web com Java Uma aplicação web é um programa que fica hospedado em um servidor O usuário acessa o programa por meio do browser O acesso aos sistemas é feito utilizando o modelo request/response O cliente solicita que uma ação seja realizada(request) e o servidor a realiza e responde ao cliente (response)

6 Aplicações web com Java No mundo Java os servidores são chamados de Servlet Container Exemplos de servidores: Glassfish Tomcat JBoss etc

7 Aplicações web com Java Neste curso, utilizaremos a biblioteca de componentes PrimeFaces Utilizaremos o modelo MVC - Model - View - Controller A ideia por trás do MVC é a separação de conceitos Separa-se a informação (e regras de negócio) da interface com a qual o usuário interage

8 Um pouco sobre MVC

9 Ou...

10 Um pouco sobre MVC Modelo (model): dados da aplicação, regras de negócio Visão (view): camada que manipula os dados para exibição exibe os dados Controlador: faz a mediação entre o modelo e a visão (Nem todos concordam com isso...)

11 Vamos à prática - Uma classe do modelo Utilizaremos a classe Curso, já criada: Construtor sem argumentos Implementa a interface Serializable Atributos privados e métodos get e set para cada atributo para relacionar com uma tabela do banco Definição de uma chave primária

12 Vamos à prática - Uma classe do modelo

13 Criando o Controlador (Controller) O controlador: Implementa a interface Serializable Tem um construtor sem parâmetros Fica entre a tela e o modelo Um controlador processa as requisições do usuário e devolve as respostas

14 Criando o Controlador (Controller)

15 Criando o controle para cadastro de cursos

16 Criando o controle para cadastro de cursos

17 Cuidado com null pointer

18 Criando o controle Dê um nome e estabeleça o escopo

19 Criando o controle Nome: opcional Se não for dado, o padrão é o nome da classe com a primeira letra minúscula Escopo Tempo de vida do objeto (controlador)

20 Criando o controle Escopo Request: o objeto morre a cada requisição View: o objeto vive enquanto a aplicação não mudar de tela Session: enquanto durar a sessão Aplication: enquanto a aplicação estiver executando

21 Criando a tela Nossas telas serão criadas em xhtml Crie na pasta web do projeto (subpasta adequada) Reaproveite o esqueleto de telas É trabalhoso lembrar os detalhes Não se preocupe com aparência!! (por enquanto)

22 Criando a tela

23 Criando a tela - Arquivo xhtml

24 Criando um form Sempre que houver entrada de dados na tela, os campos devem estar dentro de um form

25 Criando um form Nosso curso tem dois atributos: codigo (atribuído automaticamente) nome Vamos criar o campo para o usuário preencher o nome do novo curso

26 Utilizando as tags do PrimeFaces As tags dos componentes do PrimeFaces se iniciam com <p: Um rótulo em PrimeFaces Componentes com uma linha terminam com />

27 Utilizando as tags do PrimeFaces Componentes com outros aninhados

28 Utilizando as tags do PrimeFaces Criando um campo para entrada de texto

29 Vinculando com o controller A vinculação com o controlador é feita por meio da linguagem EL - expression language A EL utiliza os caracteres #{ }

30 Componentes jsf Vamos incrementar nosso componente

31 Componentes jsf Vamos criar um botão de ação

32 Processando o evento Vamos criar um método para processar o evento gerado pelo botão

33 Processando o evento Vamos vincular o clique no botão ao método no controlador

34 Retornando mensagem Vamos adicionar um componente para exibir as mensagens

35 Retornando mensagem Vamos alterar o método no controlador para exibir uma mensagem ao usuário

36 Retornando mensagem É necessário dizer que queremos atualizar a tela (o form) após o processamento da ação relativa ao botão

37 Retornando mensagem É necessário dizer que queremos atualizar a tela (o form) após o processamento da ação relativa ao botão

38 Gerenciando Cursos (Cadastrar, Alterar, Excluir, Consultar) Já vimos como cadastrar um novo curso (inserir o objeto no banco) Agora melhorar nossa tela para listar os objetos cadastrados, bem como poder alterá-los e exclui-los Utilizaremos um componente DataTable

39 Listando Cursos Cadastrados Já temos o método ListarTodos( ) na classe DAO que nos retorna uma lista com todos os objetos cadastrados no banco Precisamos uma lista no controlador para receber estes objetos

40 Listando Cursos Cadastrados No controlador:

41 Listando Cursos Cadastrados No xhtml:

42 Listando Cursos Cadastrados Criando as colunas:

43 Excluindo Cursos Criando as colunas com botões de comando:

44 Excluindo Cursos Incrementando nosso código: confirmação

45 Excluindo Cursos Incrementando nosso código: criando a confirmação

46 Alterando Cursos Criando as colunas com botões de comando: Vamos abrir um popup para editar o curso

47 Alterando Cursos Veja o código no GitHub

48 Alterando Cursos Enquanto isso, no controlador

49 Navegação entre páginas Navegação por link: coloca-se o nome do arquivo xhtml <h:link outcome="cursogerenciar" value="gerenciar cursos" /> Se estiver dentro de uma pasta <h:link outcome="curso/cursogerenciar" value="gerenciar cursos" /> Para retornar ao diretório acima <h:link outcome="/index" value="sair" />

50 Mapeando Relacionamentos Em muitos casos, objetos estão relacionados com outros objetos No nosso exemplo, um Curso possui várias disciplinas e Disciplina pertence a um Curso Podemos mapear os relacionamentos por meio de anotações

51 Mapeando Relacionamentos Curso 1 n Disciplina

52 Mapeando Relacionamentos Um curso tem n disciplinas

53 Mapeando Relacionamentos Várias disciplinas pertencem a um Curso (este código pode ser visto em modelo.curso)

54 Mapeando Relacionamentos Fazendo isso: Quando recuperarmos (consulta) uma disciplina, ela já tem o curso correspondente Quando recuperarmos um curso, ele traz todas as disciplinas pertencentes a ele

55 Componentes de seleção Alguns componentes exigem um tratamento diferente, como SelectOneMenu e SelectOneRadio

56 Componentes de seleção Criando um SelectOneMenu O value é o objeto no controlador que contém a seleção

57 Componentes de seleção É preciso criar uma lista de opções (selectitem) A lista pode estar vinculada a uma lista no controlador (cursos é uma List com todos os cursos)

58 Componentes de seleção O itemvalue é o valor que o componente contém quando o usuário selecionar O itemlabel é o que aparecerá na tela var é uma variável para cada item da lista (você pode ver este código em curso/cursomatricular.xhtml)

59 Componentes de seleção No entanto: o que aparece na tela é texto Para manipularmos o item da lista como objeto é necessário criar um converter (uma classe que converte texto para objeto e objeto para texto) Um converter é uma classe que herda de Converter e implementa seus métodos abstratos

60 Criando um converter (você pode ver o código completo em util.cursoconverter.java)

61 Criando um converter Após criado, adicionamos o converter ao componente

62 continua...