通过java fx css确定单个元素的边距

Question

我有以下fxml片段:

    <VBox fx:id="paneLeft">
        <TextField promptText="Password"/>
        <Button fx:id="btnLogin" text="Login" maxWidth="10000"/>
        <Hyperlink text="Registration"/>
    </VBox>

我需要在Button和Hyperlink之间添加10px的间距.我也想用CSS来完成这项任务.

Answer 1

可能在派对上真的很晚,但我使用的另一种方法也可能对其他人有所帮助.

Theres no -fx-margin:javafx按钮的5px css属性,但您可以使用填充,边框插入和背景插入的组合来解决该行为.

例如,具有5px边距的按钮.

.button-with-margin {
    -fx-padding: 5px;
    -fx-border-insets: 5px;
    -fx-background-insets: 5px;

}

或者,您也可以定义更高的填充和更低的插入值,以防您想要填充和边距.

Answer 2

看来你不能.JavaFX现在对CSS的支持有限.

但是,某些JavaFX场景图形对象支持CSS填充和边距属性.

官方的CSS参考指南说.所以解决方法可能是使用额外的其他布局,例如另一个VBox:

<VBox fx:id="paneLeft" spacing="10">
    <VBox fx:id="innerPaneLeft">
        <TextField promptText="Password"/>
        <Button fx:id="btnLogin" text="Login" maxWidth="10000"/>
    </VBox>
    <Hyperlink text="Registration"/>
</VBox>

更新:
找到一个更完美的方式,但仍然不是通过CSS.

 <?import javafx.geometry.Insets?>

 <VBox fx:id="paneLeft">
        <TextField promptText="Password"/>
        <Button fx:id="btnLogin" text="Login" maxWidth="10000">
            <VBox.margin>
                <Insets>
                    <bottom>10</bottom>
                </Insets>
            </VBox.margin>
        </Button>
        <Hyperlink text="Registration"/>
 </VBox>

这避免了定义不必要的额外布局.