Canvas of javafx

A very important and common thing added in javafx 2.2 is canvas.

Canvas in javafx inherits nodes. It is consistent with imageview, mediaview, parent, and shape in terms of hierarchy.

Level 1.

Therefore, canvas cannot be directly added to scene. It must be added to parent and then scene.

The canvas contains a graphicscontext used to draw images in the canvas. In fact, similar to graphics of java2d,

Graphics2d.

Graphicscontext can not only draw various images, but also apply some special effects of javafx. It also has the SAVE and restore functions,

You can save and restore some global parameters.

Let's take a look at the simple functions of canvas.

Create a new class mycanvas to inherit the canvas.

Import javafx. scene. canvas. canvas; import javafx. scene. canvas. graphicscontext; import javafx. scene. paint. color; import javafx. scene. shape. arctype; public class mycanvas extends canvas {private graphicscontext GC; Public mycanvas (double width, double height) {super (width, height); GC = getgraphicscontext2d (); draw (GC);} public void draw (graphicscontext GC) {GC. save (); GC. setstroke (color. blue); GC. setlinewidth (2); // set the line width GC. strokeline (0, 0, 50, 50); // draw a straight line GC. restore (); // plot an elliptical GC. save (); GC. setfill (color. yellowgreen); GC. strokeoval (0, 80, 50, 50); GC. filloval (100, 80, 50, 50); GC. restore (); // draw a rectangular GC. save (); GC. setstroke (color. chocolate); GC. fillrect (0,150, 50, 50); GC. strokerect (100,150, 50, 50); GC. restore (); // draw the rounded rectangle GC. save (); GC. setfill (color. chocolate); GC. fillroundrect (0,220, 50, 50, 15, 15); GC. strokeroundrect (100,220, 50, 50, 15, 15); GC. restore (); // draw a sector GC. save (); GC. setstroke (color. chocolate); GC. fillarc (10,300, 30, 30, 40,280, arctype. open); GC. fillarc (60,300, 30, 30, 40,280, arctype. chord); GC. fillarc (110,300, 30, 30, 40,280, arctype. round); GC. strokearc (10,340, 30, 30, 40,280, arctype. open); GC. strokearc (60,340, 30, 30, 40,280, arctype. chord); GC. strokearc (110,340, 30, 30, 40,280, arctype. round); GC. restore (); // draw a polygon GC. save (); GC. setfill (color. red); GC. setstroke (color. chocolate); GC. fillpolygon (New Double [] {0, 40, 50, 60,100, 70, 85, 50, 15, 30}, new double [] {440,440,400,440,440,460,500,470,500,460}, 10); GC. strokepolygon (New Double [] {0, 40, 50, 60,100, 70, 85, 50, 15, 30}, new double [] {440,440,400,440,440,460,500,470,500,460}, 10); GC. restore ();}}

The basic graph is similar to that in Java and Android. Save and restore are also implemented here.

.

Create the main class of javafx and add the canvas to the root node.

 

import javafx.application.Application;import javafx.scene.Group;import javafx.scene.Scene;import javafx.stage.Stage;public class MainClass extends Application {    private static final int WIDTH = 800;private static final int HEIGHT = 600;@Overridepublic void start(Stage primaryStage) {MyCanvas mCanvas = new MyCanvas(WIDTH, HEIGHT);Group root = new Group();root.getChildren().add(mCanvas);Scene scene = new Scene(root, WIDTH, HEIGHT);primaryStage.setTitle("JavaFX Canvas");primaryStage.setScene(scene);primaryStage.show();}public static void main(String[] args) {launch(args);}}

Let's take a look at the running effect:

These are just basic graphics. Of course, you can also use applyeffect to easily apply some special effects.

We need to perform flexible operations on our own to make outstanding results.

So the canvas introduction is now here.

Reprinted please indicate the source: http://blog.csdn.net/ml3947