### Set StyleClass using CSS

Changing the style of a ProgressBar using CSS file.
Reference: http://docs.oracle.com/javafx/2/api/javafx/scene/doc-files/cssref.html#progressbar
CSS File Example
.my-progress-bar .bar {
-fx-background-radius: 5;
}
.my-progress-bar .track {
-fx-background-radius: 5;
}
.my-progress-bar {
-fx-background-radius: 5;
}
.red-progress-bar .bar {
-fx-background-color: red;
}
.blue-progress-bar .bar {
-fx-background-color: blue;
}
.green-progress-bar .bar {
-fx-background-color: green;
}
Usage in B4J
Store the classes in files folder as f.e. CustomStyles.css.
Add the stylesheet to the form:
MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "CustomStyles.css"))
Add the styleclass to the ProgressBar View
ProgressBar1.StyleClasses.Add("my-progress-bar")
Usage in JavaFX SceneBuilder
Note that usage of the JavaFX SceneBuilder is not recommended, use the B4J Visual Designer instead.
• Open JavaFX SceneBuilder
• Add stylesheet CustomStyles.css to the main anchorpane
• Select the progressbar and assign a style class, like red-progress-bar.

Changed: , Category: ProgressBar, File: T6C232M1701.htm, ID: 1701