CODEWITHSUNDEEP
javajavafxpolymermaterial-design
aacebedo
aacebedo

Reputation: 41

JavaFX webview glitches on Polymer material design elements

I tried to display polymer material design elements within a JAVAFX 8 webview and got some graphical glitches on a some of them. For example, the checkbox element disappears when you click on it.

I am using the java 8 sdk update 45 on a Ubuntu 15.04 system.

Here is the code:

package sample;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;


import javafx.application.Application;
import javafx.geometry.HPos;
import javafx.geometry.VPos;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import javafx.scene.paint.Color;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
public class Main extends Application {
    private Scene scene;
    @Override public void start(Stage stage) {
        // create the scene
        stage.setTitle("Web View");
        scene = new Scene(new Browser(),750,500, Color.web("#666970"));
        stage.setScene(scene);

        stage.show();
    }

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

class Browser extends Region {

    final WebView browser = new WebView();
    final WebEngine webEngine = browser.getEngine();

    public Browser() {
        //apply the styles
        getStyleClass().add("browser");
        // load the web page
        webEngine.load("http://www.polymer-project.org/0.5/components/paper-elements/demo.html");
        //add the web view to the scene
        getChildren().add(browser);

    }
    private Node createSpacer() {
        Region spacer = new Region();
        HBox.setHgrow(spacer, Priority.ALWAYS);
        return spacer;
    }

    @Override protected void layoutChildren() {
        double w = getWidth();
        double h = getHeight();
        layoutInArea(browser,0,0,w,h,0, HPos.CENTER, VPos.CENTER);
    }

    @Override protected double computePrefWidth(double height) {
        return 750;
    }

    @Override protected double computePrefHeight(double width) {
        return 500;
    }
}

Any idea about this? I think the jdk webview does not fully implement all the HTML5 specifications.

Upvotes: 0

Views: 694

Answers (1)

jewelsea
jewelsea

Reputation: 159486

Works fine for me:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class Polymer extends Application {
    @Override public void start(Stage stage) {
        WebView webView = new WebView();
        webView.getEngine().load(
            "http://www.polymer-project.org/0.5/components/paper-elements/demo.html"
        );

        System.getProperties().list(System.out);

        stage.setScene(new Scene(webView));
        stage.show();
    }

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

$ java -version
java version "1.8.0_60-ea"
Java(TM) SE Runtime Environment (build 1.8.0_60-ea-b13)
Java HotSpot(TM) 64-Bit Server VM (build 25.60-b12, mixed mode)

OS X 10.9.5

The page itself is slow to initially display, but then the same page is slow to display on Safari as well (takes a few seconds to display).

Polymer Image

Upvotes: 1

Related Questions