xxhdpi Android javafxports 应用程序上的动画 "ghosting"
Animation "ghosting" on xxhdpi Android javafxports application
我编写了一个小型 javafx 应用程序，它可以使正方形从左上角移动到右下角。然后它反转动画并连续运行。在我的像素 4 (xxhdpi) 上，正方形在 return 行程中留下了一条边缘痕迹。这不会发生在我的 Nexus 7 2013 (xhdpi) 或我的桌面上。
尝试了 gluon 插件和 gluon-vm 插件。
似乎与屏幕像素密度有关。 . .你如何防止密集屏幕上的重影？图片和代码如下。
Pixel 4 屏幕截图：
Nexus 2013 截图：
和应用程序：
public class StockJavaFx extends Application {
@Override
public void start(Stage primaryStage) {
Dimension2D dimension = Services.get(DisplayService.class)
.map(DisplayService::getDefaultDimensions)
.orElseThrow(() -> new NullPointerException("DisplayService"));
Rectangle rectangle = new Rectangle(75, 75);
Pane container = new Pane();
container.getChildren().add(new Rectangle(dimension.getWidth(), dimension.getHeight(), Color.DARKSLATEGRAY));
container.getChildren().add(rectangle);
Scene scene = new Scene(container);
primaryStage.setScene(scene);
TranslateTransition tt = new TranslateTransition(Duration.millis(750), rectangle);
tt.setFromX(0);
tt.setToX(dimension.getWidth() - 75);
tt.setFromY(0);
tt.setToY(dimension.getHeight() - 75);
tt.setCycleCount(Animation.INDEFINITE);
tt.setAutoReverse(true);
FillTransition ft = new FillTransition(Duration.millis(750), rectangle);
ft.setFromValue(Color.ORANGERED);
ft.setToValue(Color.CADETBLUE);
ft.setCycleCount(Animation.INDEFINITE);
ft.setAutoReverse(true);
tt.play();
ft.play();
primaryStage.show();
}
}
旧 Gluon jfxmobile 插件或多或少已经停产，它正在被新的 Gluon Client 插件取代。可以找到更多详细信息 here and here. Detailed documentation can be found here.
这是您可以尝试创建一个 Android 应用程序来解决 "ghosting" 问题的方法，还有一些额外的 "small" 好处，例如使用 Java 和 JavaFX 11+、GraalVM，以及获得性能更高的应用程序。
请注意，Android 的客户端插件仍在大量开发中，尚未准备好投入生产。
开始之前，请检查您是否满足先决条件 here:
- 使用 Linux 机器
- 下载并提取 GraalVM this version。
设置GRAALVM_HOME环境变量为GraalVM安装目录，如：
export GRAALVM_HOME=/opt/graalvm-svm-linux-20.1.0-ea+28
- 使用Java11，或设置
export JAVA_HOME=$GRAALVM_HOME
您可以修改现有示例之一，例如 HelloGluon。
您可以修改 pom 以使用最新版本，例如：
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.gluonhq.hello</groupId>
<artifactId>hellogluon</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>jar</packaging>
<name>hellogluon</name>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<maven.compiler.release>11</maven.compiler.release>
<javafx.version>14.0.1</javafx.version>
<attach.version>4.0.7</attach.version>
<client.plugin.version>0.1.22</client.plugin.version>
<mainClassName>com.gluonhq.hello.HelloGluon</mainClassName>
</properties>
<dependencies>
<dependency>
<groupId>org.openjfx</groupId>
<artifactId>javafx-controls</artifactId>
<version>${javafx.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq</groupId>
<artifactId>charm-glisten</artifactId>
<version>6.0.4</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>display</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>lifecycle</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>statusbar</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>storage</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>util</artifactId>
<version>${attach.version}</version>
</dependency>
</dependencies>
<repositories>
<repository>
<id>Gluon</id>
<url>https://nexus.gluonhq.com/nexus/content/repositories/releases</url>
</repository>
</repositories>
<build>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.8.1</version>
<configuration>
<release>${maven.compiler.release}</release>
</configuration>
</plugin>
<plugin>
<groupId>org.openjfx</groupId>
<artifactId>javafx-maven-plugin</artifactId>
<version>0.0.4</version>
<configuration>
<mainClass>${mainClassName}</mainClass>
</configuration>
</plugin>
<plugin>
<groupId>com.gluonhq</groupId>
<artifactId>client-maven-plugin</artifactId>
<version>${client.plugin.version}</version>
<configuration>
<target>${client.target}</target>
<attachList>
<list>display</list>
<list>lifecycle</list>
<list>statusbar</list>
<list>storage</list>
</attachList>
<mainClass>${mainClassName}</mainClass>
</configuration>
</plugin>
</plugins>
<profiles>
<profile>
<id>desktop</id>
<activation>
<activeByDefault>true</activeByDefault>
</activation>
<properties>
<client.target>host</client.target>
</properties>
<dependencies>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>display</artifactId>
<version>${attach.version}</version>
<classifier>desktop</classifier>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>lifecycle</artifactId>
<version>${attach.version}</version>
<classifier>desktop</classifier>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>storage</artifactId>
<version>${attach.version}</version>
<classifier>desktop</classifier>
<scope>runtime</scope>
</dependency>
</dependencies>
</profile>
<profile>
<id>ios</id>
<properties>
<client.target>ios</client.target>
</properties>
</profile>
<profile>
<id>android</id>
<properties>
<client.target>android</client.target>
</properties>
</profile>
</profiles>
</build>
</project>
现在您可以修改主视图以添加过渡：
public class HelloGluon extends MobileApplication {
@Override
public void init() {
addViewFactory(HOME_VIEW, () -> {
Rectangle rectangle = new Rectangle(75, 75, Color.DARKSLATEGRAY);
Pane container = new Pane(rectangle);
container.setStyle("-fx-background-color: darkslategray");
return new View(container) {
@Override
protected void updateAppBar(AppBar appBar) {
appBar.setNavIcon(MaterialDesignIcon.MENU.button(e -> System.out.println("Menu")));
appBar.setTitleText("Gluon Mobile");
appBar.getActionItems().add(MaterialDesignIcon.PLAY_ARROW.button(e -> {
TranslateTransition tt = new TranslateTransition(Duration.millis(750), rectangle);
tt.setFromX(0);
tt.setToX(getWidth() - 75);
tt.setFromY(0);
tt.setToY(getHeight() - 75);
tt.setCycleCount(Animation.INDEFINITE);
tt.setAutoReverse(true);
FillTransition ft = new FillTransition(Duration.millis(750), rectangle);
ft.setFromValue(Color.ORANGERED);
ft.setToValue(Color.CADETBLUE);
ft.setCycleCount(Animation.INDEFINITE);
ft.setAutoReverse(true);
tt.play();
ft.play();
}));
}
};
});
}
@Override
public void postInit(Scene scene) {
Swatch.TEAL.assignTo(scene);
scene.getStylesheets().add(HelloGluon.class.getResource("styles.css").toExternalForm());
if (Platform.isDesktop()) {
Dimension2D dimension2D = DisplayService.create()
.map(DisplayService::getDefaultDimensions)
.orElse(new Dimension2D(640, 480));
scene.getWindow().setWidth(dimension2D.getWidth());
scene.getWindow().setHeight(dimension2D.getHeight());
}
}
public static void main(String[] args) {
launch();
}
}
您现在可以 运行 在您的机器上使用常规 JDK：
mvn clean javafx:run
并验证是否正常工作。
如果是这样，您现在可以在您的计算机上使用 GraalVM 创建原生映像：
mvn clean client:build
这是一个漫长的过程，通常需要 16 GB RAM 和几分钟。
成功完成后，您可以运行它：
mvn client:run
它应该按预期工作：
最后，您可以尝试构建一个 Android 本机映像：
mvn -Pandroid client:build
完成后，创建 apk：
mvn -Pandroid client:package
它将在 target/client/aarch64-android/gvm/apk/bin/hellogluon.apk.
下创建一个 apk
插入设备，安装并运行:
mvn -Pandroid client:install client:run
注意：默认情况下，图标资产和 AndroidManifest 在 target/client/aarch64-android/gensrc/android 生成。如果要修改其中任何一个，则必须将此文件夹的内容复制到src/android。
我编写了一个小型 javafx 应用程序，它可以使正方形从左上角移动到右下角。然后它反转动画并连续运行。在我的像素 4 (xxhdpi) 上，正方形在 return 行程中留下了一条边缘痕迹。这不会发生在我的 Nexus 7 2013 (xhdpi) 或我的桌面上。
尝试了 gluon 插件和 gluon-vm 插件。
似乎与屏幕像素密度有关。 . .你如何防止密集屏幕上的重影？图片和代码如下。
Pixel 4 屏幕截图：
Nexus 2013 截图：
和应用程序：
public class StockJavaFx extends Application {
@Override
public void start(Stage primaryStage) {
Dimension2D dimension = Services.get(DisplayService.class)
.map(DisplayService::getDefaultDimensions)
.orElseThrow(() -> new NullPointerException("DisplayService"));
Rectangle rectangle = new Rectangle(75, 75);
Pane container = new Pane();
container.getChildren().add(new Rectangle(dimension.getWidth(), dimension.getHeight(), Color.DARKSLATEGRAY));
container.getChildren().add(rectangle);
Scene scene = new Scene(container);
primaryStage.setScene(scene);
TranslateTransition tt = new TranslateTransition(Duration.millis(750), rectangle);
tt.setFromX(0);
tt.setToX(dimension.getWidth() - 75);
tt.setFromY(0);
tt.setToY(dimension.getHeight() - 75);
tt.setCycleCount(Animation.INDEFINITE);
tt.setAutoReverse(true);
FillTransition ft = new FillTransition(Duration.millis(750), rectangle);
ft.setFromValue(Color.ORANGERED);
ft.setToValue(Color.CADETBLUE);
ft.setCycleCount(Animation.INDEFINITE);
ft.setAutoReverse(true);
tt.play();
ft.play();
primaryStage.show();
}
}
旧 Gluon jfxmobile 插件或多或少已经停产，它正在被新的 Gluon Client 插件取代。可以找到更多详细信息 here and here. Detailed documentation can be found here.
这是您可以尝试创建一个 Android 应用程序来解决 "ghosting" 问题的方法，还有一些额外的 "small" 好处，例如使用 Java 和 JavaFX 11+、GraalVM，以及获得性能更高的应用程序。 请注意，Android 的客户端插件仍在大量开发中，尚未准备好投入生产。
开始之前，请检查您是否满足先决条件 here:
- 使用 Linux 机器
- 下载并提取 GraalVM this version。
设置
GRAALVM_HOME环境变量为GraalVM安装目录，如：export GRAALVM_HOME=/opt/graalvm-svm-linux-20.1.0-ea+28- 使用Java11，或设置
export JAVA_HOME=$GRAALVM_HOME
您可以修改现有示例之一，例如 HelloGluon。
您可以修改 pom 以使用最新版本，例如：
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.gluonhq.hello</groupId>
<artifactId>hellogluon</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>jar</packaging>
<name>hellogluon</name>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<maven.compiler.release>11</maven.compiler.release>
<javafx.version>14.0.1</javafx.version>
<attach.version>4.0.7</attach.version>
<client.plugin.version>0.1.22</client.plugin.version>
<mainClassName>com.gluonhq.hello.HelloGluon</mainClassName>
</properties>
<dependencies>
<dependency>
<groupId>org.openjfx</groupId>
<artifactId>javafx-controls</artifactId>
<version>${javafx.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq</groupId>
<artifactId>charm-glisten</artifactId>
<version>6.0.4</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>display</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>lifecycle</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>statusbar</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>storage</artifactId>
<version>${attach.version}</version>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>util</artifactId>
<version>${attach.version}</version>
</dependency>
</dependencies>
<repositories>
<repository>
<id>Gluon</id>
<url>https://nexus.gluonhq.com/nexus/content/repositories/releases</url>
</repository>
</repositories>
<build>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.8.1</version>
<configuration>
<release>${maven.compiler.release}</release>
</configuration>
</plugin>
<plugin>
<groupId>org.openjfx</groupId>
<artifactId>javafx-maven-plugin</artifactId>
<version>0.0.4</version>
<configuration>
<mainClass>${mainClassName}</mainClass>
</configuration>
</plugin>
<plugin>
<groupId>com.gluonhq</groupId>
<artifactId>client-maven-plugin</artifactId>
<version>${client.plugin.version}</version>
<configuration>
<target>${client.target}</target>
<attachList>
<list>display</list>
<list>lifecycle</list>
<list>statusbar</list>
<list>storage</list>
</attachList>
<mainClass>${mainClassName}</mainClass>
</configuration>
</plugin>
</plugins>
<profiles>
<profile>
<id>desktop</id>
<activation>
<activeByDefault>true</activeByDefault>
</activation>
<properties>
<client.target>host</client.target>
</properties>
<dependencies>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>display</artifactId>
<version>${attach.version}</version>
<classifier>desktop</classifier>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>lifecycle</artifactId>
<version>${attach.version}</version>
<classifier>desktop</classifier>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>com.gluonhq.attach</groupId>
<artifactId>storage</artifactId>
<version>${attach.version}</version>
<classifier>desktop</classifier>
<scope>runtime</scope>
</dependency>
</dependencies>
</profile>
<profile>
<id>ios</id>
<properties>
<client.target>ios</client.target>
</properties>
</profile>
<profile>
<id>android</id>
<properties>
<client.target>android</client.target>
</properties>
</profile>
</profiles>
</build>
</project>
现在您可以修改主视图以添加过渡：
public class HelloGluon extends MobileApplication {
@Override
public void init() {
addViewFactory(HOME_VIEW, () -> {
Rectangle rectangle = new Rectangle(75, 75, Color.DARKSLATEGRAY);
Pane container = new Pane(rectangle);
container.setStyle("-fx-background-color: darkslategray");
return new View(container) {
@Override
protected void updateAppBar(AppBar appBar) {
appBar.setNavIcon(MaterialDesignIcon.MENU.button(e -> System.out.println("Menu")));
appBar.setTitleText("Gluon Mobile");
appBar.getActionItems().add(MaterialDesignIcon.PLAY_ARROW.button(e -> {
TranslateTransition tt = new TranslateTransition(Duration.millis(750), rectangle);
tt.setFromX(0);
tt.setToX(getWidth() - 75);
tt.setFromY(0);
tt.setToY(getHeight() - 75);
tt.setCycleCount(Animation.INDEFINITE);
tt.setAutoReverse(true);
FillTransition ft = new FillTransition(Duration.millis(750), rectangle);
ft.setFromValue(Color.ORANGERED);
ft.setToValue(Color.CADETBLUE);
ft.setCycleCount(Animation.INDEFINITE);
ft.setAutoReverse(true);
tt.play();
ft.play();
}));
}
};
});
}
@Override
public void postInit(Scene scene) {
Swatch.TEAL.assignTo(scene);
scene.getStylesheets().add(HelloGluon.class.getResource("styles.css").toExternalForm());
if (Platform.isDesktop()) {
Dimension2D dimension2D = DisplayService.create()
.map(DisplayService::getDefaultDimensions)
.orElse(new Dimension2D(640, 480));
scene.getWindow().setWidth(dimension2D.getWidth());
scene.getWindow().setHeight(dimension2D.getHeight());
}
}
public static void main(String[] args) {
launch();
}
}
您现在可以 运行 在您的机器上使用常规 JDK：
mvn clean javafx:run
并验证是否正常工作。
如果是这样，您现在可以在您的计算机上使用 GraalVM 创建原生映像：
mvn clean client:build
这是一个漫长的过程，通常需要 16 GB RAM 和几分钟。
成功完成后，您可以运行它：
mvn client:run
它应该按预期工作：
最后，您可以尝试构建一个 Android 本机映像：
mvn -Pandroid client:build
完成后，创建 apk：
mvn -Pandroid client:package
它将在 target/client/aarch64-android/gvm/apk/bin/hellogluon.apk.
插入设备，安装并运行:
mvn -Pandroid client:install client:run
注意：默认情况下，图标资产和 AndroidManifest 在 target/client/aarch64-android/gensrc/android 生成。如果要修改其中任何一个，则必须将此文件夹的内容复制到src/android。