2016-05-20 8 views
10

Pracuję nad aplikacją JavaFX, która zawiera kilka plików html, css, JS, które są renderowane przez wewnętrzną przeglądarkę Webkit. Problem polega na tym, że animacje CSS, które mamy, nie są płynnie renderowane w przeglądarce Webkit zapewnionej przez JavaFX, ale ten sam kod w Firefoksie lub w chrome jest bardziej płynny.JavaFX: Osadzanie przeglądarki innej niż dostępna przeglądarka internetowa za pomocą JavaFX

Nie ma również trwałości (obecnie używane są zmienne w Javie i komunikacja przez JS w celu utrwalenia).

Czego szukam, to jakikolwiek sposób na zintegrowanie przeglądarki bezgłowej lub niektórych ustawień, aby animacje CSS stały się bardziej płynne. Jedyne, co spotkałem, to JxBrowser, ale jest to kosztowne do osobistego użytku.

Kod:

public class Main extends Application { 

    private Scene scene; 
    MyBrowser myBrowser; 

    String completeText = ""; 

    @Override 
    public void start(Stage primaryStage) throws Exception{ 
     primaryStage.setTitle("Frontend"); 
     java.net.CookieManager manager = new java.net.CookieManager(); 
     java.net.CookieHandler.setDefault(manager); 

     myBrowser = new MyBrowser(); 
     scene = new Scene(myBrowser, 1080, 1920); 

     primaryStage.setScene(scene); 
     primaryStage.setFullScreen(true); 
     primaryStage.show(); 

     // @ being the escape character 
     scene.setOnKeyTyped(new EventHandler<KeyEvent>() { 
      @Override 
      public void handle(KeyEvent event) { 
       String text = event.getCharacter(); 
       if (text.equals("0")) { 
        String tempText = completeText; 
        completeText = ""; 
        processText(tempText); 
       }else { 
        completeText = completeText+text; 
       } 
      } 
     }); 
    } 
} 

MyBrowser:

public class MyBrowser extends Region { 

public MyBrowser() { 
     webEngine.getLoadWorker().stateProperty().addListener((observable, oldValue, newValue) -> { 
      if (newValue == Worker.State.SUCCEEDED) { 
       JSObject window = (JSObject) webEngine.executeScript("window"); 
       window.setMember("app", this); 
      } 
     }); 




     URL urlHello = getClass().getResource(hellohtml); 

     webEngine.load(urlHello.toExternalForm()); 
     webView.setPrefSize(1080, 1920); 
     webView.setContextMenuEnabled(false); 
     getChildren().add(webView); 
    } 

kod CSS, który zawiera animację:

#ball-container.go #ball{ 
-webkit-animation: rotating-inverse 2s ease-out 0s 1 normal; 
animation: rotating-inverse 2s ease-out 0s 1 normal; 
} 


#ball-container { 
height: 102px; 
width: 102px; 
position: absolute; 
top: -95px; 
left: 480px; 
-webkit-transition: all 0.9s ease-in-out 0s; 
transition: all 0.9s ease-in-out 0s; 
} 



#ball-container.shake .ball-wrapper{ 
-webkit-animation: yAxis 0.9s ease-in-out; 
animation: yAxis 0.9s ease-in-out; 
} 

Dziękuję.

+0

The Podany kod nie kompiluje się. Brak też kodu HTML. –

+0

@OJKrylow: ten kod służy tylko jako punkt odniesienia, jedna z animacji, którą mamy. Możesz wypróbować dowolną animację CSS z sieci (już to zrobiliśmy), a wydajność jest niska. –

+0

Testowałem WebView za pomocą https://daneden.github.io/animate.css/ w trybie 64-bitowym i 32-bitowym. Nie ma wyraźnego szoku z animacjami. Poza niektórymi elementami, które nie są renderowane poprawnie, animacja wydaje się w porządku. –

Odpowiedz

1

Spróbuj użyć Java 8u112, opartą na kodzie I stworzył próbkę roboczą (testowane przy użyciu Java JDK 8u112 64bit):

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

public class Example extends Application 
{ 
    public static void main(String[] args) 
    { 
     launch(args); 
    } 

    class MyBrowser extends Parent 
    { 
     private WebEngine webEngine; 
     private WebView webView; 

     public MyBrowser() 
     { 
      webView = new WebView(); 
      webEngine = webView.getEngine(); 

      // Ugly (but easy to share) HTML content 
      String pageContents = 
        "<html>" 
         + "<head>" 
          + "<style>" 
           + "@-webkit-keyframes mymove {" 
            + "from {top: 0px;}" 
            + "to {top: 50px;}" 
           + "}" 
           + ".box { " 
            + "width: 150px; " 
            + "position: relative; " 
            + "height: 150px; " 
            + "background: red; " 
            + "margin-top: 35px; " 
            + "margin-left: auto; " 
            + "margin-right: auto; " 
            + "-webkit-transition: background-color 2s ease-out; " 
            + "-webkit-transition: all 1s ease-in-out; " 
           + "}" 
           +".box:hover {" 
            +" background-color: green;" 
            + "width:350px;" 
            + "-webkit-animation: mymove 1s infinite;" 
           +"}"   
          + "</style>" 
         + "</head>" 
         + "<body>" 
          + "<div class='box'></div>" 
         + "</body>" 
        + "</html>"; 

      webEngine.loadContent(pageContents); 
      webView.setContextMenuEnabled(false); 
      getChildren().add(webView); 
     } 
    } 

    private Scene scene; 
    MyBrowser  myBrowser; 

    @Override 
    public void start(Stage primaryStage) throws Exception 
    { 
     primaryStage.setTitle("Frontend"); 
     myBrowser = new MyBrowser(); 
     scene = new Scene(myBrowser); 
     primaryStage.setScene(scene); 
     primaryStage.show(); 
    } 
} 

I podejrzewam, że to dlatego, że są teraz przy użyciu nowszej WebKit JDK-8156698 ale może to mieć był to błąd przed (można spojrzeć na listy 8u112 bug fixes.

+0

Wypróbuję to i dam ci znać. Dziękuję Ci. :-) –

0

miałem ten sam problem renderingu aplikację internetową kątową oparty użyciu webview.and poprawiony przez uaktualnienie wersji Java 1.8.0_121.

Powiązane problemy