グラフィックを使用する場合,文字や図形,画像を作成するクラスもあります.前述のようにCanvasにメソッドを使用して図形などを描く場合は,Canvas全体が1つのノードになりますが,クラスを使用した場合それ自体を1つのノードとしてSceneGraphを作ることができます.
文字や,画像を一つのノードとして用いたい場合は,次のようなクラスを用います.
Text | 文字列を表示する |
ImageView | 画像を表示する |
ノードとして使用できる図形のクラスは次のものがあります.
図形 | 説明 |
---|---|
Arc | 中心点,開始角(度),角の大きさ(円弧の長さ(度))および円弧タイプ(ArcType.OPEN,ArcType.CHORD,ArcType.ROUND)で定義される2D円弧オブジェクト |
Circle | 指定された半径と中心位置(ピクセル単位)に基づいて円を作成 |
CubicCurve | (x,y)座標空間の3次ベジェ曲線を定義.指定された点(controlX1, controlY1)と(controlX2, controlY2)をベジェ制御点として使用し,指定された座標(startX, startY)と(endX, enfY)の両方を通る曲線を描画 |
Ellipse | 指定されたサイズと位置(ピクセル単位)に基づいて楕円を作成 |
Line | (x,y)座標空間の直線 |
Polygon | x,y座標の配列によって定義される多角形を作成 |
Polyline | x,y座標の配列によって定義される折れ線を作成 |
QuadCurve | (x,y)座標空間の2次ベジェ曲線を定義.指定された点(controlX, controlY)をベジェ制御点として使用し,指定された座標(startX, startY)と(endX, enfY)の両方を通る曲線を描画 |
Rectangle | 指定されたサイズと位置に基づいて矩形を定義.丸い角にする場合は,arcWidth,arcHeightを正の値に設定することで指定できる. |
列挙型定数 | 説明 | 値 | 意味 |
---|---|---|---|
ArcType | Arcオブジェクトの閉じ方の種類を指定 | CHORD | 弧セグメントの始点と終点を結ぶ直線セグメントを描画することによって閉じられる弧の閉じ方 |
OPEN | 弧セグメントの両端を結ぶパス・セグメントを持たない開いた弧の閉じ方 | ||
ROUND | 弧セグメントの始点から楕円の中心までの直線セグメントと、楕円の中心から弧セグメントの終点までの直線セグメントを描画することによって、閉じられる弧の閉じ方 | ||
FillRule | パスの内部を決める塗りつぶし規則 | EVEN_ODD | パスの内部を決める偶奇塗りつぶしルールを定義 |
NON_ZERO | パスの内部を決める非ゼロ塗りつぶしルールを定義 | ||
StrokeLineCap | Shapeのエンド・キャップ・スタイルを定義 | BUTT | 輪郭線,破線セグメントの端に装飾を付けず終了 |
ROUND | 輪郭線,破線セグメントの端に丸い装飾を付けて終了 | ||
SQUARE | 輪郭線,破線セグメントの端に正方形を付けて終了 | ||
StrokeLineJoin | Shapeの線結合スタイルを定義 | BEVEL | 輪郭線の外側の角を直線に接合するように輪郭線を接合 |
NITER | 輪郭線の外側の端が重なるまで延長して輪郭線を接合 | ||
ROUND | 角を丸く切り落として輪郭線を接合 | ||
StrokeType | 図形の境界線を描画する位置を定義 | CENTERED | 境界線を図形の境界が中心になるように描く |
INSIDE | 境界線を図形の境界の内側に描く | ||
OUTSIDE | 境界線を図形の境界の外側に描く |
上記以外にも,パス(経路)を表すものや立体的な図形を表すものが用意されています.
import javafx.application.Application; import javafx.geometry.Insets; import javafx.geometry.Pos; import javafx.scene.Group; import javafx.scene.Scene; import javafx.scene.image.Image; import javafx.scene.image.ImageView; import javafx.scene.layout.HBox; import javafx.scene.layout.VBox; import javafx.scene.paint.Color; import javafx.scene.shape.*; import javafx.scene.text.Font; import javafx.scene.text.Text; import javafx.scene.text.TextAlignment; import javafx.stage.Stage; public class ShapeExample extends Application{ public static void main(String[] args) { launch(args); } @Override public void start(Stage stage) throws Exception { stage.setTitle("Shape Examples"); VBox root = new VBox(); root.setAlignment(Pos.CENTER); root.setPadding(new Insets(10,10,10,10)); root.setSpacing(20.0); HBox pane1 = new HBox(); pane1.setAlignment(Pos.CENTER); pane1.setPadding(new Insets(10,10,10,10)); pane1.setSpacing(70.0); //弧 Arc arc = new Arc(); arc.setCenterX(50.0f); //中心のx座標 arc.setCenterY(50.0f); //中心のy座標 arc.setRadiusX(25.0f); //x方向の半径 arc.setRadiusY(25.0f); //y方向の半径 arc.setStartAngle(45.0f); //弧の開始角度 arc.setLength(270.0f); //弧の終了角度 arc.setType(ArcType.ROUND); //弦の形状 //円 Circle circle = new Circle(); circle.setCenterX(100.0f); //中心のx座標 circle.setCenterY(100.0f); //中心のy座標 circle.setRadius(50.0f); //半径 //3次ベジエ曲線 CubicCurve cubic = new CubicCurve(); cubic.setStartX(0.0f); //始点のx座標 cubic.setStartY(50.0f); //始点のy座標 cubic.setControlX1(25.0f); //第1制御点のx座標 cubic.setControlY1(0.0f); //第1制御点のy座標 cubic.setControlX2(75.0f); //第2制御点のx座標 cubic.setControlY2(100.0f); //第2制御点のy座標 cubic.setEndX(100.0f); //終点のx座標 cubic.setEndY(50.0f); //終点のy座標 //楕円 Ellipse ellipse = new Ellipse(); ellipse.setCenterX(50.0f); //中心のx座標 ellipse.setCenterY(50.0f); //中心のy座標 ellipse.setRadiusX(50.0f); //x方向半径 ellipse.setRadiusY(25.0f); //y方向半径 pane1.getChildren().addAll(arc, circle, cubic, ellipse); /************************************************/ HBox pane2 = new HBox(); pane2.setAlignment(Pos.CENTER); pane2.setPadding(new Insets(10,10,10,10)); pane2.setSpacing(100.0); //直線 Line line = new Line(); line.setStartX(0.0f); //始点のx座標 line.setStartY(0.0f); //始点のy座標 line.setEndX(100.0f); //終点のx座標 line.setEndY(100.0f); //終点のy座標 //多角形 Polygon polygon = new Polygon(); polygon.getPoints().addAll(new Double[]{ 0.0, 0.0, 20.0, 10.0, 10.0, 20.0 }); //(0,0),(20,10),(10,20)が頂点 //折れ線 Polyline polyline = new Polyline(); polyline.getPoints().addAll(new Double[]{ 0.0, 0.0, 20.0, 10.0, 10.0, 20.0 }); //2次ベジエ曲線 QuadCurve quad = new QuadCurve(); quad.setStartX(0.0f); //始点のx座標 quad.setStartY(50.0f); //始点のy座標 quad.setEndX(50.0f); //終点のx座標 quad.setEndY(50.0f); //終点のy座標 quad.setControlX(25.0f); //制御点のx座標 quad.setControlY(0.0f); //制御点のy座標 pane2.getChildren().addAll(line, polygon, polyline, quad); /*************************************************/ Group pane3 = new Group(); //コンテナとしてGroupを使用 //長方形(角丸) Rectangle rect = new Rectangle(); rect.setX(0); //左上角のx座標 rect.setY(0); //左上角のy座標 rect.setWidth(280); //幅 rect.setHeight(220); //高さ rect.setArcWidth(20); //角の丸みの幅 rect.setArcHeight(20); //角の丸みの高さ rect.setFill(Color.MAGENTA); //塗りつぶしの色 rect.setStrokeWidth(10); //線の太さ rect.setStroke(Color.BLUE); //線の色 //文字 Text text = new Text(); text.setX(100); //開始位置のx座標 text.setY(120); //開始位置のy座標 text.setFont(new Font(40)); //フォントの設定(太さ) text.setWrappingWidth(200); //折り返し位置 text.setTextAlignment(TextAlignment.JUSTIFY); //両端揃え text.setFill(Color.GREEN); //色 text.setText("紅葉"); //内容 Circle c = new Circle(); c.setCenterX(140); c.setCenterY(110); c.setRadius(72); c.setFill(Color.YELLOW); c.setOpacity(0.4); //画像 Image image = new Image(getClass().getResource("momiji.jpg").toExternalForm()); ImageView iv = new ImageView(); iv.setX(20); //左上のx座標 iv.setY(20); //左上のy座標 iv.setImage(image); //画像の設置 pane3.getChildren().addAll(rect,iv, c, text); //Groupに登録した場合は順に重なる /****************************************************/ root.getChildren().addAll(pane1,pane2,pane3); Scene scene = new Scene(root); stage.setScene(scene); stage.show(); } }
import javafx.application.Application; import javafx.geometry.Insets; import javafx.geometry.Pos; import javafx.scene.Scene; import javafx.scene.layout.VBox; import javafx.scene.shape.*; import javafx.stage.Stage; public class ShapePathExample extends Application{ public static void main(String[] args) { launch(args); } @Override public void start(Stage stage) throws Exception { stage.setTitle("Shape Path Examples"); VBox root = new VBox(); root.setAlignment(Pos.CENTER); root.setPadding(new Insets(10,10,10,10)); root.setSpacing(5.0); Path path = new Path(); //描画点の移動 MoveTo moveTo = new MoveTo(); moveTo.setX(0.0f); moveTo.setY(0.0f); //水平線 HLineTo hLineTo = new HLineTo(); hLineTo.setX(70.0f); //2次ベジエ曲線 QuadCurveTo quadCurveTo = new QuadCurveTo(); quadCurveTo.setX(120.0f); quadCurveTo.setY(60.0f); quadCurveTo.setControlX(100.0f); quadCurveTo.setControlY(0.0f); //直線 LineTo lineTo = new LineTo(); lineTo.setX(175.0f); lineTo.setY(55.0f); //弧 ArcTo arcTo = new ArcTo(); arcTo.setX(50.0f); arcTo.setY(50.0f); arcTo.setRadiusX(50.0f); arcTo.setRadiusY(50.0f); //経路(パス)の接続 path.getElements().add(moveTo); path.getElements().add(hLineTo); path.getElements().add(quadCurveTo); path.getElements().add(lineTo); path.getElements().add(arcTo); root.getChildren().add(path); Scene scene = new Scene(root); stage.setScene(scene); stage.show(); } }
中心角が90度の弧を,半径の比がフィボナッチ数列になるように変化させながら,毎回色が変わるようにして表示するプログラムを作る.クラス名は「Ex11_1」とする.
グラフィカルなノードに様々な視覚効果を設定することが出来ます.
図形などを塗りつぶす時に,単色ではなく色が連続的に変化するようなパターンが使用できます.
図形を線形のグラデーション・パターンで塗りつぶします
属性 | 値 | 説明 |
---|---|---|
startX | Double | グラデーション開始位置のx座標 |
startY | Double | グラデーション開始位置のy座標 |
endX | Double | グラデーション終了位置のx座標 |
endY | Double | グラデーション終了位置のy座標 |
proportional | Boolean | 座標が,グラデーションされる図形に対してプロポーショナルかどうか |
cycleMethod | CycleMethod | グラデーションの繰り返し方の指定 |
stops | List<Stop> | グラデーションに使用する色のリストを設定 |
図形を放射状のグラデーション・パターンで塗りつぶします
属性 | 値 | 説明 |
---|---|---|
focusAngle | Double | グラデーションの中心から,最初の色がマップされる焦点までの角度(度) |
focusDistance | Double | グラデーションの中心から,最初の色がマップされる焦点までの距離 |
centerX | Double | グラデーションの中心点のX座標 |
centerY | Double | グラデーションの中心点のY座標 |
radius | Double | グラデーションの広がりを定義する円の半径 |
proportional | boolean | 比例座標およびサイズが,グラデーションされる図形に対してプロポーショナルかどうか |
cycleMethod | CycleMethod | グラデーションの繰り返し方の指定 |
Stops | List<Stop> | グラデーションに使用する色のリストを設定 |
CycleMethod | 説明 |
---|---|
CycleMethod.NO_CYCLE | 終点の色を使用して残りの領域を塗りつぶす |
CycleMethod.REFLECT | 始点側から終点側へのグラデーション色と終点側から始点側へのグラデーション色が対称になるように残りの領域を塗りつぶす |
CycleMethod.REPEAT | グラデーション色を繰り返して残りの領域を塗りつぶす |
import javafx.application.Application; import javafx.geometry.Insets; import javafx.geometry.Pos; import javafx.stage.Stage; import javafx.scene.Scene; import javafx.scene.layout.VBox; import javafx.scene.paint.Color; import javafx.scene.paint.LinearGradient; import javafx.scene.paint.RadialGradient; import javafx.scene.paint.CycleMethod; import javafx.scene.paint.Stop; import javafx.scene.shape.Rectangle; public class GradationExample extends Application{ public static void main(String[] args) { launch(args); } @Override public void start(Stage stage) throws Exception { stage.setTitle("Gradation Example"); VBox root = new VBox(); root.setAlignment(Pos.CENTER); root.setPadding(new Insets(10,10,10,10)); root.setSpacing(5.0); //gradation Stop[] stops = new Stop[] {new Stop(0,Color.RED),new Stop(0.5,Color.GREEN),new Stop(1.0,Color.BLUE)}; LinearGradient lg1 = new LinearGradient(0,0,1,0,true,CycleMethod.REFLECT,stops); Rectangle rect1 = new Rectangle(150,100,lg1); LinearGradient lg2 = new LinearGradient(0,0,150,100,false,CycleMethod.REPEAT,stops); Rectangle rect2 = new Rectangle(150,100,lg2); RadialGradient rg = new RadialGradient(-45,0.5,0.5,0.5,0.6,true,CycleMethod.REFLECT,stops); Rectangle rect3 = new Rectangle(150,100,rg); root.getChildren().addAll(rect1,rect2,rect3); Scene scene = new Scene(root); stage.setScene(scene); stage.show(); } }
画像や図形に対して次のような視覚効果を設定することができます.
Blend | BlendModeを使用して2つの入力をブレンド |
Bloom | しきい値に基づいて,入力イメージが光って見える輝度の高い部分を作成 |
BoxBlur | 矩形のぼかし効果を設定 |
ColorAdjust | 色相,彩度,明度およびコントラストをピクセルごとに調整 |
ColorInput | 指定されたPaintで塗りつぶされた矩形領域をレンダリング |
DisplacementMap | 指定されたFloatMapの最初の2つのバンドで指定された距離だけ各ピクセルを移動する |
DropShadow | 指定された色,半径およびオフセットで特定のコンテンツの後ろにそのコンテンツの影をレンダリングする |
GaussianBlur | 構成可能な半径を使用したガウス畳込みカーネルを使用するぼかし効果 |
Glow | しきい値に基づいて,入力イメージが光って見えるようにする |
ImageInput | 指定されたImageを変更せずに単純に入力として別のEffectに渡す |
InnerShadow | 指定された色,半径およびオフセットで特定のコンテンツの端の内側に影をレンダリングする |
Lighting | 特定のコンテンツを照らす光源をシミュレートし,平坦なオブジェクトに3次元の外観を与える |
MotionBlur | 構成可能な半径および角度を使用したガウス畳込みカーネルを使用するモーションぼかし効果 |
PerspectiveTransform | 入力コンテンツの非アフィン変換を提供する.2次元のコンテンツに擬似的な3次元効果を適用するために使用 |
Reflection | 実際の入力コンテンツの下に入力コンテンツの反射されたバージョンをレンダリングする効果 |
SepiaTone | アンティーク写真のようなセピア・トーンの効果を生成するフィルタ |
Shadow | 輪郭がぼやけた入力のモノクロの複製を作成する効果 |
Blend効果を使用するときに,どのような合成方法を用いるかを指定します.
種類 | 説明 |
---|---|
ADD | 最上部の入力の色成分およびアルファ成分が下入力のそれらの成分に加算されます. |
BLUE | 下入力の青色成分が最上部の入力の青色成分で置き換えられ,他の色成分は影響を受けません. |
COLOR_BURN | 下入力の色成分の補数が最上部の入力の色成分で除算され,そのすべてが反転されて結果の色が生成されます. |
COLOR_DODGE | 下入力の色成分が最上部の入力の色成分の補数で除算されて結果の色が生成されます. |
DARKEN | 2つの入力の色成分の暗い方が選択されて結果の色が生成されます. |
DIFFERENCE | 2つの入力の色成分の暗い方が明るい方から減算されて結果の色が生成されます. |
EXCLUSION | 2つの入力の色成分が乗算され,2倍にされてから,下入力の色成分の合計から減算されて結果の色が生成されます. |
GREEN | 下入力の緑色成分が最上部の入力の緑色成分で置き換えられ,他の色成分は影響を受けません. |
HARD_LIGHT | 入力の色成分が最上部の入力の色に応じて乗算またはスクリーン処理されます. |
LIGHTEN | 2つの入力の色成分の明るい方が選択されて結果の色が生成されます. |
MULTIPLY | 最初の入力の色成分が2番目の入力の色成分で乗算されます. |
OVERLAY | 入力の色成分が下入力の色に応じて乗算またはスクリーン処理されます. |
RED | 下入力の赤色成分が最上部の入力の赤色成分で置き換えられ,他の色成分は影響を受けません. |
SCREEN | 両方の入力の色成分が反転されて掛け合わされ,その結果がさらに反転されて結果の色が生成されます. |
SOFT_LIGHT | 入力の色成分が最上部の入力の色に応じて暗くなるか明るくなります. |
SRC_ATOP | 下入力の内部にある最上部の入力の一部が下入力とブレンドされます. |
SRC_OVER | 最上部の入力が下入力の上でブレンドされます. |
影を付ける(drop shadow),色の合成(blend:COLOR_BURN),セピア色(SepiaTone),輝き(Bloom)の使用例.
import javafx.application.Application; import javafx.geometry.Insets; import javafx.geometry.Pos; import javafx.stage.Stage; import javafx.scene.Group; import javafx.scene.Scene; import javafx.scene.layout.HBox; import javafx.scene.layout.VBox; import javafx.scene.paint.Color; import javafx.scene.text.Font; import javafx.scene.text.FontWeight; import javafx.scene.text.Text; import javafx.scene.image.Image; import javafx.scene.image.ImageView; import javafx.scene.paint.LinearGradient; import javafx.scene.paint.CycleMethod; import javafx.scene.paint.Stop; import javafx.scene.effect.DropShadow; import javafx.scene.effect.ImageInput; import javafx.scene.effect.SepiaTone; import javafx.scene.effect.Blend; import javafx.scene.effect.BlendMode; import javafx.scene.effect.Bloom; import javafx.scene.effect.ColorInput; import javafx.scene.shape.Rectangle; public class EffectExample extends Application{ public static void main(String[] args) { launch(args); } @Override public void start(Stage stage) throws Exception { stage.setTitle("Effect Examples"); VBox root = new VBox(); root.setAlignment(Pos.CENTER); root.setPadding(new Insets(10,10,10,10)); root.setSpacing(5.0); HBox pane1 = new HBox(); pane1.setAlignment(Pos.CENTER); pane1.setPadding(new Insets(10,10,10,10)); pane1.setSpacing(5.0); /********************************************************************/ //DropShadow DropShadow dropShadow = new DropShadow(); dropShadow.setRadius(5.0); dropShadow.setOffsetX(3.0); dropShadow.setOffsetY(3.0); dropShadow.setColor(Color.color(0.2, 0.3, 0.3)); Text text = new Text("Drop Shadow"); text.setFont(Font.font(32)); text.setFill(Color.RED); text.setEffect(dropShadow); /*******************************************************************/ //表示を重ねる変換の設定 Blend blend = new Blend(); blend.setMode(BlendMode.COLOR_BURN); //色を重ねる ColorInput colorInput = new ColorInput(); colorInput.setPaint(Color.STEELBLUE); colorInput.setX(5); colorInput.setY(5); colorInput.setWidth(80); colorInput.setHeight(190); blend.setTopInput(colorInput); Stop[] stops = new Stop[] {new Stop(0,Color.LIGHTSTEELBLUE),new Stop(1.0,Color.PALEGREEN)}; LinearGradient lg = new LinearGradient(0,0,0.25,0.25,true,CycleMethod.REFLECT,stops); Rectangle rect1 = new Rectangle(200,80,lg); Rectangle rect2 = new Rectangle(200,80,Color.LIGHTPINK); rect2.setY(100); Text text1 = new Text(); text1.setX(10); text1.setY(50); text1.setFill(Color.PALEVIOLETRED); text1.setText("COLOR_BURN"); text1.setFont(Font.font(null,FontWeight.BOLD,24)); Text text2 = new Text(); text2.setX(10); text2.setY(150); text2.setFill(Color.BROWN); text2.setText("COLOR_BURN"); text2.setFont(Font.font(null,FontWeight.BOLD,24)); Group group = new Group(); group.setEffect(blend); group.getChildren().addAll(rect1,rect2,text1,text2); /******************************************************************/ Blend blend2 = new Blend(); blend2.setMode(BlendMode.COLOR_BURN); //画像と重ねる Image img = new Image(getClass().getResource("momiji.jpg").toExternalForm(),240,180,false,false); ImageInput imageInput = new ImageInput(img); imageInput.setX(10); imageInput.setY(10); blend2.setTopInput(imageInput); Rectangle rect3 = new Rectangle(200,80,lg3); Rectangle rect4 = new Rectangle(200,80,Color.LIGHTPINK); rect4.setY(100); Text text3 = new Text(); text3.setX(10); text3.setY(50); text3.setFill(Color.PALEVIOLETRED); text3.setText("IMAGE_BURN"); text3.setFont(Font.font(null,FontWeight.BOLD,24)); Text text4 = new Text(); text4.setX(10); text4.setY(150); text4.setFill(Color.BROWN); text4.setText("IMAGE_BURN"); text4.setFont(Font.font(null,FontWeight.BOLD,24)); Group group2 = new Group(); group2.setEffect(blend2); group2.getChildren().addAll(rect3,rect4,text3,text4); /*********************************************************************/ pane1.getChildren().addAll(group,group2); /********************************************************************/ HBox pane2 = new HBox(); pane2.setAlignment(Pos.CENTER); pane2.setPadding(new Insets(10,10,10,10)); pane2.setSpacing(5.0); /********************************************************************/ //セピア色に変換 SepiaTone sepiaTone = new SepiaTone(); sepiaTone.setLevel(0.9); Image img2 = new Image(getClass().getResource("momiji.jpg").toExternalForm(),240,180,false,false); ImageView imageView = new ImageView(img2); imageView.setEffect(sepiaTone); /************************************************************************/ //輝き効果 Bloom bloom = new Bloom(); bloom.setThreshold(0.1); Rectangle rect8 = new Rectangle(); rect8.setX(10); rect8.setY(10); rect8.setWidth(180); rect8.setHeight(150); rect8.setFill(Color.DARKSLATEBLUE); Text text5 = new Text(); text5.setX(25); text5.setY(65); text5.setFill(Color.ALICEBLUE); text5.setText("Bloom!"); text5.setFont(Font.font(null,FontWeight.BOLD,40)); text5.setEffect(bloom); Text text6 = new Text(); text6.setX(25); text6.setY(130); text6.setFill(Color.LIGHTGREEN); text6.setText("Bloom!"); text6.setFont(Font.font(null,FontWeight.BOLD,40)); text6.setEffect(bloom); Group group3 = new Group(); group3.getChildren().addAll(rect8,text5,text6); pane2.getChildren().addAll(imageView,group3); /**************************************************************************/ root.getChildren().addAll(text,pane1,pane2); Scene scene = new Scene(root); stage.setScene(scene); stage.show(); } }
3つのぼかし効果(BoxBlur,GaussianBlur,MotionBlur),照明(Lighting),色変換(ColorAdjust),反射像(Reflection),画素ずらし(FloatMap),遠近法(Perspective)の使用例.
import javafx.application.Application; import javafx.geometry.Insets; import javafx.geometry.Pos; import javafx.stage.Stage; import javafx.scene.Group; import javafx.scene.Scene; import javafx.scene.layout.HBox; import javafx.scene.layout.VBox; import javafx.scene.paint.Color; import javafx.scene.text.Font; import javafx.scene.text.FontWeight; import javafx.scene.text.Text; import javafx.scene.image.Image; import javafx.scene.image.ImageView; import javafx.scene.effect.FloatMap; import javafx.scene.effect.GaussianBlur; import javafx.scene.effect.Light; import javafx.scene.effect.Lighting; import javafx.scene.effect.MotionBlur; import javafx.scene.effect.PerspectiveTransform; import javafx.scene.effect.Reflection; import javafx.scene.effect.BoxBlur; import javafx.scene.effect.ColorAdjust; import javafx.scene.effect.DisplacementMap; import javafx.scene.shape.Circle; import javafx.scene.shape.Rectangle; public class SecondEffect extends Application{ public static void main(String[] args) { launch(args); } @Override public void start(Stage stage) throws Exception { stage.setTitle("Application FirstEffect"); VBox root = new VBox(); root.setAlignment(Pos.CENTER); root.setPadding(new Insets(10,10,10,10)); root.setSpacing(5.0); HBox pane1 = new HBox(); pane1.setAlignment(Pos.CENTER); pane1.setPadding(new Insets(10,10,10,10)); pane1.setSpacing(5.0); Image image = new Image(getClass().getResource("momiji.jpg").toExternalForm()); ImageView imageView = new ImageView(img); //矩形のぼかし BoxBlur boxBlur = new BoxBlur(); boxBlur.setWidth(10); boxBlur.setHeight(3); boxBlur.setIterations(3); imageView.setEffect(boxBlur); ImageView imageView2 = new ImageView(img); //ガウスぼかし imageView2.setEffect(new GaussianBlur()); //動きを表すぼかし MotionBlur motionBlur = new MotionBlur(); motionBlur.setRadius(30); motionBlur.setAngle(-15.0); ImageView imageView3 = new ImageView(img); imageView3.setEffect(motionBlur); pane1.getChildren().addAll(imageView,imageView2,imageView3); HBox pane2 = new HBox(); pane2.setAlignment(Pos.CENTER); pane2.setPadding(new Insets(10,10,10,10)); pane2.setSpacing(50.0); //光源の設定 Light.Distant light = new Light.Distant(); light.setAzimuth(-135.0); light.setElevation(40); //光により立体的に見える Lighting lighting = new Lighting(); lighting.setLight(light); lighting.setSurfaceScale(5.0); Circle circle = new Circle(); circle.setRadius(75); circle.setFill(Color.STEELBLUE); circle.setEffect(lighting); //色相,彩度,明度,コントラストを変更 ColorAdjust colorAdjust = new ColorAdjust(); colorAdjust.setContrast(0.2); colorAdjust.setHue(-0.05); colorAdjust.setBrightness(0.2); colorAdjust.setSaturation(0.2); ImageView imageView4 = new ImageView(img); imageView4.setEffect(colorAdjust); //反射像を表示 Reflection reflection = new Reflection(); reflection.setFraction(0.7); Text text = new Text(); text.setX(10.0); text.setY(50.0); //text.setCache(true); text.setText("Reflections"); text.setFill(Color.STEELBLUE); text.setFont(Font.font(null, FontWeight.BOLD, 40)); text.setEffect(reflection); pane2.getChildren().addAll(circle,imageView4,text); HBox pane3 = new HBox(); pane3.setAlignment(Pos.CENTER); pane3.setPadding(new Insets(10,10,10,10)); pane3.setSpacing(50.0); //画素単位でずらして表示 int width = 220; int height = 100; FloatMap floatMap = new FloatMap(); floatMap.setWidth(width); floatMap.setHeight(height); for (int i = 0; i < width; i++) { double v = (Math.sin(i / 20.0 * Math.PI) - 0.5) / 40.0; for (int j = 0; j < height; j++) { floatMap.setSamples(i, j, 0.0f, (float) v); } } DisplacementMap displacementMap = new DisplacementMap(); displacementMap.setMapData(floatMap); Text text2 = new Text(); text2.setX(40.0); text2.setY(80.0); text2.setText("Wavy Text"); text2.setFill(Color.BLUE); text2.setFont(Font.font(null, FontWeight.BOLD, 50)); text2.setEffect(displacementMap); //遠近法による変形 PerspectiveTransform perspectiveTrasform = new PerspectiveTransform(); perspectiveTrasform.setUlx(10.0); perspectiveTrasform.setUly(10.0); perspectiveTrasform.setUrx(310.0); perspectiveTrasform.setUry(40.0); perspectiveTrasform.setLrx(310.0); perspectiveTrasform.setLry(60.0); perspectiveTrasform.setLlx(10.0); perspectiveTrasform.setLly(90.0); Group g = new Group(); g.setEffect(perspectiveTrasform); //g.setCache(true); Rectangle rect = new Rectangle(); rect.setX(10.0); rect.setY(10.0); rect.setWidth(280.0); rect.setHeight(80.0); rect.setFill(Color.RED); Text text3 = new Text(); text3.setX(20.0); text3.setY(65.0); text3.setText("Perspective"); text3.setFill(Color.ALICEBLUE); text3.setFont(Font.font(null, FontWeight.BOLD, 36)); g.getChildren().addAll(rect, text3); pane3.getChildren().addAll(text2,g); root.getChildren().addAll(pane1,pane2,pane3); Scene scene = new Scene(root); stage.setScene(scene); stage.show(); } }
図形や画像に色々な効果を設定してみる.クラス名は「Ex11_2」とする.