Rich faces no NetBeans

174 visualizações

Publicada em

RichFaces o que é e como instalar no NetBeans

Publicada em: Tecnologia
0 comentários
1 gostou
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
174
No SlideShare
0
A partir de incorporações
0
Número de incorporações
24
Ações
Compartilhamentos
0
Downloads
3
Comentários
0
Gostaram
1
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Rich faces no NetBeans

  1. 1. RichFaces 4.5.9 Marcos Venicios da Costa Cruz Aminadabe dos Santos da Silva
  2. 2. O que é o RichFaces O RichFaces é um framework open source para desenvolvimento de interfaces Web ricas em recursos visuais, aproveitando todas as características oferecidas pela arquitetura do Java Server Faces (JSF), incluindo seu ciclo de vida, e recursos de validações, gerenciamento estático e dinâmico de seus componentes.
  3. 3. Características RichFaces Os requisitos mínimos de infraestrutura para desenvolvimento com o RichFaces são: • Java™ SE 6 • Apache Tomcat ou GlassFish • Um navegador minimamente atual, como Firefox , Opera, Google Chrome • Uma IDE. Recomendamos Eclipse ou NetBeans
  4. 4. Características RichFaces As principais diferenças que você perceberá aqui com relação ao desenvolvimento anterior ao JSF 2 usando JSP são: • Algumas notações adicionais em web.xml e em faces-config.xml são exigidas ou tomadas como padrão • Páginas da web são documentos XHTML • Namespaces XML são usados em vez de bibliotecas de tag JSP
  5. 5. Componentes do RichFaces Os componentes de demonstração Inicialmente, o RichFaces pode parecer assustador; o componente médio tem mais de 20 atributos específicos, além de atributos gerais que podem ser substituídos. No entanto, durante uma utilização normal, os componentes não são difíceis de configurar, com a maioria dos atributos tendo padrões razoáveis. A versão 4 apresentou padrões adicionais e alterados e vale a pena conferir a documentação. Os principais componentes demonstrados neste artigo (com substituições para a Versão 4 indicadas) são...
  6. 6. Componentes do RichFaces Calendar : um componente pop-up que permite seleções de data. A Figura 1 mostra um exemplo. < e > mudam o mês; << e >> mudam o ano. Clicar em Today na parte inferior seleciona a data de hoje. Clean limpa a seleção de data. A primeira coluna de números no lado esquerdo mostra a semana do ano.
  7. 7. Componentes do RichFaces Calendar : O Código para se implementar o calendário é muito simples e de fácil aprendizagem. <rich:calendar datePattern="dd/M/yyyy" enableManualInput="true"> <rich:placeholder value="dd/mm/yyyy" /> </rich:calendar> Com este simples código é possível fazer um calendário pop-up passando simples parâmetros para o datePattern, setamos o formato da data, ao habilitarmos o enableManualInput como “true”, permitimos que o usuário digite a data que quer inserir no calendário sem usar a pesquisa.
  8. 8. Componentes do RichFaces Panel : O painel é uma área retangular em uma página que pode conter qualquer conteúdo, incluindo outros painéis. Painel tem um cabeçalho ( opcionalmente ) e um corpo . O regime de cores , bordas e preenchimentos podem ser customizáveis usando com​​ número pré- definido de classes CSS .
  9. 9. Componentes do RichFaces Panel : O Código para se implementar o painel é muito simples e de fácil aprendizagem. <rich:panel header="nome do painel"> …. Conteudo, pode ser qual quer coisa, formulários ou outros painéis …. </rich:panel>
  10. 10. Componentes do RichFaces select : O select no richFaces funciona de forma muito parecida com um html puro, aonde declaramos a tag de select e as suas opções.
  11. 11. Componentes do RichFaces select : Para se implementar o select <rich:select> <f:selectItem itemValue="valor_1" itemLabel="nome que aparecerá" /> <f:selectItem itemValue="valor_2" itemLabel="nome que aparecerá" /> </rich:select> Simples como em html.
  12. 12. Componentes do RichFaces dataTable : o rich:dataTable é um componente tabela que interage diretamente com o banco de dados.
  13. 13. Componentes do RichFaces dataTable : A implenetação de uma dataTable é simples e pode ser feita com os seguintes códigos. <rich:dataTable> <rich:column> <f:facet name="header"> <h:outputText value="Nome"/> </f:facet> <h:outputText value="#{car.model}"/> </rich:column> </rich:dataTable>
  14. 14. Componentes do RichFaces Existem ainda muitos outros componentes do RichFaces que podem muito facilitar a vida de um programador web, como uma integração direta com a api do google map, selects e menus estilizados, e muito mais que pode ser conferidos nos seguintes sites, que servem como uma especie de bootstrap para o RichFaces, fornecendo exemplos de como se construir uma interface amigável usando o framework.  http://livedemo.exadel.com/  http://showcase.richfaces.org:8000/  http://richfaces.jboss.org/
  15. 15. Instalando o RichFaces Agora que já conhecemos o RichFaces e vimos o poder de suas ferramentas, vamos ensinar como instala-lo no seu NetBeans. Passo 1: Baixe e instale o NetBeans no seu computador, o site para download https://netbeans.org/downloads/ Passo 2: Faça download das bibliotecas do Richfaces no site http://richfaces.jboss.org/download/stable.html Passo 3: Extraia os arquivos em uma pasta de sua escolha Passo 4: Crie uma pasta com o nome richefaces-versão.richfaces no nosso caso ficou Richfaces-4.5.10
  16. 16. Instalando o RichFaces Passo 5: Copie os arquivos .jar que estão dentro da pasta lib que você baixou do site do richfaces. *obs: Apenas os .jar. Passo 6: Cole os arquivos que você copiou para dentro da pasta que você criou com o nome e a versão do seu richfaces. Passo 7: Abra novamente a pasta baixada do site do richfaces e copie os arquivos  richfaces-a4j-4.5.10.Final.jar  richfaces-core-4.5.10.Final.jar  richfaces-rich-4.5.10.Final.jar
  17. 17. Instalando o RichFaces Passo 8: Cole os arquivos que você copiou para dentro da pasta que você criou com o nome e a versão do seu richfaces. Passo 9: Abra o seu NetBeans e crie um novo projeto Arquivo → novo projeto
  18. 18. Instalando o RichFaces Passo 10: Escolha Java Web → Aplicação Web → próximo
  19. 19. Instalando o RichFaces Passo 11: Digite o nome do projeto e click em “usar pasta dedicada para armazenar bibliotecas” → próximo
  20. 20. Instalando o RichFaces Passo 12: Selecione o servodor apache tomcat, e a versão do java EE que você estará a ultilizar *obs: recomendamos sempre o java mais recente. → próximo
  21. 21. Instalando o RichFaces Passo 13: Selecione Java Server Faces → componentes → mais → criar biblioteca Em nome da biblioteca coloque “Richfaces-versão”→ ok
  22. 22. Instalando o RichFaces Passo 14: Adicionar JAR/Pasta → navegue até onde você criou a pasta contendo as bibliotecas Necessarias para o Richfaces funcionar, selecione todos os arquivos contidos nesta pasta, click em ok depois em finalizar.
  23. 23. Instalando o RichFaces Passo 15: Abra o projeto → biblitecas, botão direito, → adcionar biblioteca → importar, encontre o nome da biblioteca que você criou e pronto seu RichFaces está instalado com sucesso.
  24. 24. O uso de Managed Beans O JSF (Java Server Faces) trabalha diretamente com algo chamado de ManagedBean para fazer o “link” entre as regras de negócio da sua aplicação (geralmente DAO e etc) com a View (html, xhtml e assim por diante). O que é um Bean? Java Bean nada mais é do que o nome dado a uma forma específica de escrever classes Java, é um padrão. Basicamente um Bean é uma classe que:  tem um construtor publico sem parametros  para cada atributo privado existe um método 'set' para atribuir um valor ou referencia e um método 'get' para obter um valor ou referencia.
  25. 25. O uso de Managed Beans Desta forma o comparando uma um projeto que usa MVC o bean atuaria como o C (controller) de nossa aplicação, deixando a view limpa e a regra de negocios por conta do Bean. Eles são os responsáveis por intermediar a comunicação entre nossas páginas e o nosso modelo. Sendo assim o Managed Bean funciona como uma classe que delega funções, pois a nossa View não sabe quem vai salvar, alterar ou deletar, essa é a função do Managed Bean que passa ao nosso DAO (Data Access Object) a tarefa de salvar, deletar ou alterar algum registro.
  26. 26. O uso de Managed Beans A view usando o Managed Beans <h:body> <rich:panel header="Cadastro de Cidade"> <h:form > <h:panelGrid columns="2"> Nome:<h:inputText style="width: 200px;" id="nome" value="#{cidadeManager.nome}"></h:inputText> Estado:<h:inputText style="width: 200px;" id="sobrenome" value="#{cidadeManager.id_estado}"></h:inputText> </h:panelGrid><br/><br/> <h:commandButton style="margin-left: 113px;" value="Salvar" action="#{cidadeManager.salvar()}"></h:commandButton> <h:commandButton value="Pagina Principal" onclick="formularios/index.xhtml" ></h:commandButton> </h:form> </rich:panel> </h:body>
  27. 27. O uso de Managed Beans O Maneged Bean int id_cidade; public int getId_cidade() { return id_cidade; } public void setId_cidade(int id_cidade) { this.id_cidade = id_cidade; } public void salvar() throws SQLException { cidade c = new cidade(); cidadeDAO dao = new cidadeDAO();
  28. 28. O uso de Managed Beans Desta Forma temos uma view limpa e um projeto dentro dos padrões
  29. 29. Referências Richfaces. Disponível em: <http://richfaces.jboss.org/ >. Acesso em 24 de outubro de 2015. Richfaces live demo. Disponível em: <http://livedemo.exadel.com/richfaces-demo/ >. Acesso em 24 de outubro de 2015. GUJ. Disponível em: <http://www.guj.com.br/java/28219-o-que-e-um-javabean />. Acesso em 17 de novembro de 2015. Javafree. Disponível em: <http://javafree.uol.com.br/topic-886305-Nao-entendo-o-que-e-um-Bean.html />. Acesso em 17 de novembro de 2015.
  30. 30. Referências GUJ. Disponível em: <http://www.guj.com.br/java/224363--conceitual--quem-es-tu-managed-bean-no-mvc- />. Acesso em 17 de novembro de 2015. Devmedia. Disponível em: <http://www.devmedia.com.br/introducao-ao-jsf-managed-bean/29390 />. Acesso em 17 de novembro de 2015. Rafael Ponte "TEAM = Together Everyone Achieves More. Disponível em: <http://www.rponte.com.br/2009/08/27/managed-beans-nao-complique-simplifique/ >. Acesso em 17 de novembro de 2015.
  31. 31. Referências JBossDeveloper. Disponível em: <https://developer.jboss.org/wiki/richfaceswikihomepage />. Acesso em 17 de novembro de 2015. StackOverflow. Disponível em: <http://pt.stackoverflow.com/questions/22444/o-que-%C3%A9-e-para-que-serve-um-java-bean />. Acesso em 17 de novembro de 2015. IBM developerWorks. Disponível em: <http://www.ibm.com/developerworks/br/library/j-richfaces4/ />. Acesso em 17 de novembro de 2015.

×