Aparência das paginas (jsf + facelets + richfaces)

Alguém por favor :roll: !!

Cara… é só você criar um conjuto de CSSs para a sua aplicação toda…

Você pode mudar o CSS dos componentes Richfaces sem problemas.

Valeu!

Obriga pela atenção haamilton

Mas pelo que eu entendi pesquisando, foi que o richfaces usas “skins”… e entendi que podemos criar nossos próprios skins… mas é possivel mudar a aparencia normal dos componentes apenas com um arquivos css normal? Ta certo que os skins do richfaces usam css também… mas é possivel mudar a aparencia sem sem o uso de skin (.skin.properties) ?

Não sei se to conseguindo er muito claro com minha duvida :x

Valeu!!

Tem sim…

Boa parte (senão todas) das tags do Richfaces possuem atributos como styleClass e style para você colocar o seu próprio CSS. Eu uso isso quando eu quero mudar o CSS de um componente específico.

Agora, se você quer com que os componentes Richfaces combinem com o seu layout, acredito que a melhor opção é criar o seu próprio SKIN.

Na documentação do Richfaces tem os passos para criar um novo skin…

Qualquer dúvida, é só avisar…

Valeu!

Boa parte (senão todas) das tags do Richfaces possuem atributos como styleClass e style para você colocar o seu próprio CSS. Eu uso isso quando eu quero mudar o CSS de um componente específico.

Era essa a minha dúvida… bom agora será que tem como me mostrar um exemplo de uso? Assim… oque que tem que ter definido no css pra podermos aplicar no componente? Tipo… pelo que eu vi nos skins, existem propriedades especificas para cor de bordas, cores de fontes, tamanho… isso deve ser definido no css com os mesmos “nomes” de propriedades que tem nos arquivos .properties dos skins?

Por exemplo: no skin blueSky tem uma propriedade headerSizeFont com um valor definido como 11px. No meu arquivo css normal eu teria uma classe que teria essa mesma propriedade definida para poder usar esse estilo em um componente? Desculpe se não fui muito claro…

Eu nunca mexi muito com essa parte de design, e to meio perdido ainda… mas preciso muito aprender pra avança nos meu estudos.

Obrigado pela atenção.

Abraços!

E ae…

Então… você vai ter que ver o que tem nos CSSs de cada componente e seguir a mesma estrutura e customizar as propriedades que achar necessário.

Na documentação das tags do RichFaces ele mostra as propriedade que devem ser alteradas para fazer a customização. Na documentação para cada componente existe um item Look-and-Feel Customization que diz o que deve ser alterado.

De uma olhada na documentação… ela é bastante explicativa…

Abraço!

Cara… realmente a documentação é muuuuito legal. Obrigado

Mas lendo assim por cima… os componente não diz as propriedades que podem ser customizadas… por exemplo < a4j:commandButton > … mas beleza… vo da uma pesquisada e fazer uns testes.

Mais uma coisa. Usar skins para os componentes do richfaces e um outro css para os demais componentes tanto do jsf como html é uma boa? Manter dois arquivos para “cuidar da aparencia” é uma boa idéia?

Muito obrigado cara… já me ajudou um monte

Abraços!

Caras, umas outras perguntas hehe…

O que é mais comum? Criar um skin próprio ou usar um css pra modificar a aparencia dos componentes?
Ou oque é mais facil pra manter depois? O skin ou o arquivo css?

E uma duvida “boba”: qual a diferença dos atributos/parametros style e styleClass das tags dos componentes?

Obrigado pela ajuda!!

Bom dia!

Bom… eu prefiro criar os meus CSS para alterar estilos específicos dos componentes. Eu prefiro ter um CSS para cada parte, um para HTML, outro para os componentes, etc…
Eu prefiro dessa forma porque fica tudo separado, para mim, fica mais fácil para dar manutenção.

A diferença entre style e styleClass:

• style: são os estilos aplicados diretamente ta tag, sem precisar de um class.
• styleClass: você precisa ter uma classe para aplicar os estilos nas tags.

Valeu!

Olá!!

Eu axo que farei o mesmo também, pois como to iniciante nessa parte de css, axo muito mais facil “ler” um arquivo css do que o arquivo .skin.properties do richfaces…

Obrigado mais uma vez haamilton.

Cara, eu to conseguindo mudar os estilos dos componentes, mas me surgiu uma dúvida que não to conseguindo solucionar.

Tenho uma rich:toolBar e nela alguns (3) rich:dropDownMenu/, e dentro destes alguns rich:menuItem/.

Consegui modificar toda a aparencia do menu que eu to montando, menos uma parte. Quando clicamos em um item na toolbar, abre varios menuItems. Como que eu faço pra mudar a cor do fundo, ou retirar completamente a parte onde deveria ficar os icones dos links? É aquela barra que fica bem a esquerda do dropdownmenu. Tentei varias formas, mas nenhuma obtive resultado. Tentei sobreescrever os estilos do dropdownmeu, da toobar e dos menuItems, mas não encontrei o que “cuida” dessa parte do css.

Agradeço por qualquer ajuda.

Estou com um problema quero usar Richfaces e facelets.

coloquei no xhtml : xmlns:rich=“http://richfaces.org/rich”

dentro do arquivo xhtml chamo o compomente richfaces: <rich:calendar></rich:calendar>

mais dentro dos componente richfaces não tenho acesso aos atributos, so tendo acesso ao atributo id, estou usando
facelets 1.1.14 e richfaces 3.3.0

Como esta :<rich:calendar></rich:calendar>

Como deveria esta <rich:calendar converter="" currentDate="" dayStyleClass=""> </rich:calendar>

Desde ja agradeco a todos.