o7planning

JavaFX ColorPicker Tutorial with Examples

  1. JavaFX ColorPicker
  2. ColorPicker example

1. JavaFX ColorPicker

JavaFX ColorPicker is a typical user interface component that enables users to select a particular color from the available range, or set an additional color by specifying an RGB or HSB combination.
Color customize window helps you to set up more colors.
Here are the components of the ColorPicker:
Custom Color Dialog window
Color Chooser
Color Chooser is similar to a MenuButton. When users click on it, a Palette will be displayed so that users can choose the color. You can also set up Style that allows Color Chooser to display interface similar to SplitMenuButton. Note that the Color Chooser is neither a MenuButton nor SplitMenuButton but they is just the same as the interface.
// Sets color-chooser button interface similar SplitMenuButton
colorPicker.getStyleClass().add("split-button");

// Sets color-chooser button interface similar MenuButton
colorPicker.getStyleClass().add("button");
See more MenuButton & SplitMenuButton:

2. ColorPicker example

ColorPickerDemo.java
package org.o7planning.javafx.colorpicker;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.ColorPicker;
import javafx.scene.layout.FlowPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;

public class ColorPickerDemo extends Application {

    @Override
    public void start(Stage stage) {

        final ColorPicker colorPicker = new ColorPicker();
        colorPicker.setValue(Color.RED);

        final Circle circle = new Circle(50);
        circle.setFill(colorPicker.getValue());

        colorPicker.setOnAction(new EventHandler<ActionEvent>() {

            @Override
            public void handle(ActionEvent event) {
                circle.setFill(colorPicker.getValue());
            }
        });

        FlowPane root = new FlowPane();
        root.setPadding(new Insets(10));
        root.setHgap(10);
        root.getChildren().addAll(circle, colorPicker);

        Scene scene = new Scene(root, 400, 300);

        stage.setTitle("JavaFX ColorPicker (o7planning.org)");

        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

}

JavaFX Tutorials

Show More