JavaFX: Button: Background color chooser program

In this post, we are going to develop an application, that displays buttons on a scene and depends on the button click, respective color is set as scene background.

 

bgColorChooser.fxml

<?import javafx.scene.*?>
<?import javafx.scene.shape.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.effect.*?>
<?import javafx.scene.control.*?>

<VBox xmlns:fx="http://javafx.com/fxml" fx:controller="com.sample.app.widgets.controller.BgColorChooserController"
	fx:id="vBox1" spacing="20" alignment="center">
	
	<HBox fx:id="lableHBox"> 
		<Label fx:id="label1" text="Click on a button to reflect the same background color" wrapText="true"/>
	</HBox>
	
	<HBox fx:id="colorChooserHBox">
		<Button fx:id="red" text="red"/>
		<Button fx:id="green" text="green"/>
		<Button fx:id="blue" text="blue"/>
		<Button fx:id="azure" text="azure"/>
		<Button fx:id="aqua" text="aqua"/>
		<Button fx:id="black" text="black"/>
		<Button fx:id="brown" text="brown"/>
		<Button fx:id="lightsalmon" text="lightsalmon"/>
	</HBox>
	
	
</VBox>

 

BgColorChooserController.java

package com.sample.app.widgets.controller;

import java.net.URL;
import java.util.Iterator;
import java.util.ResourceBundle;

import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.geometry.Insets;
import javafx.scene.Node;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.effect.DropShadow;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.FontPosture;

public class BgColorChooserController implements Initializable {

	@FXML
	private Button red;

	@FXML
	private VBox vBox1;

	@FXML
	private HBox colorChooserHBox;

	@FXML
	private Label label1;

	@Override
	public void initialize(URL location, ResourceBundle resources) {

		DropShadow dropShadow = new DropShadow();
		dropShadow.setOffsetX(5);
		dropShadow.setOffsetY(5);
		dropShadow.setColor(Color.GRAY);

		vBox1.setEffect(dropShadow);

		colorChooserHBox.setSpacing(10);
		colorChooserHBox.setPadding(new Insets(20, 20, 20, 20));

		Font font = Font.font("Verdana", FontPosture.REGULAR, 25);

		Iterator<Node> nodes = colorChooserHBox.getChildren().iterator();
		while (nodes.hasNext()) {
			Node node = nodes.next();

			if (node instanceof Button) {
				Button button = (Button) node;

				button.setFont(font);

			}
		}

		label1.setFont(Font.font("Verdana", FontPosture.REGULAR, 50));
		label1.setPadding(new Insets(20, 20, 20, 20));

		nodes = colorChooserHBox.getChildren().iterator();

		while (nodes.hasNext()) {
			Node node = nodes.next();

			if (node instanceof Button) {
				Button button = (Button) node;
				button.setOnAction((event) -> {

					vBox1.setStyle("-fx-background-color:" + button.getText());
				});
			}
		}

	}
}

 

BgColorWidgetDemo.java

package com.sample.app.widgets;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class BgColorWidgetDemo extends Application {

	private static final String FXML_FILE = "/bgColorChooser.fxml";
	private static final String STAGE_TITLE = "Choose background color";

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

	}

	@Override
	public void start(Stage primaryStage) throws Exception {

		Parent root = (Parent) FXMLLoader.load(this.getClass().getResource(FXML_FILE));

		Scene scene = new Scene(root, 1000, 600, Color.WHITE);

		primaryStage.setTitle(STAGE_TITLE);
		primaryStage.setScene(scene);
		primaryStage.show();
		
		//Color.
	}

}

 

 

Click on any button, respective color will be set as background. For example, I clicked lightsalmon button, screen changes like below.

 

 

Previous                                                    Next                                                    Home