Primefaces
Your trail: 

This page (revision-10) was last changed on 02-Sep-2014 15:02 by Dieter Käppel

This page was created on 23-Oct-2012 13:57 by Dieter Käppel

Only authorized users are allowed to rename pages.

Only authorized users are allowed to delete pages.

Page revision history

Version Date Modified Size Author Changes ... Change note
10 02-Sep-2014 15:02 2 KB Dieter Käppel to previous
9 02-Sep-2014 15:02 1 KB Dieter Käppel to previous | to last
8 04-Jan-2013 02:12 1 KB Dieter Käppel to previous | to last
7 02-Nov-2012 20:44 1 KB Dieter Käppel to previous | to last
6 02-Nov-2012 20:44 1 KB Dieter Käppel to previous | to last
5 02-Nov-2012 14:30 1 KB Dieter Käppel to previous | to last
4 02-Nov-2012 14:23 1 KB Dieter Käppel to previous | to last
3 02-Nov-2012 14:17 950 bytes Dieter Käppel to previous | to last
2 02-Nov-2012 13:58 1 KB Dieter Käppel to previous | to last
1 23-Oct-2012 13:57 1 KB Dieter Käppel to last

Page References

Incoming links Outgoing links
Primefaces
Primefaces

Version management

Difference between version and

At line 2 changed one line
[JSF Ext|JSF Ext#Primefaces Buttons] liefert CSS- und Javascript-Dateien zum Anpassen normaler Buttons an das Primefaces Layout.
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):
At line 4 changed 2 lines
!!!Skins
Skins können inzwischen über Maven konfiguriert werden. In der pom.xml:
# Im pom.xml die jsf-ext eintragen, wie in [JSF Ext|JSF Ext#Ext Konfiguration] beschrieben.
At line 7 changed 7 lines
{{{
<dependency>
<groupId>org.primefaces.themes</groupId>
<artifactId>sunny</artifactId>
<version>1.0.8</version>
</dependency>
}}}
# Ins Page-Template folgenden Eingrag am Ende des Body-Tags vornehmen:
At line 15 removed 2 lines
Und dann nur noch in der web.xml auswählen:
At line 18 changed 4 lines
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>sunny</param-value>
</context-param>
<?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>
At line 24 changed 44 lines
Oder man bindet das Theme im Page-Template ein:
{{{
<h:outputStylesheet name="theme.css" library="primefaces-<theme>"/>
}}}
!!Custom Themes
Da Primefaces auf JQuery aufbaut, kann der [Online-Theme-Konfigurator|http://jqueryui.com/themeroller/] für die Skins verwendet werden. Aus dem heruntergeladenen ZIP wird das Verzeichnis custom-theme nach <web-root>/resources/primefaces-<theme>/ extrahiert, sodass sich darin /images und /jquery-ui-1.9.1.custom.css befindet. /jquery-ui-1.9.1.custom.css wird nach theme.css umbenannt, damit Primefaces es findet. Oder eben wieder über die Anweisung <h:outputStylesheet>.
!!!Menu
Das Primefaces Menu unterstützt kein Behavior oder ActionEvent-Listener. Mit einem Workaround kann dies umgangen werden:
{{{
<p:menuitem>
<h:commandLink styleClass="ui-menuitem-link ui-corner-all">
<f:ajax/>
<h:outputText value="Scopes"/>
<e:load scopeId=":scopeList"/>
</h:commandLink>
</p:menuitem>
}}}
__Erklärung:__ Es wird ein <h:commandLink> innerhalb des <p:menuitem> platziert, der den Primefaces-Style enthält. Dieser unterstützt nun Behaviors und ActionEvents und sieht genauso aus.
!!!Datatable
Das Layout der Data-Tables kann mitunter etwas sperrig sein, weil sie sich nur bedingt an umgebende Container anpassen. Ein möglicher Fix besteht in CSS-Styles:
{{{
.ui-datatable table {
table-layout: fixed !important;
}
.ui-datatable .ui-column-filter {
width: 80px;
}
.ui-datatable tbody td, .ui-treetable tbody td {
padding: 3px 4px;
}
.ui-datatable thead th, .ui-treetable thead th {
padding: 3px 4px;
}
.ui-datatable tfoot td, .ui-treetable tfoot td {
padding: 3px 4px;
}
}}}
Danach erscheinen alle <h:commandButton> und andere Buttons im Primefaces Style.
This page (revision-10) was last changed on 02-Sep-2014 15:02 by Dieter Käppel Top
Übersicht
Startseite
Das Unternehmen
Produkte
Consulting
Referenzen

Jobmarkt
Jobangebote
Profile

Hilfe
Suche
Seitenindex
Letzte Änderungen
Sichere Verbindung

Systeme
Tickets
Jenkins
Nexus
SVN
Email Client
4784 Aufrufe

referenziert von
JPA Support
JSF Ext
Jsf ext

© 2022 Intersult GmbH | Jobs | Kontakt | Presse | AGB | Impressum | Cookies | Datenschutz | Serverzeit 2024.11.21 23:10:31 GMT