I’m on a project, a Revenue Management System and for some reasons it’s required that some reports are displayed on WebView and printed while the design concept demands that the WebView is made transparent. I was able to resolve the WebView transparent issue here: Transparent background in the WebView in JavaFX Credits to "Harry Hur"1 as I couldn’t achieve that through FX CSS and I was also able to display my report on the WebView as shown below:
Code:
WebView reportView = new WebView();
engine = reportView.getEngine();
engine.setUserAgent("Mozilla/5.0 (Linux; Android 4.1.1; HTC One X Build/JRO03C) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.58 Mobile Safari/537.31");
//document property listener to make my webview transparent whenever a new document is loaded in
engine.documentProperty().addListener((ObservableValue<? extends Document> observable, Document oldValue, Document newValue) -> {
try{
// Use reflection to retrieve the WebEngine's private 'page' field.
Field f = engine.getClass().getDeclaredField("page");
f.setAccessible(true);
com.sun.webkit.WebPage page = (com.sun.webkit.WebPage) f.get(engine);
page.setBackgroundColor((new java.awt.Color(0, 0, 0, 0)).getRGB());
}catch(Exception ex){
ex.printStackTrace();
}
});
//enables javascript on the webengine after load
engine.getLoadWorker().stateProperty().addListener(new ChangeListener<Worker.State>() {
@Override
public void changed(ObservableValue ov, Worker.State oldState, Worker.State newState) {
if(newState == Worker.State.SUCCEEDED) {
System.out.println("complete load.");
try {
engine.setJavaScriptEnabled(true);
} catch(Exception ex){
ex.printStackTrace();
}
}
}
});
engine.loadContent("<body style='background : rgba(0,0,0,0);'>My Html Content...</body>");
Result Transparent WebView with content loaded onto it
…but problem is when I tried printing it prints a dark background rectangular image on the paper and I suppose the black portion on the paper is the html page containing the report. Below is the display:
The Print Code:
PrinterJob job = PrinterJob.createPrinterJob();
if (job != null && job.showPrintDialog(null) {
engine.print(job);
job.endJob();
}
Printout: Because i'm new here and have got not upto 10 reputations i couldn't provide printout image link but the post explains it anyways.
But when I tried commenting the code that made the WebView transparent which will leave the WebView with its default background color (White) and changed the report text color to black, it prints normally to the paper but not actually the way it’s rendered with css. My style renders the text font with "Segoe UI Light" and "Segoe UI Bold" but it prints out the whole thing in "Times New Roman" font and the same font size: Below is the display:
Result: White background WebView with blac text content loaded into it
Printout: Because i'm new here and have got not upto 10 reputations i couldn't provide printout image link but the post explains it anyways.
Question is:
Please is there a way I can have my WebView Transparent and print the WebEngine with no background rendering the printout just the way it’s styled with css? I would appreciate if some would help me out here as I have just 8 months experience on JavaFX.
Still on printing, it’s also required that some reports are display the conventional way on (TableView). I’ve applied some help I got online (On how to print a node) but I think it didn’t provide me with the exact solution to my problem. Please can someone help me with some codes that would help me print a TableView that even if it over flows I would be able to print the whole data even the ones that are not in view just like the Java Swing Table ?