Styling

Servoy offers a layered mechanism of styling the UI of solutions, with the options slightly differing for Smart Clients and Web Clients. 

Smart Client Styling

Servoy Smart Clients are Java Swing applications and Java Swing has the concepts of Look And Feels (LAFs) that can be applied on all Swing components.

Servoy supports using Java Swing Look and Feels out of the box.

About Java Swing Look and Feels

Java Swing Look and Feels come in two variaties:

• Cross platform Look And Feels
• Platform specific Look And Feels

Cross platform Look And Feels aim to provide the exact same UI regardless the platform, for example Windows, OSX or Linux, on which the LAF is used. 
Platform specific Look And Feels will only work on the platform they are designed for.

Java on each platform ships with at least a platform specific LAF, that is the default LAF used by the Servoy Smart Client. Java also ships 2 cross platform LAFS, Metal and Nimbus, of which Nimbus is the more modern LAF.

Themes

Some LAFs support multiple themes. 

Adding additional Look and Feels

Besides the LAFs that are shipped with Java itself, additional third party LAFs can be added to Servoy, by placing the LAF library in the {servoyInstall}/application_server/lafs directory.

 A word of caution on third party Look And Feels

There are many third party Look And Feels around for Java, both free/open source LAFs and commercial LAFs. The quality of these LAFs differs, so when opting to use a third party LAF, make sure to properly test the LAF in combination with the developed Solution in Servoy.

 Servoy partners with Centigrade, a company that provides User interface Design services and products, one of the products being a customizable Look and Feel that is fully compatible with Servoy. For more information, see the Centigrade website

Specifying the default Look And Feel for Smart Clients

The Smart Client Settings  on the Servoy Application Server allow the configuration of the default LAF for all Smart Clients, through the 'selectedlnf' property. This property needs to be set to the className of the Look And Feel class. When the classNAme is unknown, it can be retrieved by calling the following function in a Smart Client, after manually selecting the LAF in the Smart Client Preferences:

var laf = Packages.javax.swing.UIManager.getLookAndFeel() 
application.output(laf.getClass().getName())  

Not every LAF is supported on every platform. Notoriously the OSX platform is limited in the supported LAFs. It is therefor possible to exclude the Smart clients started on OSX from getting the supplied LAF, using the 'pushLnfToMac' setting.

If the LAF supports themes, the default theme to use can be specified through the 'lnf.theme' setting.

Manually changing the Look And Feel in a Smart Client

Through the Preference panel in the Smart Client, users can select the Look and Feel of their liking. The Preference panel is accessible through Edit > Preferences > Look and Feel.

Access to the Preference panel by the user can be removed using the window plugin , that allows to remove the Preference menuitem in the Edit menu

Web Client Styling

OS/Browser Level

Smart Client Look and Feel with optional Themes, depending on the Look and Feel

Servoy StyleSheets within the solution

Object properties

OS level >>

>> SC: LAF > CSS > Property > Scripting

>> WC: Default StyleSheet > CSS > Property > Scripting (optionally: Templating)

Supported CSS

Web Client Templating

onRender event

Admin page properties related to Styling

Java Look And Feel's (LAFS)

3rd Party LAFS

Explain the options:

- Platform is the highest level

- WC: browser > Default Web Client StyleSheet, SC: LAF > Theme

- Servoy StyleSheets

- Element Properties

- Runtime settings

Special Web Client:

- WEBDAV templates

Special Smart Client:

- Hacking UI properties: http://www.servoycamp.com/topics/tips/117-tuning-your-servoy-look-a-feel.html