JavaFX animation is choppy - javafx

JavaFX animation is choppy.
And when i use
stage.initStyle(StageStyle.TRANSPARENT)
animations become more choppy.
package com.test;
import javafx.animation.Interpolator;
import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
import javafx.util.Duration;
import java.io.IOException;
public class HelloApplication extends Application {
#Override
public void start(Stage stage) throws IOException {
Pane root = new Pane();
Rectangle rect = new Rectangle(50,50,10,10);
Duration cycleDuration = Duration.millis(5000);
Timeline timeline = new Timeline(
new KeyFrame(cycleDuration,
new KeyValue(rect.widthProperty(),500,Interpolator.LINEAR))
);
timeline.setCycleCount(2000);
timeline.play();
root.getChildren().add(rect);
Scene scene = new Scene(root, 600, 650);
stage.initStyle(StageStyle.TRANSPARENT);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch();
}
}
How it works: https://youtu.be/UwoNByw-HYE
Intel(R) Core(TM) i5-6500 CPU # 3.20GHz 3.19 GHz
16,0 Gb
Windows 10
Java 19
Javafx 19
NVIDIA GeForce GTX 950 2Gb
I tried to make the same app with Qt QML, and it works really smooth and without ANY chopping.
Here's the comparation with Qt QML (bottom) and JavaFX (top) https://youtu.be/YAcI05NkjAE. JavaFX is jerky compared to Qt QML
UPDATE:
JavaFX app use GPU 10% and CPU 6% (with jerks)
Qt qml app use GPU 4% and CPU 2% (works prefect)

There definitely are visible glitches in the upper bar of the second video at irregular intervals of approximately one second length. Just concentrate on the right moving border of the bar. Some people just don't see or ignore them but others feel extremely disturbed by them. It seems to depend a bit on what you are used to. People who have a mobile or gaming background seem to be much more sensitive to such glitches than people with a primarily office PC background. Android once had project butter to overcome such glitches but JavaFX never did the same and still suffers from such glitches. (I know I won't make friends with this statement but it's true.) I also don't see anything obvious in your code that could directly improve the situation.
Edit: I have run your code on my Mac now and I have to admit that I do not see any glitches there. But I have seen the behaviour you describe very often myself. Of course it will always depend on your machine too.

Related

What is the difference between import css or link css in a React app?

In a React app I can include my CSS either using import or <link> it in the index.html file (From a CDN, for example).
What is the difference?
Is there any significant performance difference between the two methods?
To be clear, I mean this type of import from inside a *js or *.jsx file:
import React, { Component } from "react";
import "bootstrap/dist/css/bootstrap.css";
In theory, the only difference between them is that import is the CSS mechanism to include a style sheet and the HTML mechanism. However, browsers handle them differently, giving a clear advantage in terms of performance.
Also, using the tag allows you to define "preferred" and alternate stylesheets. You can't do that with import.
Overall, the tag is processed more quickly than the import rule (which is apparently somewhat slow as far as the css processing engine is concerned).

QML application style

I'm writing an application for tablet using QML.
The main QML file of the application is something like this:
ApplicationWindow {
id: mainWindow
visible: true
title: "MyApp"
menuBar: MenuBar {
Menu {
title: qsTr("File")
MenuItem {
text: qsTr("Open project")
}
MenuItem {
text: qsTr("Exit")
onTriggered: Qt.quit();
}
}
}
}
If I run the app on an Android device, the menu is styled like a standard Android menu, that is a button (with the "3 points" icon) on the top right corner. This is very good.
Instead if I run the app on a Windows device, the menu is like a standard desktop application menu (the traditional file menu...). This style is not suitable for a tablet application.
There is a way to choose the style of the application?
Thanks!
The correct style should be picked up by default. If it's not, it means that a style for that device type (e.g. touch) isn't available. If you want to use a specific style, you can set the QT_QUICK_CONTROLS_STYLE environment variable before running your application. However, some styles can only be run on the platform they are built for. For example, the Android style needs a specific file from a directory on the device in order to function properly.
Note that Qt Quick Controls have a stronger focus on desktop. If you have the opportunity, and you do not need a native style, I'd recommend trying out Qt Labs Controls. They are more touch-oriented, and have a style that implements Microsoft's Universal Design Guidelines.
They currently have three different styles available, and any style can be used on any platform.
Without styling, components from Qt Quick Controls are supposed have a native look. You can make your own styles for almost all of them, though.

Fuzzy text in Qt application?

I wrote a Qt application that drawing text, when using a certain font (Inconsolata) in small point sizes, it looked fuzzy:
But when using other font (Courier New, etc..) it's just fine:
What strange here is that other applications using that font looks normal, here is a contrast (left is vim, right is my application):
What would be the problem here?
Environment:
Window 7 Ultimate 64-bit
PySide 1.2.2 & Qt 4.8
Inconsolata.otf (http://www.levien.com/type/myfonts/inconsolata.html)
Code example (the problem is more serious on a dark scheme):
from PySide.QtGui import *
app = QApplication([])
label = QLabel('hello\nworld')
label.setStyleSheet('QLabel {background: #000; color: #fff;}')
label.setFont(QFont('Inconsolata', 11))
label.show()
app.exec_()
You can try changing the Qt font style strategy of your QFont and see what gives the best result.
For example to enable antialiasing on your application's default font, you can do:
QFont font = QApplication::font();
font.setStyleStrategy(QFont::PreferAntialias);
QApplication::setFont(font);

How to enable WebGL content inside QtQuick2 / QtWebKit within a QML application?

I'm doing some basic tests with a QML application to deliver WebGL content on desktop apps.
The basic test is the following code:
import QtQuick 2.0
import QtWebKit 3.0;
Rectangle {
width: 800
height: 600
WebView {
url: "http://learningwebgl.com/lessons/lesson03/index.html";
anchors.fill: parent
}
}
The window is shown and the HTML content appears but no WebGL content is shown.
I've tested it with other pages (like threejs examples). It seems that 3D content is somehow processed (at least I suppose it from my fan!), typical framerate display is shown (40 to 60 fps in many cases), but visually I can't see the WebGL content.
Do I miss something? Should I enable something else to support WebGL rendering inside the WebView?
I'm using Qt 5.4 on Windows 8 with VS Express 2013

embedding as3 fonts into a swf without flex?

Is there a way to create embedded "pure as3" swf fonts using compc (without the flex framework integration)? If I embed a font like this in my as3:
package fonts
{
import flash.display.Sprite;
import flash.text.Font;
public class Helvetica extends Sprite
{
[Embed(source='Helvetica.otf', fontName='Helvetica')]
public static var Helvetica :Class;
Font.registerFont( Helvetica );
}
}
using compc.exe -compiler.keep-generated-actionscript=true
I see flex makes some boilerplate as3 code including things like this:
import mx.core.IFlexModule;
import mx.core.IFlexModuleFactory;
import mx.core.EmbeddedFontRegistry;
which prevents me from using the embedded font in "pure as3" projects. Is there a way to get flex-free fonts using compc?
I am hoping there is an easy solution like this one for Bitmap Assets.
well, i think the method disrribed should work anyhow ... you just got to replace few more classes ... probably EmbeddedFontRegistry, so it won't have any dependancies ... just stuff in an empty method ...
greetz
back2dos

Resources