Criando Skin para JBoss Rich Faces

Um breve passo-a-passo de como desenvolver e configurar um SKIN para o Rich Faces.

Passo 1:

Crie um arquivo com o nome do seu skin, é necessário seguir a especificação de nomeclatura: <name>.skin.properties. Como exemplo pode verificar os skins predefinidos do Rich Faces, no pacote richfaces-impl-xxxx.jar dentro da pasta /META-INF/skins.

No meu caso criei o arquivo yross.skin.properties, copiei as chave/valor do skin blueSkyskin.properties para o meu skin.

Passo 2:

Adicione uma tag <context-param> no arquivo web.xml de sua aplicação. Exemplo:

<context-param>
   <param-name>org.richfaces.SKIN</param-name>
   <param-value>name</param-value>
</context-param>

Passo 3:

Coloque seu arquivo em um dos elementos diretórios: META-INF/skins ou no classpath de sua aplicação.

Em meu caso coloquei dentro da pasta de recursos, ficando:

Aplicação\src\yross.skin.properties

Passo 4:

Os componentes do rich faces são modelados por CSS, como exemplo, vamos modificar a barra de cabeçalho de um </rich:panel>:

#Colors
headerBackgroundColor=#3fa989
headerGradientColor=#00956b
headerTextColor=#FFFFFF
headerWeightFont=bold

Observação:  Como comentado o arquivo é composto por chave/valor, onde as chaves representam as classes CSS, a definição dos nomes destas classes podem ser encontradas dentro dos documentos de referência do JBoss Rich Faces.

Passo 5:

Estamos prontos para usar o skin, reconstrua sua aplicação no cônteiner e desfrute do novo visual.

11 Respostas

  1. Muito bom o post.

  2. Muito bom!!

  3. [...] Criando Skin para Rich Faces « YRoss (tags: richfaces) [...]

  4. Obrigado ajudou a entender como funciona estes skin’s

  5. Parabéns!!!!
    de uma forma simples e rápida vc mostrou como é fácil criar um skin vlw

  6. Você deveria escrever a documentação hehehehe
    Valeu mesmo!

  7. Ola Ythalo Rossy!

    Muito bom, mais fiquei com uma duvida criei meu skin como você indicou mais não consegui entender como fazer com que minha aplicação o identifique. No web xml coloquei o nome do novo skin.

    org.richfaces.SKIN
    TopBoats

    Agora onde devo colocar o arquivo para que minha aplicação o reconheça.

    • Olá Andre,

      Basta colocar o arquivo topboats.skin.properties dentro de um diretório que esteja disponivel no classpath da tua aplicação, por exemplo, dentro do src.

      No web.xml basta adicionar o parametro de contexto abaixo:

      org.richfaces.SKIN
      topboats

      Att. =)

  8. [...] Criando Skin para JBoss Rich Faces outubro, 2008 10 comentários 3 [...]

Deixe uma resposta

Preencha os seus dados abaixo ou clique em um ícone para log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Sair / Alterar )

Imagem do Twitter

You are commenting using your Twitter account. Sair / Alterar )

Foto do Facebook

You are commenting using your Facebook account. Sair / Alterar )

Connecting to %s

Seguir

Obtenha todo post novo entregue na sua caixa de entrada.

Join 233 other followers