Intersult: Primefaces

Primefaces Buttons#

Beim Verwenden von Primefaces werden <h:inputCommand> und native HTML-Buttons nicht im Primefaces-Style dargestellt. Folgende Einträge korrigieren dies (zumindest für Primefaces 3.3):

Im pom.xml die jsf-ext eintragen, wie in JSF Ext beschrieben.

Ins Page-Template folgenden Eingrag am Ende des Body-Tags vornehmen:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	...
	<h:head id="head">
            ...
	</h:head>
	<h:body id="body">
            ...
		<h:outputStylesheet name="prime-buttons.css" library="css"/>
		<h:outputScript name="prime-buttons.js" library="ext-js"/>
	</h:body>
</html>

Danach erscheinen alle <h:commandButton> und andere Buttons im Primefaces Style.

Skins#

Skins können inzwischen über Maven konfiguriert werden. In der pom.xml:

		<dependency>
			<groupId>org.primefaces.themes</groupId>
			<artifactId>sunny</artifactId>
			<version>1.0.8</version>
		</dependency>

Und dann nur noch in der web.xml auswählen:

	<context-param>
		<param-name>primefaces.THEME</param-name>
		<param-value>sunny</param-value>
	</context-param>

Custom Themes#

Da Primefaces auf JQuery aufbaut, kann der Online-Theme-Konfigurator

für die Skins verwendet werden. Aus dem heruntergeladenen ZIP wird das Verzeichnis custom-theme nach <web-root>/resources/skins/<theme>/ kopiert, sodass sich darin /images und /jquery-ui-1.9.1.custom.css befindet. Die CSS-Datei braucht dann nur noch im Page-Template eingebunden werden:

<h:outputStylesheet name="jquery-ui-1.9.1.custom.css" library="skins/<theme>"/>