How to use the ColorPicker in JavaFX

Contents

How to use the ColorPicker in JavaFX

The ColorPicker in JavaFX is like a ComboBox in JavaFX , and DatePicker in JavaFX, because the JavaFX ColorPicker is a ComboBox style control that is designed for users to select a color from the color palette or use the custom color by dragging the picker. This node or control is very easy to use. You can use this node if your application needs a color picker.

In this tutorial, you will learn how to use the ColorPicker. I will walk you through creating the ColorPicker, display it on the scene graph, get the color value, and many more. There is also an easy way to create your GUI application in JavaFX and you can use the Scene Builder to create your Graphical User Interface (GUI). Create a JavaFX project using the FXML-based application and that’s it.

JavaFX ColorPicker Examples

The examples below will teach you how to use the ColorPicker JavaFX. The first example will be creating the color picker. This control has two constructors you can use. One of them is the default constructor and the other one takes the initial color if you initially input a color when you create the color picker. Please see the example code below to learn more about color picker.

Create a ColorPicker JavaFX

To create the ColorPicker, you need to make an instance of the ColorPicker class. Creating an instance is really easy since there are two types of constructors in ColorPicker. The following example code below will show you how it works.

// Default constructor of ColorPicker
ColorPicker colorPicker = new ColorPicker();

// ColorPicker with initial color.
ColorPicker colorPicker = new ColorPicker(Color.BLUE);

Add the ColorPicker to the Scene Graph

To add this node to the scene graph, you must know how to use the layout in JavaFX and if you are developing an FXML-based application, you need to use the FXMLLoader to show or display your JavaFX application. The following example below will show you how to add the node to the scene graph.

//Create the colorpicker
ColorPicker colorPicker = new ColorPicker();

// Create the Layout
StackPane layout = new StackPane();
Scene scene = new Scene(layout, 400, 400);
layout.getChildren().add(colorPicker);
stage.setScene(scene);
stage.show();

Output

How to get the color in JavaFX ColorPicker

It is very easy to get the color in ColorPicker. Use the getValue() method to get the color value. The example code below will show you how to get the chosen color using the ColorPicker in JavaFX.

ColorPicker colorPicker = new ColorPicker();
colorPicker.getValue();

Set the background color

In this example, you will know how to set the chosen color in the background or something else. You can easily set the chosen color if you are using the shapes, you can use the setFill() method and if you want to change the background color of the layout like StackPane then the example code below will show you how to set the background color of the layout using the ColorPicker in JavaFX.

//create an action event of your color picker to make this work
private void colorPicker(){
   layout.setBackground(new Background(new BackgroundFill(colorPicker.getValue(), CornerRadii.EMPTY, Insets.EMPTY)));
}