更新时间:2021-07-09 21:12:44
coverpage
PrimeFaces Theme Development
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Support files eBooks discount offers and more
Preface
What this book covers
What you need for this book
Who this book is for
Conventions
Reader feedback
Customer support
Chapter 1. To Skin an App
Why we need to create an app
The PrimeFaces library
Creating a NetBeans Maven JSF project
Adding the PrimeFaces library and related dependencies to our project
Building the project
Running the project
Summary
Chapter 2. Introducing PrimeFaces Themes
The difference between standard JSF and PrimeFaces components
Adding additional PrimeFaces themes
The PrimeFaces ThemeSwitcher component
Creating the CurrentTheme Bean
Extending the ThemeService Bean
Creating a Facelets Template
Creating a Mini Showcase page
Adding buttons that change the theme without using ThemeSwitcher
Chapter 3. jQuery UI ThemeRoller and the Anatomy of a Theme
jQuery UI and its standard CSS rules
The difference between a layout and the look and feel of UI components
How PrimeFaces uses the jQuery UI CSS rules
Changing the initial font and font size
Creating a theme and downloading it
Comparing our theme to a PrimeFaces one
Packaging and adding our custom theme to the project
Adding the new theme to the ThemeSwitcher class
Chapter 4. A PrimeFaces inputText Component in Detail
Creating a new JSF page and adding a standard inputText component
Examining the UI element using the browser developer tool
Adding a PrimeFaces inputText component to the page and comparing these two elements
Turning a standard component into a PrimeFaces one
Chapter 5. Let's Get Creative
Creating a new JSF page
Using your unpackaged theme and applying it to your application
Changing the initial font and font size in your theme
Changing the foreground and background colors
Changing the highlighted active and selected CSS rules
Changing the rounding rules
Changing the shadow effects
Changing the menu background
Chapter 6. Icons
Introducing the standard theme icon set
Creating a set of icons of our own
Adding the new icons to your theme
Using custom icons in the commandButton components
Using custom icons in a menu component
The Font Awesome icons as an alternative to the ThemeRoller icons
Chapter 7. Dynamic Changes – a Working Example
Introducing the schedule component
A lack of skinning support for date and event selection
Creating a CSS rule to set the background color in an HTML element
Creating a JavaScript function to apply CSS rules to a specific HTML element
Executing a client-side JavaScript function from the server-side – the power of AJAX and RequestContext
Chapter 8. Mobile Web Apps
The demand of creating a powerful mobile website
Restrictions of real estate mobile device screens are simply smaller
Introducing PrimeFaces Mobile for JSF-based applications
The differences between PrimeFaces Mobile and normal PrimeFaces
Creating customized mobile themes – the power of jQuery Mobile ThemeRoller
Applying customized mobile themes to PrimeFaces Mobile
Chapter 9. The Final Touches
The PrimeFaces showcase
See what you don’t like in the showcase and apply the changes
See what you do like in the showcase and make everything look that way
Do the changes same way for PrimeFaces Mobile
Packaging your custom theme
Creating CSS files that provide variations on a theme
Chapter 10. Theme Design Best Practices
Introduction of WAI for good web design
Colors icon sets background and foreground
Fonts make the text stand out
Rich Internet applications versus desktop applications
Functions per page
Components you will be using
Some important PrimeFaces CSS classes
Going beyond the standard PrimeFaces theme
Override PrimeFaces CSS classes
Override specific component CSS styles