JavaFX WebView：透明 WebView 保持绘制旧内容答案

【问题标题】：JavaFX WebView: Transparent WebView keeps old content drawnJavaFX WebView：透明 WebView 保持绘制旧内容
【发布时间】：2020-09-22 23:23:16
【问题描述】：

JavaFX WebView 可以通过反射变得透明。这允许 WebView 充当 html 叠加层。

很遗憾，在 WebView 中显示新内容时出现问题。旧内容保持绘制，新内容绘制在旧内容之上。

该行为在 Java 10 中不存在，它从 Java 11 开始，在 JavaFX 15 中仍然存在。

这是一个示例，点击黑色文本会将新内容加载到 WebView：

import java.awt.*;
import java.lang.reflect.Field;
import java.lang.reflect.Method;

import javafx.application.Application;
import javafx.beans.value.ObservableValue;
import javafx.concurrent.Worker;
import javafx.scene.Scene;
import javafx.scene.input.MouseEvent;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
import javafx.stage.StageStyle;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) {
        new WebPage(primaryStage);
        primaryStage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

    class WebPage{
        WebView webView = new WebView();
        WebEngine webEngine = webView.getEngine();
        public WebPage(Stage mainstage) {
            Scene scene = new Scene(webView);
            scene.setFill(null);

            mainstage.setScene(scene);
            mainstage.initStyle(StageStyle.TRANSPARENT);

            webEngine.getLoadWorker().stateProperty().addListener(this::changed);
            webEngine.loadContent("<body style='background : rgba(0,0,0,0);font-size: 70px;text-align:center;'>Fixed Number: 1</body>");

            // Click to display old content on top of the old
            scene.addEventHandler(MouseEvent.MOUSE_CLICKED, e -> {
                webEngine.loadContent("<body style='background : rgba(0,0,0,0);font-size: 70px;text-align:center;'>Random Number: " + Math.random() + "</body>");
            });
        }
        private void changed(ObservableValue<? extends Worker.State> observable, Worker.State oldState, Worker.State newState) {
            if (newState == Worker.State.SUCCEEDED) {
                makeWebEngineTransparent(webEngine);
            }
        }
    }

    /** Makes the webEngine transparent through reflection. */
    private void makeWebEngineTransparent(WebEngine webEngine) {
        try {
            Field f = webEngine.getClass().getDeclaredField("page");
            f.setAccessible(true);
            Object page = f.get(webEngine);
            Method m = page.getClass().getMethod("setBackgroundColor", int.class);
            m.setAccessible(true);
            m.invoke(page, (new Color(0, 0, 0, 0)).getRGB());
        } catch ( ReflectiveOperationException e) {
            e.printStackTrace();
        }
    }
}

图片：

有没有办法避免加载新内容后旧内容停留？

【问题讨论】：

标签： java javafx webview

【解决方案1】：

一种解决方法是简单地使用几乎透明的 WebView 而不是完全透明的。

在上面的代码中，将new Color(0, 0, 0, 0) 替换为new Color(0, 0, 0, 1)。这将导致旧内容被删除。

alpha 为 1 将使背景几乎看不到。

【讨论】：

谢谢。它帮助了我。我有一个透明的网站，其中的按钮只有文字。当您将鼠标悬停在按钮上时，它们会变成黑色（不应该这样）。 new Color (0, 0, 0, 1) 解决了这个问题并使一切变得透明。 JDK 15，JavaFX15。