整页截图，Java [英] Whole page screenshot, Java

问题描述

这是我的问题-我有一个用JavaFX编写的桌面应用程序.我需要向用户显示全屏网页，并将呈现的网页另存为PNG.我需要保存整个页面(例如分辨率1920×3500).

Here is my problem - I have a desktop application written in JavaFX. I need to show a full-screen webpage to an user and save the rendered page as PNG. I need to save the whole page (e.g. resolution 1920×3500).

现在，我正在使用Selenium和Firefox来执行此操作.它可以正常工作，但是有一个很大的缺点-用户必须在其计算机上安装Firefox.

Now I'm using Selenium and Firefox to do this. It works fine but there is one big disadvantage - the user must have Firefox installed on his machine.

我尝试使用JavaFX的WebView呈现网页并使用.snapshot().那样很好，但是这种方法并不能给我整个页面，只有WebView的可见部分.有什么方法可以使用WebView获取整个页面快照吗?或任何其他想法如何做到这一点?谢谢.

I've tried to render the webpage using WebView by JavaFX and take a .snapshot(). This would be great but this approach doesn't give me the whole page, only the visible part of the WebView. Is there any approach how to get the whole page snapshot using WebView? Or any other ideas how to do that? Thanks.

推荐答案

经过大量搜索和拼凑，我发现我在oracle论坛上张贴的一些SO-post示例的唯一问题是Webview的大小是固定的，并且需要我的 css用于html (不是JavaFX).

After a lot of searching and scraping several pieces together I found that the only problem I had with an example some SO-poster posted in an oracle forum was that the size of the webview was fixed and that my css used in the html (not in JavaFX) needed.

overflow-x: hidden;
overflow-y: hidden;

隐藏最后一个滚动条.

因此，我想出了以下快照方法(带有动画的应用程序仅作为您的应用程序的示例)，看看它是否适合您的尺寸，否则您可以将javafx.scene.web.WebView.setZoom(double value)的Webview缩小为可以使用的内容，可能会丢失一些分辨率，但至少具有整体效果:

So I come up with the following snapshot method (application with animation just as example of your application) See if it works for your sizes, otherwise you might scale javafx.scene.web.WebView.setZoom(double value) the webview down to something that works, you might lose some resolution, but at least have the whole picture:

package application;

import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;

import javafx.animation.Animation;
import javafx.animation.PauseTransition;
import javafx.animation.TranslateTransition;
import javafx.application.Application;
import javafx.embed.swing.SwingFXUtils;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.effect.GaussianBlur;
import javafx.scene.image.WritableImage;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.web.WebView;
import javafx.stage.Modality;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
import javafx.util.Duration;

public class WebViewSnapshot extends Application {

    BorderPane rootPane;
    TranslateTransition animation;

    @Override
    public void start(Stage primaryStage) {

        Rectangle rect = new Rectangle(50, 50, 50, 50);
        rect.setFill(Color.CORAL);

        animation = createAnimation(rect);

        Button snapshotButton = new Button("Take snapshot");

        Pane pane = new Pane(rect);
        pane.setMinSize(600, 150);

        rootPane = new BorderPane(pane, null, null, snapshotButton, new Label("This is the main scene"));

        snapshotButton.setOnAction(e -> {
            // html file being shown in webview
            File htmlFile = new File ("generated/template.html");
            // the resulting snapshot png file
            File aboutFile = new File ("generated/about.png");
            generate(htmlFile, aboutFile, 1280, 720);
        });

        BorderPane.setAlignment(snapshotButton, Pos.CENTER);
        BorderPane.setMargin(snapshotButton, new Insets(5));
        Scene scene = new Scene(rootPane);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    private TranslateTransition createAnimation(Rectangle rect) {
        TranslateTransition animation = new TranslateTransition(Duration.seconds(1), rect);
        animation.setByX(400);
        animation.setCycleCount(Animation.INDEFINITE);
        animation.setAutoReverse(true);
        animation.play();
        return animation;
    }

    public void generate(File htmlFile, File outputFile, double width, double height) {
        animation.pause();
        // rootPane is the root of original scene in an FXML controller you get this when you assign it an id
        rootPane.setEffect(new GaussianBlur());
        Stage primaryStage = (Stage)rootPane.getScene().getWindow();
        // creating separate webview holding same html content as in original scene
        WebView webView = new WebView();
        // with the size I want the snapshot
        webView.setPrefSize(width, height);
        AnchorPane snapshotRoot = new AnchorPane(webView);
        webView.getEngine().load(htmlFile.toURI().toString());
        Stage popupStage = new Stage(StageStyle.TRANSPARENT);
        popupStage.initOwner(primaryStage);
        popupStage.initModality(Modality.APPLICATION_MODAL);
        // this popup doesn't really show anything size = 1x1, it just holds the snapshot-webview
        popupStage.setScene(new Scene(snapshotRoot, 1, 1));
        // pausing to make sure the webview/picture is completely rendered
        PauseTransition pt = new PauseTransition(Duration.seconds(2));
        pt.setOnFinished(new EventHandler<ActionEvent>() {
            @Override public void handle(ActionEvent event) {
                WritableImage image = webView.snapshot(null, null);
                // writing a png to outputFile
                // writing a JPG like this will result in a pink JPG, see other posts
                // if somebody can scrape me simple code to convert it ARGB to RGB or something
                String format = "png";
                try {
                    ImageIO.write(SwingFXUtils.fromFXImage(image, null), format, outputFile);
                } catch (IOException e) {
                    // TODO Auto-generated catch block
                    e.printStackTrace();
                } finally {
                    rootPane.setEffect(null);
                    popupStage.hide();
                    animation.play();
                }
            }
        });
        // pausing, after pause onFinished event will take + write snapshot
        pt.play();
        // GO!
        popupStage.show();
    }

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

这篇关于整页截图，Java的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！