Java Reference
In-Depth Information
width: w
height: h
content: [Group{ layoutX:10 content:panel}]
stylesheets: bind ["{__DIR__}{cssFile}"]
The application uses two separate CSS files. One is named bluemoon.css and applies a
blue theme to all controls on the form. Autumn.css applies a Fall-colored theme to objects
that use its styles. We are not going to show the CSS files here. To get a full listing of the
CSS files, refer to ch04/source-code/src/styling/bluemoon.css and ch04/
source-code/src/styling/autumn.css .
The next screenshot shows the application using both themes:
How it works...
This recipe presents the technique to create a skinnable application using JavaFX CSS. The
skin is implemented using CSS style directives encapsulated in a file. For our recipe, we
use two CSS files bluemoon.css and autumn.css . Each CSS file has the same styling
elements. However, each applies a different theme based on color. The bluemoon.css ile
uses the blue family of colors to style its components. The autumn.css file uses the same
CSS elements, but paints everything using Fall-color theme (browns, gold, orange, and so on).
The application lets users select between the two stylesheets to update the skin for the
application. In the code, we declare the variable cssFile to store the name of the currently
applied CSS file. When the user clicks on the button labeled Bluemoon.css it sets the variable
cssFile = "bluemoon.css" . When the user clicks on the button labeled Autumn.css it
sets cssFile = "autumn.css" .
Search WWH ::

Custom Search