I created a GridPane with 48 cells (8 columns x 6 rows), and I don't know why but there is a sort of "ghost line" that I'm not able to remove. Can you help me, please?
See the images with and without padding to understand better what I mean.
How the GridPane appears with a 10px padding:
How the GridPane appear without a padding, but with this "ghost line":
Here's the image I'm using, but you can use whatever image you want: image.jpg
Here's a minimal reproducible example:
scene.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.Cursor?>
<?import javafx.scene.control.*?>
<AnchorPane fx:id="backgroundPane" xmlns="http://javafx.com/javafx/16" xmlns:fx="http://javafx.com/fxml/1" fx:controller="application.Controller">
<children>
<Button fx:id="gridButton" text="Grid" onAction="#Grid" prefWidth="150.0"> </Button>
<GridPane fx:id="wellsGridPane" AnchorPane.leftAnchor="100.0" AnchorPane.topAnchor="100.0"></GridPane>
</children>
</AnchorPane>
Main
package application;
import java.io.IOException;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class Main extends Application {
public static void main(String[] args) {
launch(args);
}
@Override
public void start(Stage mainStage) {
//load the fxml and css files
FXMLLoader loader = new FXMLLoader(getClass().getResource("/resources/scene.fxml"));
Parent root = null;
try {
root = loader.load();
}
catch (IOException e) {
e.printStackTrace();
}
Scene scene = new Scene(root, 1000, 750);
Controller c = loader.getController();
c.setStage(mainStage);
mainStage.setTitle("Software");
mainStage.setScene(scene);
mainStage.show();
root.requestFocus();
}
}
Controller
package application;
import java.io.File;
import java.net.MalformedURLException;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.RowConstraints;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class Controller {
@FXML
private GridPane wellsGridPane;
@FXML
private void Grid (ActionEvent event) {
System.out.println("Grid pressed");
wellsGridPane.getChildren().clear();
wellsGridPane.getColumnConstraints().clear();
wellsGridPane.getRowConstraints().clear();
for (int i = 0; i < 8; i++) { //8 cols
ColumnConstraints colConst = new ColumnConstraints();
colConst.setPercentWidth(100.0 / 8);
wellsGridPane.getColumnConstraints().add(colConst);
}
for (int i = 0; i < 6; i++) { //6 rows
RowConstraints rowConst = new RowConstraints();
rowConst.setPercentHeight(100.0 / 6);
wellsGridPane.getRowConstraints().add(rowConst);
}
wellsGridPane.setHgap(0); //10 for the first image, 0 for the second image I uploaded
wellsGridPane.setVgap(0); //10 for the first image, 0 for the second image I uploaded
System.out.println("Grid is " + wellsGridPane.getRowCount() + " x " + wellsGridPane.getColumnCount());
Image img = null;
try {
img = new Image(new File("src\\resources\\image.jpg").toURI().toURL().toExternalForm(), 100, 100, true, false);
}
catch (MalformedURLException e) {
e.printStackTrace();
}
int i = 0;
int j = 0;
for (int n=0; n<48; n++) {
ImageView image = new ImageView(img);
StackPane pane = new StackPane();
pane.getChildren().add(image);
wellsGridPane.getChildren().add(pane);
GridPane.setRowIndex(pane, i);
GridPane.setColumnIndex(pane, j);
j++;
if (j == wellsGridPane.getColumnCount()) {
i++;
j=0;
}
}
}
public void setStage(Stage stage) {
stage.setMinHeight(789);
stage.setMinWidth(1016);
stage.setMaxHeight(789);
stage.setMaxWidth(1016);
stage.setHeight(789);
stage.setWidth(1016);
}
}
Tthere is no real need to set the row and column width and height. Try the following controller which uses the image you posted:
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class Controller {
private static final String B_AND_W_SQUARES_800X800 = "https://i...content-available-to-author-only...r.com/SfZWK6g.jpg";
private static final int ROWS = 6, COLS = 8;
@FXML
private GridPane wellsGridPane;
@FXML
private void Grid (ActionEvent event) {
Image img = new Image(B_AND_W_SQUARES_800X800,100,100,false,true,true);
int i = 0, j = 0;
for (int n=0; n< ROWS*COLS; n++) {
ImageView image = new ImageView(img);
StackPane pane = new StackPane(image);
GridPane.setRowIndex(pane, i);
GridPane.setColumnIndex(pane, j);
wellsGridPane.getChildren().add(pane);
//wellsGridPane.setHgap(10); wellsGridPane.setVgap(10);
j++;
if (j == COLS) {
i++;
j=0;
}
}
}
public void setStage(Stage stage) {
stage.setMinHeight(789);
stage.setMinWidth(1016);
stage.setMaxHeight(789);
stage.setMaxWidth(1016);
stage.setHeight(789);
stage.setWidth(1016);
}
}