libro
www.tuyano.com
初心者のためのJavaFXプログラミング入門

Canvasによるグラフィック描画 (3/5)

作成:2015-01-17 11:04
更新:2015-01-17 11:04

■主な描画用メソッド

では、図形の描画メソッドにはどのようなものがあるのでしょうか。ここで主なものをまとめておきましょう。


・直線の描画
《GraphicsContext》.strokeLine
    ( 開始横位置 , 開始縦位置 ,
      終了横位置 , 終了縦位置 );
2点を結ぶ直線を描くためのものです。引数には、線の開始地点と終了地点を指定します。

・四角形の描画
《GraphicsContext》.fillRectangle( 横位置 , 縦位置 , 横幅 , 高さ );
《GraphicsContext》.strokeRect( 横位置 , 縦位置 , 横幅 , 高さ );
四角形を描画するためのものです。fillRectangleは塗りつぶした四角形、strokeRectangleは輪郭線だけを描きます。引数にはそれぞれ図形の右上の位置と、縦横の幅を指定します。


・角の丸い四角形の描画
《GraphicsContext》.fillRoundRectangle( 横位置 , 縦位置 , 
    横幅 , 高さ , 角の横幅 , 角の高さ );
《GraphicsContext》.stokeRoundRectangle( 横位置 , 縦位置 ,
    横幅 , 高さ , 角の横幅 , 角の高さ );
角の部分が丸くなった四角形を描くためのものです。引数には位置と大きさの値に加え、角の部分の縦横幅を用意します。


・楕円の描画
《GraphicsContext》.fillOval( 横位置 , 縦位置 , 横幅 , 高さ );
《GraphicsContext》.strokeOval( 横位置 , 縦位置 , 横幅 , 高さ );
楕円を描くものです。基本的には四角形の描画と同じで、描く楕円の位置(右上の位置)と縦横幅を指定します。


・円弧の描画
《GraphicsContext》.fillArc( 横位置 , 縦位置 , 横半径 , 縦半径 , 
    開始角度 , 長さ , タイプ );
《GraphicsContext》.stokeArc( 横位置 , 縦位置 , 横半径 , 縦半径 ,
    開始角度 , 長さ , タイプ );
円弧を描くためのものです。位置と大きさの他に、その円の開始地点と長さ、タイプに関する値を指定します。タイプは描かれる円弧の図形の形に関するものです。これはArcTypeという列挙型(Enum)の値を使って指定します。用意されている値は以下のものです。

CHORD――円弧の両端を直線で結んだ形の図形を描きます。
OPEN――円弧の両端を結ばず、開いた図形として描きます(内部は塗りつぶさない)。
ROUND――円弧の両端と円の中心を直線で結んだ形の図形を描きます。


・多角形の描画
《GraphicsContext》.fillPolyline( 横位置の配列 , 縦位置の配列 , 頂点数 );
《GraphicsContext》.stokePolyline( 横位置の配列 , 縦位置の配列 , 頂点数 );
《GraphicsContext》.fillPolygon( 横位置の配列 , 縦位置の配列 , 頂点数 );
《GraphicsContext》.stokePolygon( 横位置の配列 , 縦位置の配列 , 頂点数 );
複数の頂点を結んだ多角形を描くためのものです。引数は、各頂点の横位置と縦位置をそれぞれ別々にdouble配列にまとめたものと頂点の数を指定します。○○Polylineと、○○Polygonという2種類のものがありますが、前者は閉じていない図形、後者は閉じた図形(開始地点と終了地点がつながっている)を描くものです。


・テキストの描画
《GraphicsContext》.fillText( 描画テキスト , 横位置 , 縦位置 );
《GraphicsContext》.stokeText( 描画テキスト , 横位置 , 縦位置 );
テキストを指定の位置に描画します。描画するテキストと描画位置位置の値を指定します。

※プログラムリストが表示されない場合

AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。

※関連コンテンツ

「初心者のためのJavaFXプログラミング入門」に戻る