如何在 JavaFX 中创建六边形的六边形作为按钮

Question

我想在 JavaFX 中创建一个由六边形组成的六边形作为按钮，我使用图像并尝试将一些按钮放置到每个六边形的位置，但我无法更改它们在网格窗格中的位置。这是我的代码：

package sample;

import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;

public class GameBoard extends GridPane {
    public GameBoard(){
        this.setAlignment(Pos.CENTER);
        ImageView image = new ImageView();
        Image hexagonImg = new Image("hexagon.jpg");
        image.setFitWidth(500);
        image.setFitHeight(500);
        image.setImage(hexagonImg);
        this.add(image,0,0);
        GridPane button1Pane = new GridPane();
        this.add(button1Pane,0,0);
        Button button1 = new Button();
        button1Pane.add(button1,1,0);
    }
}

Answer 1

多边形六边形

由于您需要用作按钮，因此我添加了更改舞台标题的鼠标单击事件。如果您想并排放置六边形，您可能需要考虑x 轴的半径和y 轴的边心圆。这是一个功能性单类 javafx 应用程序，您可以尝试

应用程序.java

public class App extends Application {

    @Override
    public void start(Stage stage) {

        double HexagonRadius = 100;

        Hexagon hexagon1 = new Hexagon(HexagonRadius, Color.CADETBLUE);

        Hexagon hexagon2 = new Hexagon(HexagonRadius, Color.MEDIUMPURPLE);
        hexagon2.setTranslateY(hexagon1.getOffsetY() * 2);

        Hexagon hexagon3 = new Hexagon(HexagonRadius, Color.MEDIUMSEAGREEN);
        hexagon3.setTranslateY(-hexagon1.getOffsetY() * 2);

        Hexagon hexagon4 = new Hexagon(HexagonRadius, Color.CORNFLOWERBLUE);
        hexagon4.setTranslateY(-hexagon1.getOffsetY());
        hexagon4.setTranslateX(hexagon1.getOffsetX());

        Hexagon hexagon5 = new Hexagon(HexagonRadius, Color.YELLOW);
        hexagon5.setTranslateY(-hexagon1.getOffsetY());
        hexagon5.setTranslateX(-hexagon1.getOffsetX());

        Hexagon hexagon6 = new Hexagon(HexagonRadius, Color.ORANGE);
        hexagon6.setTranslateY(hexagon1.getOffsetY());
        hexagon6.setTranslateX(-hexagon1.getOffsetX());

        Hexagon hexagon7 = new Hexagon(HexagonRadius, Color.SKYBLUE);
        hexagon7.setTranslateY(hexagon1.getOffsetY());
        hexagon7.setTranslateX(hexagon1.getOffsetX());

        Group hexagonsGroup = new Group(hexagon1, hexagon2, hexagon3, hexagon4, hexagon5, hexagon6, hexagon7);

        StackPane stackPane = new StackPane(hexagonsGroup);

        var scene = new Scene(stackPane, 640, 480);
        scene.setFill(Color.ANTIQUEWHITE);
        stage.setScene(scene);
        stage.show();
    }

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

    public class Hexagon extends Group {

        private Polygon polygon;
        private double radius;
        private double radianStep = (2 * Math.PI) / 6;

        private double offsetY;
        private double offsetX;

        public Hexagon(double radius, Paint color) {
            this.radius = radius;
            makeHexagon(radius, color);
            offsetY = calculateApothem();
            
            
            
            offsetX = radius * 1.5;
            changeTittle();

        }

        private void makeHexagon(double radius, Paint color) {
            polygon = new Polygon();
            this.getChildren().add(polygon);
            polygon.setFill(color);
            polygon.setStroke(Color.WHITESMOKE);
            polygon.setEffect(new DropShadow(10, Color.BLACK));
            polygon.setStrokeWidth(10);
            polygon.setStrokeType(StrokeType.INSIDE);

            for (int i = 0; i < 6; i++) {
                double angle = radianStep * i;

                polygon.getPoints().add(Math.cos(angle) * radius / 1.1);
                polygon.getPoints().add(Math.sin(angle) * radius / 1.1);

            }
        }

        public void changeTittle() {

            polygon.setOnMouseClicked(e -> {
                Stage stage = (Stage) this.getScene().getWindow();
                stage.setTitle(polygon.getFill().toString());
            });

        }

        public double getOffsetY() {
            return offsetY;
        }

        public double getOffsetX() {
            return offsetX;
        }

        private double calculateApothem() {
            
            return (Math.tan(radianStep) * radius) / 2;

        }

    }

}