如何实现第二、四行向右偏移的JavaFX星形矩形网格？

嘿，我仔细看了你的代码，问题其实很明确：你只是调整了第二、第四行的星星数量，但没让这些行的元素整体向右偏移一个列位置。原来设置的GridPane.setHalignment(star, HPos.RIGHT)只会让每个星星在自己的列里右对齐，根本达不到整行偏移的效果哦。

修改思路 #

要实现你想要的交错网格效果，我们可以这么做：

• 第一、第三行（对应代码里的row=0和row=2）保持7个星星，列索引从0到6
• 第二、第四行（row=1和row=3）只放6个星星，并且让它们的列索引从1到6——这样整行自然就向右偏移了一列，和上一行的星星完美错开
• 把对齐方式改成居中，让星星在列里更整齐，去掉没必要的右对齐设置

修改后的完整代码 #

import javafx.application.Application;
import javafx.geometry.HPos;
import javafx.scene.Scene;
import javafx.scene.layout.GridPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Polygon;
import javafx.stage.Stage;
import java.util.Random;

public class Main extends Application {
    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage primaryStage) {
        GridPane grid = new GridPane();
        Random rand = new Random();

        // 遍历每一行
        for (int row = 0; row < 4; row++) {
            int startCol = 0;
            int colCount = 7;

            // 对第二行和第四行做偏移处理
            if (row == 1 || row == 3) {
                startCol = 1; // 从第1列开始，整体右移一列
                colCount = 6; // 比其他行少一个元素，避免超出网格
            }

            // 生成当前行的所有星星
            for (int col = startCol; col < startCol + colCount; col++) {
                Polygon star = new Polygon(25, 0, 15, 20, 0, 20, 10, 40, 5, 60, 25, 50, 45, 60, 40, 40, 50, 20, 35, 20);
                star.setFill(Color.WHITE);
                star.setStroke(Color.BLACK);
                GridPane.setRowIndex(star, row);
                GridPane.setColumnIndex(star, col);
                // 让星星在列中居中，视觉效果更整齐
                GridPane.setHalignment(star, HPos.CENTER);
                grid.getChildren().add(star);
            }
        }

        Scene scene = new Scene(grid, 1024, 800, true);
        primaryStage.setScene(scene);
        primaryStage.setTitle("Offset Star Grid");
        primaryStage.show();
    }
}

关键修改点说明 #

1. 起始列偏移：给需要偏移的行设置startCol=1，这行的第一个星星就会放在第1列，直接实现整行右移的效果
2. 列数量适配：偏移行的星星数量设为6，这样从第1列到第6列刚好是6个元素，不会出现超出网格的问题
3. 对齐优化：把原来的右对齐改成居中对齐，让每个星星在自己的列里居中显示，网格看起来更规整

这样修改之后，第二行和第四行就会完美向右偏移，形成你想要的交错星形网格啦～

内容的提问来源于stack exchange，提问作者user12971331