JavaFX 画布绘制大量对象 (<250,000 => 500x500像素)

Question

这是我第一次向Stackoverflow提问，请大家温柔点 :)

最近我发现JavaFX是一种为Java应用程序设计GUI的新方法。目前，我正在开发一个需要在Canvas上绘制多达500x500（250,000）个对象的项目，这些对象的大小可以从1x1像素到20x20像素不等（都是相同的尺寸）。 但遗憾的是，性能并不理想。绘制一个由500x500个矩形组成的场景需要约10秒的时间。 我做了一个示例应用程序来演示这个问题。

为什么性能这么差？因为绘制发生在UI线程中，直到绘制完成之前，UI会被阻塞。 我有两种方案：

1. 让绘制变快。
2. 在单独的线程中绘制到缓冲对象上，并将结果显示在画布上。

我的尝试是先写入到BufferedImage，然后再在画布上绘制该图像，但失败了（画布保持为空）。

感谢您抽出时间帮助研究这个话题:)

sample.fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.*?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.layout.GridPane?>

<AnchorPane prefHeight="275.0" prefWidth="300.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2" fx:controller="sample.Controller">
  <children>
    <ScrollPane fx:id="scrollPane" content="$null" prefHeight="237.0" prefWidth="300.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="38.0" />
    <Button layoutX="14.0" layoutY="14.0" mnemonicParsing="false" onAction="#draw" text="Draw" />
  </children>
</AnchorPane>

Controller.java:

package sample;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.control.ScrollPane;
import javafx.scene.paint.Color;

import java.util.Random;

public class Controller {

    @FXML
    private ScrollPane scrollPane;

    Canvas canvas;
    @FXML
    protected void draw(ActionEvent event) {
    canvas = new Canvas(500,500);
    scrollPane.setContent(canvas);
    GraphicsContext gc = canvas.getGraphicsContext2D();
        Random r = new Random();

        for(int i = 0; i<=500; i++) {
            for(int j = 0; j<=500; j++) {
                if (r.nextBoolean()) {
                    gc.setFill(Color.BLACK);
                } else {
                    gc.setFill(Color.BLUE);
                }
                gc.fillRect(i, j, i+1, j+1);
            }
        }
    }
}

Main.java:

package sample;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.ScrollPane;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception{
        Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));
        ScrollPane scrollPane = (ScrollPane) root.lookup("#scrollPane");
        primaryStage.setTitle("Hello World");
        primaryStage.setScene(new Scene(root, 300, 275));
        primaryStage.show();
    }


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

- Tim

---

我想我可能知道问题出在哪里了，看一下 gc.fillRect(i, j, i+1, j+1); 这里的大小是根据 i 和 j 变化的。所以假设你移除 i 和 j，它会以每个像素非常快的速度绘制。 gc.fillRect(i, j, 1, 1); - zIronManBox

另一种方法是分层画布，使用不同的画布作为背景和前景，更新对象1、更新对象2，从而堆叠多个画布。 - zIronManBox

你是如何克服这个问题的？ - zIronManBox

Answer 1

我怀疑问题的根本原因可能与每次绘制调用时创建画布上下文有关。如果您只在一次操作中填充画布并保留对其的引用，则可能会看到改进。换句话说：

protected void draw(...) { canvas = new Canvas(...); }

应该移动到初始化中。

public void start(...) { ... /* Other initialization. */ ... ; canvas = new Canvas(...); }

其他的都可以保持不变。

编辑1：我知道这个问题已经过时了，但它在谷歌上排名很高，对后人来说应该还是有用的。

编辑2：经过进一步调查，我认为这更多地涉及绘图调用的速度，而不是实际获取画布。链接Java硬件加速提供了更多信息。简单地说，我会尝试强制启用硬件加速。您可以通过逐步添加someCanvas.getGraphicsConfiguration() + .getBufferCapabilities() + .isPageFlipping()来检查是否对您的调用进行了激活。

- Joseph Catrambone

---

我刚想起来我之前问过这个问题，下周我会看一下效果的 :) - Tim