如何将JavaFX 2.0应用程序居中在浏览器窗口上

我正在JavaFx 2.0中构建应用程序，并且希望在部署应用程序时让它显示在浏览器窗口的中心。我在谷歌和雅虎寻找这个话题，并没有发现任何东西。任何帮助是极大的赞赏。如何将JavaFX 2.0应用程序居中在浏览器窗口上

2012-02-17 Artur G Vieira

您可以使用HBox中的组合和垂直框面板在FXML。 Hier是我的测试代码：

<?xml version="1.0" encoding="UTF-8"?> 
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 

<AnchorPane fx:id="panel1" xmlns:fx="http://javafx.com/fxml" fx:controller="app.MainController"> 
    <HBox alignment="CENTER" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> 
     <VBox alignment="CENTER"> 
      <Pane fx:id="panel2"></Pane> <!-- YOUR CENTERED CONTENT HERE! --> 
     </VBox> 
    </HBox> 
</AnchorPane>

'panel1'将在浏览器区域拉伸。所以HBox和VBox也会。因为他们对他们的孩子有'中心'属性，所以'panel2'将居中。

来源

2013-03-06 16:12:44

查看source code的JavaFX Ensemble example。无论窗口大小如何，Ensemble应用程序都配置为运行以填充浏览器窗口。它的完成方式是通过在启动应用程序的JavaScript中进行配置，以及通过嵌入应用程序的div的css样式。

以下是html相关部分的摘录。

<html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>JavaFX 2.0 - Ensemble</title> 
    <SCRIPT src="http://java.com/js/dtjava.js"></SCRIPT> 

    <script> 
     function javafxEmbed_ensemble() { 
     dtjava.embed(
      { 
      id : 'ensemble', 
      url : 'Ensemble.jnlp', 
      placeholder : 'javafx-app-placeholder', 
      width : '100%', 
      height : '100%', 
      jnlp_content : '...' 
      }, 
      { 
      javafx : '2.0+' 
      }, 
      {} 
     ); 
     } 
     dtjava.addOnloadCallback(javafxEmbed_ensemble); 
    </script> 

    <style> 
     html, body, #javafx-app-placeholder, #ensemble-app { 
     margin: 0; 
     overflow: hidden; 
     padding: 0; 
     width: 100%; 
     height: 100%; 
     } 
    </style> 
    </head> 
    <body><div id='javafx-app-placeholder'></div></body> 
</html>

如果需要超过100％的覆盖范围以外的东西，你可以将100个％的标签，比如75％，并调整CSS样式来得到你想要的利润率页面居中。

当前的Java打包工具（例如javafxpackager实用工具）不允许指定percentange的宽度。我在javafx jira中为此创建了一项功能请求 - 您可以在那里创建一个帐户来查看请求。如果您将这些工具用于generate your deployment html，那么您可能必须手工修改部署html或通过后处理ant脚本修改，这可以在Ensemble示例应用程序的build.xml中看到。

来源

2012-02-18 00:17:10 jewelsea

我按照指示，仍然无法看到屏幕中心的应用程序。我做了以下几点：为html文件配置了样式标签。还有什么我该做的？ – 2012-02-19 03:38:30

您是否也在dtjava javascript调用中将宽度和高度设置为百分比（如在答案中的html示例中）？ – jewelsea 2012-02-22 22:37:56

是的，我所做的只是一个空白的窗口... – 2012-02-25 18:16:40

使用此FXML

<?xml version="1.0" encoding="UTF-8"?> 

<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.geometry.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 
<?import javafx.scene.paint.*?> 

<AnchorPane id="AnchorPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="500.0" prefWidth="600.0" xmlns:fx="http://javafx.com/fxml"> 
    <children> 
    <HBox id="HBox" alignment="CENTER" spacing="5.0" AnchorPane.bottomAnchor="213.0" AnchorPane.leftAnchor="168.0" AnchorPane.rightAnchor="168.0" AnchorPane.topAnchor="214.0"> 
     <children> 
     <GridPane id="gridPane1" alignment="CENTER" hgap="2.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" vgap="2.0"> 
      <children> 
      <Label id="label1" alignment="CENTER_RIGHT" contentDisplay="RIGHT" text="Username" GridPane.columnIndex="0" GridPane.rowIndex="0" /> 
      <Label id="label2" alignment="CENTER_RIGHT" text="Password" GridPane.columnIndex="0" GridPane.rowIndex="1" /> 
      <TextField id="textField1" fx:id="userid" prefWidth="200.0" GridPane.columnIndex="1" GridPane.rowIndex="0" /> 
      <PasswordField id="passwordField1" fx:id="password" prefWidth="200.0" GridPane.columnIndex="1" GridPane.rowIndex="1" /> 
      <Button id="button1" alignment="CENTER_RIGHT" text="Signin" GridPane.columnIndex="1" GridPane.halignment="RIGHT" GridPane.rowIndex="2" /> 
      </children> 
      <columnConstraints> 
      <ColumnConstraints halignment="CENTER" hgrow="NEVER" maxWidth="-Infinity" minWidth="-Infinity" percentWidth="0.0" /> 
      <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" /> 
      </columnConstraints> 
      <padding> 
      <Insets bottom="2.0" left="4.0" right="4.0" top="2.0" /> 
      </padding> 
      <rowConstraints> 
      <RowConstraints minHeight="10.0" vgrow="SOMETIMES" /> 
      <RowConstraints minHeight="10.0" vgrow="SOMETIMES" /> 
      <RowConstraints minHeight="10.0" vgrow="SOMETIMES" /> 
      </rowConstraints> 
     </GridPane> 
     </children> 
    </HBox> 
    </children> 
</AnchorPane>

可能会解决你的问题

来源

2012-04-24 14:55:07

尝试使用StackPane作为容器。它将以它包含的所有节点为中心。 Torsten

来源

2013-06-25 20:56:02

如何将JavaFX 2.0应用程序居中在浏览器窗口上

回答

相关问题