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ę.
The Podany kod nie kompiluje się. Brak też kodu HTML. –
@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. –
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. –