我在用JavaFX绘制十字线时遇到问题 [英] I am having an issue with drawing a cross with JavaFX

问题描述

我正在尝试编写将在网格上对角绘制3种形状的代码.前两个形状是正方形和圆形，这是我能够做到的.

I am trying to write code that will draw 3 shapes diagonally across a grid. The first two shapes are a square and a circle, which I was able to do.

但是，第三个形状使我有些悲伤.我应该画一个十字(T版本，而不是X)，每次我写出代码时，它看起来就像是一个侧面，ways.我知道我只是缺少一些简单的东西，但是我非常感谢您的帮助！

The third shape, however, is giving me some grief. I am supposed to draw a cross (T version, not X), and every time I write out the code it comes out looking like a sideways, ⊢. I know I am just missing something simple, but I would really appreciate the help!

这是我的Shapes程序的完整代码.

Here is the full code for my Shapes program.

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;
import javafx.scene.shape.Rectangle;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Line;
import javafx.scene.paint.Color;

public class Shapes extends Application {

    public void start(Stage primaryStage) {
        // This will build the shapes which include a Square, Circle, and 2 Lines.
        // All shapes will have a width of 3.

        // This Rectangle will be colored like the Square on a playstation controller
        Rectangle square = new Rectangle(65, 65, 65, 65);
        square.setStroke(Color.rgb(243, 211, 234));
        square.setStrokeWidth(3);
        square.setFill(Color.rgb(243, 211, 234));

        // A circle colored like the Circle on the playstation controller.
        Circle circle = new Circle(40);
        circle.setStroke(Color.rgb(241, 188, 194));
        circle.setStrokeWidth(3);
        circle.setFill(Color.rgb(241, 188, 194));

        // Lines colored like the Cross button on a playstation controller.
        Line line1 = new Line(-50, 75, 50, 75);
        line1.setStroke(Color.rgb(165, 191, 214));
        line1.setStrokeWidth(3);

        Line line2 = new Line(0, 0, 0, 100);
        line2.setStroke(Color.rgb(165, 191, 214));
        line2.setStrokeWidth(3);


        // Setup the GridPane in the center of the stage which will also pad out from the edge of the window.
        GridPane pane = new GridPane();
        pane.setAlignment(Pos.CENTER);
        pane.setPadding(new Insets(11.5, 12.5, 13.5, 14.5));

        // Place each object in it's respective place on the pane.
        // Square top left, Circle, middle, Cross bottom right.
        pane.add(square, 0, 0);
        pane.add(circle, 1, 1);
        pane.add(line1, 2, 2);
        pane.add(line2, 2, 2);

        // Create the scene to display the program.
        Scene scene = new Scene(pane);
        primaryStage.setTitle("Shapes");
        primaryStage.setScene(scene);
        primaryStage.show();
        primaryStage.setResizable(false);
    }

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

这是我遇到的特定代码段.

And here is the specific snippet I am having trouble with.

// Lines colored like the Cross button on a playstation controller.
Line line1 = new Line(-50, 75, 50, 75);
line1.setStroke(Color.rgb(165, 191, 214));
line1.setStrokeWidth(3);

Line line2 = new Line(0, 0, 0, 100);
line2.setStroke(Color.rgb(165, 191, 214));
line2.setStrokeWidth(3);

我确实需要水平线在窗格上更高一点.它应该像一个基督教十字架".

I do need the horizontal line to be a bit higher up on the pane. It should resemble a "Christian cross."

非常感谢您的帮助.

推荐答案

看起来几何还可以，但是line2的对齐方式是错误的.在将其居中的几种方法中，

It looks like the geometry is OK, but the alignment of line2 is wrong. Among the several ways to center it,

1. 为相关的

2. 将行添加到具有所需布局的Pane中；例如， StackPane ，默认为Pos.CENTER:

3. Add the lines to a Pane having the desired layout; StackPane, for example, defaults to Pos.CENTER:

   StackPane lines = new StackPane(line1, line2);
   pane.add(lines, 2, 2);
   

顺便说一句，明智地使用常量将使修改变得容易一些.例如，使用标尺值来保持尺寸成比例，如此处:

As an aside, judicious use of constants will make tinkering a little easier. For example, use a scale value to keep sizes proportional, as shown here:

private static final int N = 50;
…
Rectangle square = new Rectangle(2 * N, 2 * N);
Circle circle = new Circle(N);
Line line1 = new Line(-N, 0, N, 0);
Line line2 = new Line(0, -N, 0, N);

我确实需要水平线在窗格上更高一点.它应该像一个基督教十字架".

I do need the horizontal line to be a bit higher up on the pane. It should resemble a "Christian cross."

使用@fabian建议的方法，根据需要调整水平线的端点；请注意下图所示的拉丁十字架的变化:

Using the approach suggested by @fabian, adjust the horizontal line's endpoints as desired; note the changes for a Latin cross, seen in the image below:

Line line1 = new Line(-N, 0, N, 0); // Greek
Line line1 = new Line(-N, -N/3, N, -N/3); // Latin
…
pane.add(new Group(line1, line2), 2, 2);

这篇关于我在用JavaFX绘制十字线时遇到问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！