我的JavaFX场景很糟糕

时间:2017-05-26 15:12:17

标签: java xml javafx scene

我很难在JavaFX场景中对齐项目。

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

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TextArea?>
<?import javafx.scene.control.ToolBar?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.Pane?>

<Pane minHeight="-Infinity" minWidth="-Infinity" prefHeight="600.0" prefWidth="1200.0" xmlns="http://javafx.com/javafx/8.0.112" xmlns:fx="http://javafx.com/fxml/1" fx:controller="app.controller.TableViewController">
    <ScrollPane>
        <TableView fx:id="tableView" prefHeight="500.0" prefWidth="1100.0" snapToPixel="false" styleClass="100">
        </TableView>
    </ScrollPane>
    <ToolBar maxHeight="35.0" prefHeight="35.0" prefWidth="1200" style="-fx-background-color: #8C0000;">
        <ImageView fitHeight="35.0" fitWidth="200.0" pickOnBounds="true" preserveRatio="true">
            <Image url="@../images/qmit-search-toolbar-logo.png" />
        </ImageView>
        <TextArea fx:id="linkInput" maxHeight="30.0" maxWidth="250.0" />
        <TextArea fx:id="keywordInput" maxHeight="30.0" maxWidth="100.0" />
        <Button fx:id="buttonSearch" maxHeight="30.0" maxWidth="100.0" text="Search QMIT" />
    </ToolBar>
</Pane>

我的目标是拥有一个带有徽标的工具栏,两个输入文本字段和一个按钮。在下面,是一个以屏幕为中心的桌子。我在这里做错了什么,我最终得到了如此纠结的混乱?

3 个答案:

答案 0 :(得分:2)

Pane本身没有布局。

(另外,请注意TableView提供了自己的滚动功能:不要将其包装在滚动窗格中。)

例如,使用BorderPane

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

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TextArea?>
<?import javafx.scene.control.ToolBar?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.BorderPane?>

<BorderPane minHeight="-Infinity" minWidth="-Infinity" prefHeight="600.0" prefWidth="1200.0" xmlns="http://javafx.com/javafx/8.0.112" xmlns:fx="http://javafx.com/fxml/1" fx:controller="app.controller.TableViewController">
    <center>
        <TableView fx:id="tableView" prefHeight="500.0" prefWidth="1100.0" snapToPixel="false" styleClass="100">
        </TableView>
    </center>
    <top>
        <ToolBar maxHeight="35.0" prefHeight="35.0" prefWidth="1200" style="-fx-background-color: #8C0000;">
            <ImageView fitHeight="35.0" fitWidth="200.0" pickOnBounds="true" preserveRatio="true">
                <Image url="@../images/qmit-search-toolbar-logo.png" />
            </ImageView>
            <TextArea fx:id="linkInput" maxHeight="30.0" maxWidth="250.0" />
            <TextArea fx:id="keywordInput" maxHeight="30.0" maxWidth="100.0" />
            <Button fx:id="buttonSearch" maxHeight="30.0" maxWidth="100.0" text="Search QMIT" />
        </ToolBar>
    </top>
</BorderPane>

Oracle JavaFX教程有一个section on layout panes

答案 1 :(得分:2)

尝试使用VBox而不是Pane作为基础,首先使用TextFields而不是TextAreas添加工具栏,然后使用TableView添加ScrollPane

答案 2 :(得分:-1)

使用JavaFX Scene Builder比手动编写FXML要简单得多。

可以从Oracle网站下载。 http://www.oracle.com/technetwork/java/javase/downloads/sb2download-2177776.html