Academic Integrity: tutoring, explanations, and feedback — we don’t complete graded work or submit on a student’s behalf.

JAVA: Im new to GUI and have created this grid, but cant figure out how to add c

ID: 3744407 • Letter: J

Question

JAVA: Im new to GUI and have created this grid, but cant figure out how to add clickable buttons to all of the circles on the top row. Could someone show me how to do this? I dont need action listeners. Just clickable buttons for now. Thanks!

import javafx.application.Application;
import static javafx.application.Application.launch;
import javafx.scene.Scene;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.layout.GridPane;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Rectangle;
import javafx.scene.shape.Shape;
import javafx.stage.Stage;

public class Grid extends Application {

    private static final int TILE_SIZE = 80;
    private static final int COLUMNS = 6;
    private static int ROWS = 7;

    public static void main(String[] args) {
        //Stage stage = new Stage();
        //start(stage);
        launch(args);

    }

    @Override
    public void start(Stage primaryStage) {

        Shape shape = new Rectangle((COLUMNS + 2) * TILE_SIZE, (ROWS) * TILE_SIZE);
        for (int i = 0; i < ROWS; i++) {
            for (int i2 = 0; i2 < COLUMNS; i2++) {
                Circle circle = new Circle(TILE_SIZE / 2);
                circle.setCenterX(TILE_SIZE / 2);
                circle.setCenterY(TILE_SIZE / 2);
                circle.setTranslateX(i * (TILE_SIZE + 5) + TILE_SIZE / 4);
                circle.setTranslateY(i2 * (TILE_SIZE + 5) + TILE_SIZE / 4);
                shape = Shape.subtract(shape, circle);
            }
        }
        GridPane pane = new GridPane();
        pane.setAlignment(Pos.CENTER);
        pane.setPadding(new Insets(11.5, 12.5, 13.5, 14.5)); // pixel buffer layout
        pane.setHgap(5.5); // pixel per blocks
        pane.setVgap(5.5);

        pane.getChildren().addAll(shape);

        Scene scene = new Scene(pane);
        primaryStage.setTitle("GridPane"); // Set the stage title
        primaryStage.setScene(scene); // Place the scene in the stage
        primaryStage.show(); // Display the stage
    }

}

Explanation / Answer

Executable Code -:

import javafx.application.Application;

import static javafx.application.Application.launch;

import javafx.scene.Scene;

import javafx.geometry.Insets;

import javafx.geometry.Pos;

import javafx.scene.layout.GridPane;

import javafx.scene.shape.Circle;

import javafx.scene.shape.Rectangle;

import javafx.scene.shape.Shape;

import javafx.stage.Stage;

import javafx.event.ActionEvent;

import javafx.event.EventHandler;

import javafx.fxml.FXMLLoader;

import javafx.geometry.VPos;

import javafx.scene.Scene;

import javafx.scene.control.*;

import javafx.scene.layout.StackPane;

import javafx.scene.text.Font;

import javafx.scene.text.Text;

import javafx.scene.layout.AnchorPane;

import javafx.scene.layout.StackPane;

import javafx.scene.text.TextAlignment;

import java.io.*;

public class Grid extends Application {

private static final int TILE_SIZE = 80;

private static final int COLUMNS = 6;

private static int ROWS = 7;

public static void main(String[] args) {

//Stage stage = new Stage();

//start(stage);

launch(args);

}

@Override

public void start(Stage primaryStage) {

final Button bt1 = new Button("Button1");

bt1.setShape(new Circle(1.5));

bt1.setMaxSize(TILE_SIZE,TILE_SIZE);

final Button bt2 = new Button("Button2");

bt2.setShape(new Circle(1.5));

bt2.setMaxSize(TILE_SIZE,TILE_SIZE);

final Button bt3 = new Button("Button3");

bt3.setShape(new Circle(1.5));

bt3.setMaxSize(TILE_SIZE,TILE_SIZE);

final Button bt4 = new Button("Button4");

bt4.setShape(new Circle(1.5));

bt4.setMaxSize(TILE_SIZE,TILE_SIZE);

final Button bt5 = new Button("Button5");

bt5.setShape(new Circle(1.5));

bt5.setMaxSize(TILE_SIZE,TILE_SIZE);

final Button bt6 = new Button("Button6");

bt6.setShape(new Circle(1.5));

bt6.setMaxSize(TILE_SIZE,TILE_SIZE);

final Button bt7 = new Button("Button7");

bt7.setShape(new Circle(1.5));

bt7.setMaxSize(TILE_SIZE,TILE_SIZE);

Shape shape = new Rectangle((COLUMNS + 2) * TILE_SIZE, (ROWS) * TILE_SIZE);

for (int i = 0; i < ROWS; i++) {

for (int i2 = 0; i2 < COLUMNS; i2++) {

Circle circle = new Circle(TILE_SIZE / 2);

circle.setCenterX(TILE_SIZE / 2);

circle.setCenterY(TILE_SIZE / 2);

circle.setTranslateX(i * (TILE_SIZE + 5) + TILE_SIZE / 4);

circle.setTranslateY(i2 * (TILE_SIZE + 5) + TILE_SIZE / 4);

shape = Shape.subtract(shape, circle);

}

}

bt1.setTranslateX(TILE_SIZE / 4 + 0*(TILE_SIZE+5));

bt1.setTranslateY(-220);

bt2.setTranslateX(TILE_SIZE / 4 + 1*(TILE_SIZE+5));

bt2.setTranslateY(-220);

bt3.setTranslateX(TILE_SIZE / 4 + 2*(TILE_SIZE+5));

bt3.setTranslateY(-220);

bt4.setTranslateX(TILE_SIZE / 4 + 3*(TILE_SIZE+5));

bt4.setTranslateY(-220);

bt5.setTranslateX(TILE_SIZE / 4 + 4*(TILE_SIZE+5));

bt5.setTranslateY(-220);

bt6.setTranslateX(TILE_SIZE / 4 + 5*(TILE_SIZE+5));

bt6.setTranslateY(-220);

bt7.setTranslateX(TILE_SIZE / 4 + 6*(TILE_SIZE+5));

bt7.setTranslateY(-220);

GridPane pane = new GridPane();

pane.setAlignment(Pos.CENTER);

pane.setPadding(new Insets(11.5, 12.5, 13.5, 14.5)); // pixel buffer layout

pane.setHgap(5.5); // pixel per blocks

pane.setVgap(5.5);

pane.getChildren().addAll(shape,bt1,bt2,bt3,bt4,bt5,bt6,bt7);

Scene scene = new Scene(pane);

primaryStage.setTitle("GridPane"); // Set the stage title

primaryStage.setScene(scene); // Place the scene in the stage

primaryStage.show(); // Display the stage

}

}

Explanation -:

1 -: First create objects of 7 Butttons and create their shape circle bt setShape() method. and set their Diameter as TILE_SIZE using setMaxSize() method.

2 -: Now set the position of each button by using setTranslateX() and setTranlateY() methods as you have done in loop.

3-: you can edit the text written inside button by passing desired string at the time of object creation of the buttons.