Style a WebView Web Page using JMetro Theme Style

[DJViking]

I want to use the JMetro styling in a WebView, so that the Web Page gets the same Theme (LIGHT, DARK) as the application. Any way this can be achieved?

final WebView browser = new WebView();
browser.getStyleClass().add(JMetroStyleClass.BACKGROUND);
final WebEngine engine = browser.getEngine();
final String url = "https://localhost/page.html";
engine.load(url);

The only way I could affect the style of the web page was to call setUserStyleSheetLocation on the WebEngine:

final URL styleUrl = getClass().getResource("webstyle.css");
engine.setUserStyleSheetLocation(styleUrl.toString());

I tried using the JMetro CSS style for the Web Page, but since JavaFX CSS is not compatible with HTML CSS it did not work.

String style = Style.DARK.getStyleStylesheetURL();
engine.setUserStyleSheetLocation(style);

I could create an webstyle-dark.css and webstyle-light.css with the colors and fonts of JMetro, but if JMetro changes these in the future I would have to change mine.

[dukke]

Hi @DJViking

Sorry for the late reply.

This is more of a JavaFX question than a JMetro question. Indeed JavaFX is not compatible with web css (unfortunately). That's something I would like javafx to be but I'm not seeing that happen in the near future.

Yes you'll have to create a separate stylesheet that's compatible with web css unfortunately, that's an issue that JavaFX CSS raises..