Question

在为Web应用程序设计UI时，我们为响应式设计界面提供了CSS和html。

但在设计桌面应用程序时，我如何获得响应式设计界面。我需要在不同尺寸的屏幕上安装我的应用程序界面，例如台式机，笔记本电脑，标签等

如何使用JAVA执行此操作？

Answer 1

在构建GUI时，我建议使用layout managers，例如边框布局或框布局，它们可以帮助您在调整窗口大小时移动项目。与他们一起玩，了解他们，找到最适合您的需求。另外看看GridBag Layout，它是一个更高级的布局管理器，但在掌握时非常有用。

对于以不同屏幕分辨率/尺寸拟合应用程序界面，您可以为应用程序设置最小和最大窗口大小。

Answer 2

如果您愿意使用JavaFX，则可以使用WebView设计应用。这使您能够使用CSS在UI中实现响应。然后，您可以添加ResponsiveFX库，它基本上模仿了Bootstrap's响应式API的子集。

从上面的ResponsiveFX链接转述，您可以在Java代码中使用一行启用响应式处理：

ResponsiveHandler.addResponsiveToWindow(primaryStage);

然后，您将相应的hidden-*或visible-*类添加到元素中：

TableView table = new TableView(items);
table.getStyleClass().addAll("visible-lg", "visible-md");

ListView list = new ListView(items);
list.getStyleClass().addAll("visible-xs", "visible-sm");

pane.getChildren().addAll(table, list);

或者更有效率，您可以为要支持的不同屏幕尺寸定义伪类，并使用它们而不是隐藏/显示同一元素的多个版本。

链接（CSS）的工具栏示例：

#toolbar {
    -fx-background-color: deepskyblue;
}

#toolbar:extreme-small-device {
    -fx-padding: 1 1 0 1;
}

#toolbar:small-device {
    -fx-padding: 2 2 1 2;
}

#toolbar:medium-device {
    -fx-padding: 6 6 1 6;
}

#toolbar:large-device {
    -fx-padding: 6 6 1 6;
    -fx-background-image: url(blue-background.png);
}

网站（Java）的工具栏示例：

Toolbar myToolbar = new Toolbar(...);
myToolbar.setId(toolbar);
pane.getChildren().add(myToolbar);

（公平警告，我自己没有使用过ResponsiveFX，因此无法保证其有效性）

使用JAVA的Windows桌面应用程序的响应式UI设计

2 个答案: