JavaFX에서 제공하는 다양한 2D 도형 종류와 사용법

JavaFX는 화면에 다양한 기하학적 도형을 손쉽게 그릴 수 있도록 여러 클래스를 제공합니다. 이 글에서는 JavaFX에서 지원하는 주요 2D 도형들을 하나씩 살펴보겠습니다.

JavaFX의 주요 2D 도형

• 선(Line) — 두 점을 연결하는 가장 기본적인 기하학적 구조입니다. javafx.scene.shape.Line 클래스가 XY 평면상의 선을 나타냅니다.
• 사각형(Rectangle) — 마주 보는 두 쌍의 변이 서로 평행하며, 모든 내각이 직각인 네 변의 다각형입니다. javafx.scene.shape.Rectangle 클래스가 XY 평면상의 사각형을 나타냅니다.
• 원(Circle) — 닫힌 곡선으로 이루어져 있으며, 곡선 위의 모든 점이 중심점으로부터 일정한 거리를 유지하는 도형입니다. javafx.scene.shape.Circle 클래스가 XY 평면상의 원을 나타냅니다.
• 타원(Ellipse) — 초점(focus)이라 불리는 두 개의 점으로 정의되는 도형입니다. 타원 위의 임의의 점에서 두 초점까지의 거리 합은 항상 일정합니다. javafx.scene.shape.Ellipse 클래스가 XY 평면상의 타원을 나타냅니다.
• 다각형(Polygon) — 같은 평면 위의 여러 선분을 끝과 끝이 연결하여 만든 닫힌 도형입니다. javafx.scene.shape.Polygon 클래스가 XY 평면상의 다각형을 나타냅니다.
• 폴리라인(Polyline) — 끝부분이 닫히지 않았다는 점만 다각형과 다르며, 하나 이상의 선분으로 이루어진 연속적인 선입니다. javafx.scene.shape.Polyline 클래스가 XY 평면상의 폴리라인을 나타냅니다.
• 3차 곡선(Cubic Curve) — XY 평면에서 차수(degree)가 3인 베지어 매개변수 곡선입니다. javafx.scene.shape.CubicCurve 클래스가 XY 평면상의 3차 곡선을 나타냅니다.
• 2차 곡선(QuadCurve) — XY 평면에서 차수가 2인 베지어 매개변수 곡선입니다. javafx.scene.shape.QuadCurve 클래스가 XY 평면상의 2차 곡선을 나타냅니다.
• 호(Arc) — 곡선의 일부를 의미합니다. javafx.scene.shape.Arc 클래스가 XY 평면상의 호를 나타냅니다.

도형 생성 절차

JavaFX에서 원하는 도형을 만들려면 다음 세 단계를 따르면 됩니다.

• 해당 도형의 클래스를 인스턴스화(객체 생성)합니다.
• 필요한 속성(좌표, 크기 등)을 설정합니다.
• 생성된 객체를 Group에 추가합니다.

예제 코드

아래의 JavaFX 예제는 지원되는 모든 2D 도형을 한 번에 생성하고 화면에 표시하는 방법을 보여줍니다.

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.shape.Arc;
import javafx.scene.shape.ArcType;
import javafx.scene.shape.Circle;
import javafx.scene.shape.CubicCurve;
import javafx.scene.shape.Ellipse;
import javafx.scene.shape.Line;
import javafx.scene.shape.Polygon;
import javafx.scene.shape.Polyline;
import javafx.scene.shape.QuadCurve;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.FontPosture;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
public class JavaFXShapes extends Application {
    public void start(Stage stage) {
        Font font = Font.font("verdana", FontWeight.BOLD, FontPosture.REGULAR, 12);
        Text cirText = new Text("Circle");
        cirText.setFont(font);
        cirText.setX(50);
        cirText.setY(130);
        Text rectText = new Text("Rectangle");
        rectText.setFont(font);
        rectText.setX(170);
        rectText.setY(130);
        Text ellipseText = new Text("Ellipse");
        ellipseText.setFont(font);
        ellipseText.setX(310);
        ellipseText.setY(130);
        Text polyText = new Text("Polygon");
        polyText.setFont(font);
        polyText.setX(425);
        polyText.setY(130);
        Text lineText = new Text("Line");
        lineText.setFont(font);
        lineText.setX(530);
        lineText.setY(130);
        Text polyLineText = new Text("Poly Line");
        polyLineText.setFont(font);
        polyLineText.setX(40);
        polyLineText.setY(260);
        Text cubicCurveText = new Text("Cubic Curve");
        cubicCurveText.setFont(font);
        cubicCurveText.setX(140);
        cubicCurveText.setY(260);
        Text quadCurveText = new Text("Quad Curve");
        quadCurveText.setFont(font);
        quadCurveText.setX(340);
        quadCurveText.setY(260);
        Text arcText = new Text("Arc");
        arcText.setFont(font);
        arcText.setX(490);
        arcText.setY(260);
        //Drawing a circle
        Circle circle = new Circle(75.0f, 65.0f, 40.0f );
        //Drawing a Rectangle
        Rectangle rect = new Rectangle(150, 30, 100, 65);
        //Drawing an ellipse
        Ellipse ellipse = new Ellipse(330, 60, 60, 35);
        //Drawing Polygon
        Polygon poly = new Polygon(410, 60, 430, 30, 470, 30, 490, 60, 470, 100, 430, 100 );
        //Drawing a Line
        Line line = new Line(540, 30, 540, 90);
        line.setStrokeWidth(5.0);
        //Drawing a Poly line
        Polyline polyLine = new Polyline(25, 210, 100, 210, 50, 180, 50, 230);
        polyLine.setStrokeWidth(5.0);
        //Drawing a cubic curve
        CubicCurve cubicCurve = new CubicCurve(150.0, 210.0, 200.0, 70.0, 200.0, 290.0, 270.0, 210.0);
        //Drawing Quadratic curve
        QuadCurve quadCurve = new QuadCurve(400.0, 200.0, 440.0, 250.0, 330.0, 170.0);
        //Drawing an arc
        Arc arc = new Arc(490, 240, 50, 80, 30, 70);
        arc.setType(ArcType.ROUND);
        //Setting the stage
        Group root = new Group(
        circle, ellipse, rect, poly, line,
        polyLine, cubicCurve, quadCurve, arc,
        cirText, rectText, ellipseText, polyText, lineText,
        polyLineText, cubicCurveText, quadCurveText, arcText);
        Scene scene = new Scene(root, 600, 300);
        stage.setTitle("2D shapes Example");
        stage.setScene(scene);
        stage.show();
    }
    public static void main(String args[]){
        launch(args);
    }
}

실행 결과

위 코드를 실행하면 원, 사각형, 타원, 다각형, 선, 폴리라인, 3차 곡선, 2차 곡선, 호까지 총 아홉 가지 2D 도형이 하나의 Scene 안에 함께 표시됩니다. 각 도형마다 이름 라벨(Text)을 함께 배치하여 어떤 도형인지 쉽게 확인할 수 있습니다.