定时JavaFX Canvas应用程序

时间:2017-05-18 14:18:36

标签: performance swing javafx graphics

为了练习JavaFX,我构建了一个绘制Sierpinski Triangles的简单应用程序。

import javafx.application.Application;
import javafx.application.Platform;
import javafx.concurrent.Task;
import javafx.geometry.Insets;
import javafx.geometry.Point2D;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class SierpinskiTriangles extends Application {

    private final int PADDING = 5;
    private static int numberOfLevels;

    public static void launch(String... args){

        numberOfLevels = 8;

        if((args != null) && (args.length > 0)) {

            int num = -1;
            try {
                num = Integer.parseInt(args[0]);
            } catch (NumberFormatException ex) {
                            ex.printStackTrace();
                return;
            }

            numberOfLevels = (num > 0) ? num : numberOfLevels;
        }

        Application.launch(args);
    }

    @Override
    public void start(Stage stage) {

        stage.setOnCloseRequest((ae) -> {
            Platform.exit();
            System.exit(0);
        });

        stage.setTitle("Sierpinski Triangles (fx)");

        BorderPane mainPane = new BorderPane();
        mainPane.setPadding(new Insets(PADDING));

        Pane triPanel = new Triangles();

        BorderPane.setAlignment(triPanel, Pos.CENTER);
        mainPane.setCenter(triPanel);

        Scene scene = new Scene(mainPane);

        stage.setScene(scene);
        stage.centerOnScreen();

        stage.setResizable(false);
        stage.show();
    }

    class Triangles  extends AnchorPane{

        private static final int PANEL_WIDTH =600, PANEL_HEIGHT = 600;
        private static final int TRI_WIDTH= 500, TRI_HEIGHT= 500;
        private static final int SIDE_GAP = (PANEL_WIDTH - TRI_WIDTH)/2;
        private static final int TOP_GAP = (PANEL_HEIGHT - TRI_HEIGHT)/2;
        private int countTriangles;
        private long startTime;
        private Point2D top, left, right;

        private Canvas canvas;
        private GraphicsContext gc;

        Triangles(){

            setPrefSize(PANEL_WIDTH, PANEL_HEIGHT);

            canvas = getCanvas();
            gc = canvas.getGraphicsContext2D();
            getChildren().add(canvas);
            draw(numberOfLevels);
        }

        void draw(int numberLevels) {

            Platform.runLater(new Runnable() {

                @Override
                public void run() {

                    clearCanvas();
                    setStartPoints();

                    startTime = System.currentTimeMillis();
                    countTriangles = 0;

                    RunTask task = new RunTask(numberLevels, top, left, right);
                    Thread thread = new Thread(task);
                    thread.setDaemon(true);
                    thread.start();
                }
            });

        }

        private void drawTriangle( int levels, Point2D top, Point2D left, Point2D right) {

            if(levels < 0) {//add stop criteria
                return ;
            }

            gc.strokePolygon( //implementing with strokeLine did not make much difference
                    new double[]{
                            top.getX(),left.getX(),right.getX()
                    },
                    new double[]{
                            top.getY(),left.getY(), right.getY()
                    },3
                    );

            countTriangles++;

            //Get the midpoint on each edge in the triangle
            Point2D p12 = midpoint(top, left);
            Point2D p23 = midpoint(left, right);
            Point2D p31 = midpoint(right, top);

            // recurse on 3 triangular areas
            drawTriangle(levels - 1, top, p12, p31);
            drawTriangle(levels - 1, p12, left, p23);
            drawTriangle(levels - 1, p31, p23, right);
        }

        private void setStartPoints() {

            top = new Point2D(getPrefWidth()/2, TOP_GAP);
            left = new Point2D(SIDE_GAP, TOP_GAP + TRI_HEIGHT);
            right = new Point2D(SIDE_GAP + TRI_WIDTH, TOP_GAP + TRI_WIDTH);
        }

        private Point2D midpoint(Point2D p1, Point2D p2) {

            return new Point2D((p1.getX() + p2.getX()) /
                    2, (p1.getY() + p2.getY()) / 2);
        }

        private void updateGraphics(boolean success){

            if(success) {

                gc.fillText("Number of triangles: "+ countTriangles,5,15);
                gc.fillText("Time : "+ (System.currentTimeMillis()- startTime)+ " mili seconds", 5,35);
                gc.fillText("Levels: "+ numberOfLevels,5,55);
            }

            System.out.println("Completed after: "+
                    (System.currentTimeMillis()- startTime)+ " mili seconds"
                    +"  Triangles: " + countTriangles  +"  Failed: "+ !success );
        }

        private Canvas getCanvas() {

            Canvas canvas = new Canvas();
            canvas.widthProperty().bind(widthProperty());
            canvas.heightProperty().bind(heightProperty());
            canvas.getGraphicsContext2D().setStroke(Color.RED);
            canvas.getGraphicsContext2D().setLineWidth(0.3f);

            return canvas;
        }

        private void clearCanvas() {

            gc.clearRect(0, 0, canvas.getWidth(), canvas.getHeight());
        }

        class RunTask extends Task<Void>{

            private int levels;
            private Point2D top, left;
            private Point2D right;

            RunTask(int levels, Point2D top, Point2D left, Point2D right){

                this.levels = levels;
                this.top = top;
                this.left = left;
                this.right = right;

                startTime = System.currentTimeMillis();
                countTriangles = 0;
            }

            @Override public Void call() {
                drawTriangle(levels,top, left, right);
                return null;
            }

            @Override
            protected void succeeded() {

                updateGraphics(true);
                super.succeeded();
            }

            @Override
            protected void failed() {

                updateGraphics(false);
            }
        }
    }

    public static void main(String[] args) {
        launch("13");
    }
}


输出符合预期: triangles

我遇到的问题:

一个。 updateGraphics()处的打印输出显示之前(我的机器上为8秒)三角形的绘制完成,因此它不会测量整个过程。我该如何改进?

湾在我的机器上,需要30-35秒才能完全拉出面板。类似的挥杆应用需要4秒钟。这可能表明我的javafx实现存在根本性的错误。

1 个答案:

答案 0 :(得分:7)

您的Task在后台调用drawTriangle()来更新Canvas。关联的GraphicsContext要求&#34;一旦Canvas节点附加到场景,就必须在JavaFX应用程序线程上修改它。&#34;您的深度递归调用会阻止JavaFX应用程序线程,从而阻止及时更新屏幕。相比之下,您的平台System.out.println()的实施可以allow及时报告。即使没有Task,也可以看到时间差异。

很高兴Canvas,&#34;如果它没有附加到任何场景,那么它可以被任何线程修改,只要它一次只能从一个线程使用。&#34 ;可能会在A Task Which Returns Partial Results中提出一种方法。创建一个名义Task<Image>,用于在后台更新分离的Canvas。定期(可能在每个递归级别copy Canvas并通过updateValue()发布快照。封闭的Pane可以侦听任务的value属性,并通过Canvas更新封闭的drawImage(),而不会阻止JavaFX应用程序线程。

可悲的是,如果在JavaFX应用程序线程以外的线程上调用此方法,则快照&#34;抛出IllegalStateException。&#34;

在下面显示的替代方案中,CanvasTask扩展Task<Canvas>并在循环的每次迭代中发布新的Canvas。封闭的CanvasTaskTest会侦听value属性,并在每次新的Canvas到达时替换先前的GraphicsContext。下面的示例显示了一系列深度增加的分形树和组成每个分形树所需的时间。请注意,在Canvas中,&#34;每次调用都会将必要的参数推送到缓冲区,稍后通过渲染线程在脉冲结束时将它们渲染到import javafx.application.Application; import javafx.beans.value.ObservableValue; import javafx.concurrent.Task; import javafx.scene.Scene; import javafx.scene.canvas.Canvas; import javafx.scene.canvas.GraphicsContext; import javafx.scene.layout.StackPane; import javafx.stage.Stage; /** * @see https://stackoverflow.com/a/44056730/230513 */ public class CanvasTaskTest extends Application { private static final int W = 800; private static final int H = 600; @Override public void start(Stage stage) { stage.setTitle("CanvasTaskTest"); StackPane root = new StackPane(); Canvas canvas = new Canvas(W, H); root.getChildren().add(canvas); Scene scene = new Scene(root); stage.setScene(scene); stage.show(); CanvasTask task = new CanvasTask(); task.valueProperty().addListener((ObservableValue<? extends Canvas> observable, Canvas oldValue, Canvas newValue) -> { root.getChildren().remove(oldValue); root.getChildren().add(newValue); }); Thread thread = new Thread(task); thread.setDaemon(true); thread.start(); } private static class CanvasTask extends Task<Canvas> { private int strokeCount; @Override protected Canvas call() throws Exception { Canvas canvas = null; for (int i = 1; i < 15; i++) { canvas = new Canvas(W, H); GraphicsContext gc = canvas.getGraphicsContext2D(); strokeCount = 0; long start = System.nanoTime(); drawTree(gc, W / 2, H - 50, -Math.PI / 2, i); double dt = (System.nanoTime() - start) / 1_000d; gc.fillText("Depth: " + i + "; Strokes: " + strokeCount + "; Time : " + String.format("%1$07.1f", dt) + " µs", 8, H - 8); Thread.sleep(200); // simulate rendering latency updateValue(canvas); } return canvas; } private void drawTree(GraphicsContext gc, int x1, int y1, double angle, int depth) { if (depth == 0) { return; } int x2 = x1 + (int) (Math.cos(angle) * depth * 5); int y2 = y1 + (int) (Math.sin(angle) * depth * 5); gc.strokeLine(x1, y1, x2, y2); strokeCount++; drawTree(gc, x2, y2, angle - Math.PI / 8, depth - 1); drawTree(gc, x2, y2, angle + Math.PI / 8, depth - 1); } } public static void main(String[] args) { launch(args); } } 节点的图像上&#34;这允许JavaFX利用平台的rendering pipeline,但是它可能会为大量笔划带来额外的开销。在实践中,成千上万的笔画在不知不觉中缓慢渲染,而数百万个重叠笔画可能是多余的。

image

id | gallery_id | link | alt | video_image | feature_image | gallery_landscape | gallery_portrait | gallery_six | normal_image