JavaFX: glowing icon button as an eye-catcher

Posted on July 16, 2012

At sLAB we use glowing icon buttons on the dashboard to get the users attention.

These buttons inform the user that there is some waiting work which has to be finished or some incoming messages are waiting.

Here is a little example:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32


@Override
public void start(Stage primaryStage) {
 
    final Image image = new Image(getClass().getResourceAsStream("button.png"));
    final Button button = new Button();
    button.setText("Title");
    button.setGraphic(new ImageView(image));
    button.setContentDisplay(ContentDisplay.TOP);
    button.setTextAlignment(TextAlignment.CENTER);
 
    final Glow glow = new Glow();
    glow.setLevel(0.0);
    button.setEffect(glow);
 
    final Timeline timeline = new Timeline();
    timeline.setCycleCount(Timeline.INDEFINITE);
    timeline.setAutoReverse(true);
    final KeyValue kv = new KeyValue(glow.levelProperty(), 0.3);
    final KeyFrame kf = new KeyFrame(Duration.millis(700), kv);
    timeline.getKeyFrames().add(kf);
    timeline.play();
 
    final FlowPane root = new FlowPane();
    root.setPadding(new Insets(10, 10, 10, 10));
    root.getChildren().add(button);
 
    final Scene scene = new Scene(root, 300, 250);
 
    primaryStage.setTitle("Hello Glowing Button!");
    primaryStage.setScene(scene);
    primaryStage.show();
}