JavaFX WebView:透明WebView保持绘制旧内容

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaFX WebView:透明WebView保持绘制旧内容相关的知识,希望对你有一定的参考价值。

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();
        
    

图片:enter image description here

是否有办法避免在加载新内容后保留旧内容?

答案

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

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

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

以上是关于JavaFX WebView:透明WebView保持绘制旧内容的主要内容,如果未能解决你的问题,请参考以下文章

为啥JavaFX的WebView是红绿闪烁?

使用 javafx 从 webview 获取内容

javafx webview js交互问题

JavaFX : 使用 JavaFX 嵌入浏览器而不是可用的 webview

JavaFX 中 WebView 的性能

JavaFX 2.0+ WebView /WebEngine 将网页呈现为图像