Javafx-2d-shapes

提供：Dev Guides
移動先:案内、検索

JavaFX-2Dシェイプ

前の章で、JavaFXの基本的なアプリケーションを見てきました。そこでは、空のウィンドウを作成する方法と、JavaFXのXY平面に線を引く方法を学びました。 線に加えて、他のいくつかの2D図形も描画できます。

2D形状

一般に、2DシェイプはXY平面に描画できる幾何学的図形であり、これらには線、長方形、円などが含まれます。

JavaFXライブラリを使用すると、描画することができます-

  • 線、長方形、円、楕円、多角形、ポリライン、3次曲線、四角形曲線、円弧などの事前定義された形状。
  • MoveTO Path Element、Line、Horizo​​ntal Line、Vertical Line、Cubic Curve、Quadratic Curve、Arcなどのパス要素。
  • これらに加えて、SVGパスを解析して2D形状を描くこともできます。

上記の2D形状はそれぞれクラスによって表され、これらのクラスはすべてパッケージ javafx.scene.shape に属します。 Shape という名前のクラスは、JavaFXのすべての2次元形状の基本クラスです。

2Dシェイプを作成する

チャートを作成するには、する必要があります-

  • 必要な形状のそれぞれのクラスをインスタンス化します。
  • 形状のプロパティを設定します。
  • 図形オブジェクトをグループに追加します。

各クラスのインスタンス化

2次元形状を作成するには、まず、それぞれのクラスをインスタンス化する必要があります。

たとえば、行を作成する場合は、次のようにLineという名前のクラスをインスタンス化する必要があります- 

Line line = new Line();

シェイプのプロパティを設定する

クラスをインスタンス化した後、setterメソッドを使用して形状のプロパティを設定する必要があります。

たとえば、線を描くには、線の始点と終点のx座標とy座標を渡す必要があります。 次のように、それぞれのセッターメソッドを使用してこれらの値を指定できます- 

//Setting the Properties of the Line
line.setStartX(150.0f);
line.setStartY(140.0f);
line.setEndX(450.0f);
line.setEndY(140.0f);

シェイプオブジェクトをグループに追加する

最後に、以下に示すように、コンストラクターのパラメーターとして渡すことにより、図形のオブジェクトをグループに追加する必要があります。 

//Creating a Group object
Group root = new Group(line);

次の表に、JavaFXが提供するさまざまな形状（クラス）のリストを示します。

S.No Shape & Description
1

Line

線は、2点を結ぶ幾何学的構造です。 パッケージ javafx.scene.shape の Line クラスは、XY平面の線を表します。

2

Rectangle

一般に、長方形とは、すべての内角が直角である2対の平行で平行な辺を持つ4辺形の多角形です。 JavaFXでは、Rectangleは Rectangle という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

3

Rounded Rectangle

JavaFXでは、鋭いエッジまたはアーチ型のエッジを持つ長方形を描くことができます。アーチ型のエッジを持つ長方形は、角丸長方形と呼ばれます。

4

Circle

円は、閉ループを形成する線であり、その上のすべての点は中心点から固定距離です。 JavaFXでは、円は Circle という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

5

Ellipse

楕円は、それぞれフォーカスと呼ばれる2つのポイントによって定義されます。 楕円上の任意の点が取られた場合、焦点までの距離の合計は一定です。 楕円のサイズは、これら2つの距離の合計によって決まります。

JavaFXでは、楕円は Ellipse という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

6

Polygon

端と端をつなぐ多数の共面線分によって形成される閉じた形状。 JavaFXでは、ポリゴンは Polygon という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

7

Polyline

ポリラインは、ポリラインが最後に閉じられていないことを除いて、ポリゴンと同じです。 または、1つ以上の線分で構成される連続線。 JavaFXでは、ポリラインは Polygon という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

8

Cubic Curve

3次曲線は、XY平面のベジェパラメトリック曲線であり、次数3の曲線です。 JavaFXでは、3次曲線は CubicCurve という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

9

QuadCurve

2次曲線は、XY平面のベジェパラメトリック曲線であり、次数2の曲線です。 JavaFXでは、QuadCurveはQuadCurveという名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

10

Arc

円弧は曲線の一部です。 JavaFXでは、アークは Arc という名前のクラスで表されます。 このクラスは、パッケージ- javafx.scene.shape に属します。

リンク：/javafx/2dshapes_types_of_arc [円弧のタイプ]

これに加えて、3種類の弧 Open、Chord、Round を描画できます。

11

SVGPath

JavaFXでは、SVGパスを解析して画像を構築できます。 このような形状は、 SVGPath という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。 このクラスには、Stringデータ型の content というプロパティがあります。 これは、画像を描画するSVGパスエンコード文字列を表します。

パスクラスを介してより多くの図形を描画する

前のセクションでは、クラスをインスタンス化し、それぞれのパラメーターを設定することにより、いくつかの単純な事前定義された形状を描画する方法を見てきました。

ただし、これらの事前定義された形状だけでは、* javafx.shapeパッケージ*で提供されるプリミティブ以外の複雑な形状を構築するには不十分です。

たとえば、次の図に示すようにグラフィカル要素を描画する場合、これらの単純な形状に依存することはできません。

パスクラス

パスクラス

このような複雑な構造を描画するために、JavaFXは Path という名前のクラスを提供します。 このクラスは、図形の幾何学的な輪郭を表します。

moveTo、LineTo、HlineTo、VlineTo、ArcTo、QuadCurveTo、CubicCurveToなどのさまざまな*パス要素*を保持する監視可能なリストに添付されます。

インスタンス化すると、このクラスは指定されたパス要素に基づいてパスを構築します。

次のようにインスタンス化しながら、このクラスにパス要素を渡すことができます- 

Path myshape = new Path(pathElement1, pathElement2, pathElement3);

または、次のように* addAll（）*メソッドを使用して、監視可能なリストを取得し、すべてのパス要素を追加できます- 

Path myshape = new Path();
myshape.getElements().addAll(pathElement1, pathElement2, pathElement3);

また、add（）メソッドを使用して要素を個別に追加することもできます- 

Path myshape = new Path();
myshape.getElements().add(pathElement1);

パス要素への移動

パス要素 MoveTo は、パスの現在の位置を指定されたポイントに移動するために使用されます。 通常、パス要素を使用して描画された形状の開始点を設定するために使用されます。

パッケージ javafx.scene.shape の LineTo というクラスで表されます。 それは、二重データ型の2つのプロパティ、つまり-

  • X -現在の位置から線を引くポイントのx座標。
  • Y -現在位置から線が引かれるポイントのy座標。

あなたはMoveToクラスをインスタンス化し、次のように新しいポイントのx、y座標を渡すことにより、パス要素への移動を作成することができます- 

MoveTo moveTo = new MoveTo(x, y);

コンストラクタに値を渡さない場合、新しいポイントは（0,0）に設定されます。

また、次のようにそれぞれのセッターメソッドを使用して、x、y座標に値を設定することができます- 

setX(value);
setY(value);

例–複雑なパスの描画

この例では、 Path、MoveTo 、および Line クラスを使用して次の形状を描画する方法を示します。

複雑なパス

このコードを ComplexShape.java という名前のファイルに保存します。 

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.shape.LineTo;
import javafx.scene.shape.MoveTo;
import javafx.scene.shape.Path;

public class ComplexShape extends Application {
   @Override
   public void start(Stage stage) {
     //Creating a Path
      Path path = new Path();

     //Moving to the starting point
      MoveTo moveTo = new MoveTo(108, 71);

     //Creating 1st line
      LineTo line1 = new LineTo(321, 161);

     //Creating 2nd line
      LineTo line2 = new LineTo(126,232);

     //Creating 3rd line
      LineTo line3 = new LineTo(232,52);

     //Creating 4th line
      LineTo line4 = new LineTo(269, 250);

     //Creating 4th line
      LineTo line5 = new LineTo(108, 71);

     //Adding all the elements to the path
      path.getElements().add(moveTo);
      path.getElements().addAll(line1, line2, line3, line4, line5);

     //Creating a Group object
      Group root = new Group(path);

     //Creating a scene object
      Scene scene = new Scene(root, 600, 300);

     //Setting title to the Stage
      stage.setTitle("Drawing an arc through a path");

     //Adding scene to the stage
      stage.setScene(scene);

     //Displaying the contents of the stage
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

次のコマンドを使用して、コマンドプロンプトから保存したJavaファイルをコンパイルして実行します。 

javac ComplexShape.java
java ComplexShape

上記のプログラムは、実行時にアークを表示するJavaFXウィンドウを生成します。このウィンドウは、以下に示すように、現在の位置から指定したポイントまで描画されます。

パスから円弧を描く

以下は、JavaFXが提供するさまざまなパス要素（クラス）です。 これらのクラスは、パッケージ javafx.shape に存在します。 これらのクラスはすべて、クラス PathElement を継承します。

S.No Shape & Description
1

LineTo

パス要素 line は、現在の位置から指定された座標内のポイントに直線を描くために使用されます。 LineTo という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

2

HlineTo

パス要素 HLineTo は、現在の位置から指定された座標内のポイントに水平線を描画するために使用されます。 HLineTo という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

3

VLineTo

パス要素 vertical line は、現在の位置から指定された座標内のポイントに垂直線を描画するために使用されます。 VLineTo という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

4

QuadCurveTo

パス要素の2次曲線は、現在の位置から指定された座標のポイントに* 2次曲線*を描くために使用されます。 QuadraticCurveTo という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

5

CubicCurveTo

パス要素 cubic curve は、現在の位置から指定された座標のポイントに3次曲線を描くために使用されます。 CubicCurveTo という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

6

ArcTo

パス要素 Arc は、現在の位置から指定された座標内のポイントに円弧を描くために使用されます。 ArcTo という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.shape に属します。

2Dオブジェクトのプロパティ

すべての2次元オブジェクトについて、塗りつぶし、ストローク、StrokeTypeなどのさまざまなプロパティを設定できます。 次のセクションでは、2Dオブジェクトのさまざまなプロパティについて説明します。

  • リンク：/javafx/stroke_type [ストロークタイプ]
  • リンク：/javafx/stroke_width [ストローク幅]
  • リンク：/javafx/stroke_fill [ストロークフィル]
  • リンク：/javafx/stroke [ストローク]
  • リンク：/javafx/stroke_line_join [ストロークライン]
  • リンク：/javafx/stroke_miter_limit [ストロークマイターリミット]
  • リンク：/javafx/stroke_line_cap [ストロークラインキャップ]
  • リンク：/javafx/smooth [スムーズ]

2Dオブジェクトの操作

グループに複数のシェイプを追加する場合、以下に示すように、最初のシェイプは2番目のシェイプと重なります。

2Dオブジェクトの操作

変換（回転、拡大縮小、変換など）、遷移（アニメーション）に加えて、2Dオブジェクトに対して3つの操作（ Union、Subtraction 、 Intersection ）を実行することもできます。

S.No Operation & Description
1

Union Operation

この操作は、入力として2つ以上の形状を取り、それらが占める領域を返します。

2

Intersection Operation

この操作は、入力として2つ以上の形状を取り、それらの間の交差領域を返します。

3

Subtraction Operation

この操作は、入力として2つ以上の形状を取ります。 次に、2番目の図形と重なる領域を除く、最初の図形の領域を返します。

「https://www.finddevguides.com/index.php?title=Javafx-2d-shapes&oldid=10142」から取得
Powered by MediaWiki