如何將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應用程序居中在瀏覽器窗口上

回答

相關問題