22 de julho de 2012

PrimeFaces 3.3: Começando...

Vamos começar criando um projeto básico do básico. Para os exemplos futuros, estarei usando o NetBeans 7.1 e o GlassFish 3.1.1. Então crie uma Aplicação Web no netBeans, caso não saiba como fazer isso, veja aqui
Para baixar o PrimeFaces, clique aqui, basta selecionar a versão que quer utilizar, estarei usando a versão 3.3, irei aguardar um pouco para testar a 3.3.1.

A estrutura do projeto será a seguinte:

Depois de criado o projeto, adicione a biblioteca do PrimeFaces no projeto (para fazer isso, botão direito em Bibliotecas e Add jar/pasta, e encontre a biblioteca que foi baixada).

Aproveitando a página index.xhtml (criada automaticamente ao criar o projeto), vamos adicionar a namespace do PrimeFaces na tag html: 

xmlns:p="http://primefaces.org/ui"

A página deverá ficar dessa forma:

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>Start com PrimeFaces 3.3</title>
    </h:head>
    <h:body>
        <h:form>
            <p:editor />
        </h:form>
    </h:body>
</html>

Lembrando que para o PrimeFaces funcionar, é extremamente necessário que haja a tag head. para este exemplo, apenas utilizei o componente p:editor, o resultado é o seguinte:


Como eu falei, esse é só o começo de como usar o PrimeFaces...


Temas


Quanto aos temas, podem ser visualizados aqui: Temas PrimeFaces. e podem ser baixados pelo repositório do próprio Prime, aqui. Para baixar um tema escolha-o pelo nome na galeria de temas, e o procure no repositório, aconselho utilizar a ultima versão, a maioria dos temas se encontram (até o momento da postagem) na versão 1.0.6.
Depois e escolhido o tema, adicione às bibliotecas juntamente com a biblioteca do PrimeFaces, e no WEB-INF/web.xml, adicione as seguintes tags:
<context-param>  
    <param-name>primefaces.THEME</param-name>  
    <param-value>bluesky</param-value>  
</context-param> 

Para este exemplo, escolhi a biblioteca Bluesky, por isso dentro da tag param-value deve ser colocado o nome do tema, sem a versão.
Para quem deseja ter seu próprio tema, use o JQuery UI - ThemeRoller, para saber como utilizar seu próprio tema, veja o final desta postagem.

Até mais!

20 comentários:

  1. legal andi, qual sera o projeto que iremos desenvolver aqui?

    ResponderExcluir
  2. Como havia falado pelo grupo, não teremos um foco em um projeto, apenas componentes tipo fileupload, schedule... e assim por diante.

    ResponderExcluir
  3. Olá andii tudo bem ?

    Leio seu blog a bastante tempo e tem me sido muito util principalmente em tirar algumas duvidas sobre o primefaces.

    Espero que você faça um post relacionado ao uso do Schedule do Prime...

    Abraços.

    ResponderExcluir
    Respostas
    1. Olá Sir. Gates!
      Schedule é um dos próximos posts sim, acho ele um componente fantástico, mas já adianto que não está fácil "desvendar" tudo sobre ele, mas se eu não conseguir, passo apenas o básico sobre ele!

      Excluir
    2. Olá anddii,

      Bom para mim foi dificil lidar com este componente, tanto que acabei desistindo dele.Mas vou aguardar ancioso pelo seu post.

      Abraços

      Excluir
  4. ola, sou novo por aqui e ja estou encontrando dificuldades pois o poste é para netbeans e eu uso linux com eclipse, tem como fazer um poste ou me indicar um que seja para eclipse, gostaria de rodar jsf, primefaces e hibernate no eclipse, porem as tags p: e h: nao tem o autocomplete. e de tanto ler acabou confundindo minha mente pois cada hora um diz uma coisa, web.xml, é para adicionar as libs, é para mexer no tomcat, e por ai vai... obrigado!

    ResponderExcluir
    Respostas
    1. Olá Lettus... olha, faz muito tempo que eu não mecho com o eclipse, mas acabei escolhendo o Netbeans por ser bemmm mais prático, e por conta do GlassFish, até tentei usar o eclipse, mas também tive muita dificuldade no começo e parti para o netbeans.

      Excluir
  5. Olá, tive que usar uma solução diferente, dessa forma eu não consegui resolver... mas consegui assim:
    private void carregarImagem(Pessoa p) {
    try {
    FacesContext facesContext = FacesContext.getCurrentInstance();
    ServletContext scontext = (ServletContext) facesContext.getExternalContext().getContext();
    if (p.getFoto() != null) {
    String nomeArquivo = p.getCodigo().toString() + ".jpg";
    String arquivo = scontext.getRealPath("/temp/pessoas/" + nomeArquivo);
    FileOutputStream fos;
    fos = new FileOutputStream(arquivo);
    fos.write(p.getFoto());
    fos.close();
    }
    } catch (IOException e) {
    e.printStackTrace();
    }
    }

    e chama assim:
    p:graphicImage value="/temp/pessoas/#{pessoaBean.pessoa.codigo}.jpg"


    Obs: você vai ter que passar a lista que preenche o dataGrid por um for, e chamar esse método.

    ResponderExcluir
  6. Respostas
    1. Calma frioli, a partir dessa semana devo voltar a escrever, não estou mais trabalhando durante o dia, agora eu tenho tempo!!

      Excluir
  7. Faz um post sobre o datatable do prime 3, a implementação dele é diferente do 2.0 principalmente quando usa o selecition mode

    ResponderExcluir
  8. Ola Andii ... baixei o tema no caso bluesky-1.0.8.jar coloquei na pasta lib ... adicionei o jar no projeto ... inseri a linha no web.xml porem aparece o seguinte erro :

    javax.faces.FacesException: Error loading theme, cannot find "theme.css" resource of "primefaces-bluesky" library

    Poderia me ajudar com isso?

    Muito obrigado.

    []s

    ResponderExcluir
    Respostas
    1. Desculpa a demora pra responder, mas acredito que vc esteja colocando o param-value como primefaces-bluesky e não apenas bluesky que é o correto.

      Excluir
  9. Tentei seguir o tutorial, pois preciso apresentar um trabalho na terça feira sobre o primefaces. Quero mostrar a codificação, mas tá dando erro. Aparece simplesmente erro 404 e as mensagens:

    HTTP Status 404 -

    type Status report

    message

    descriptionThe requested resource () is not available.

    GlassFish Server Open Source Edition 3.1.2.2

    O que pode estar acontecendo. Se puder me ajudar, ficarei grato! :D

    ResponderExcluir
    Respostas
    1. Pedro, como vc está chamado a página no navegador? pois o erro 404 é de página não encontrada

      Excluir
  10. Olá amigo, gostaria uma opinião.


    Desenvolvo em Java e Flex,

    Gostaria de aprender algo novo se tratando de RIA.

    O PrimeFaces seria uma boa escolha?
    Poderia opinar?

    Origado.

    ResponderExcluir
    Respostas
    1. Olá Tiamati, então eu sou suspeita para falar sobre o primefaces rsrs pois pra mim ele sempre foi super útil, mas já trabalhei com richfaces e não gostei, por isso entrei nessa do primefaces.

      Excluir
  11. Se você teve problemas financeiros, então é hora de sorrir. Você só precisa contatar o Sr. Benjamin com a quantia que deseja emprestar à baixa taxa de 2% de ROI e o período de pagamento que lhe convém e você terá seu empréstimo dentro de três dias úteis. Acabei de me beneficiar pela sexta vez de um empréstimo de 700 mil dólares por um período de 180 meses com a possibilidade de pagar antes da data de vencimento. O Sr. Benjamin tem me ajudado com o empréstimo. Faça contato com ele e você verá que ele é um homem muito honesto e de bom coração. Seu e-mail é 247officedept@gmail.com e seu número de telefone WhatApp é + 1-989-394-3740 .

    ResponderExcluir

Deixe seu comentário... ;)