如何在 JavaFX 中的按钮中显示文本？

Question

i'm trying to display some text on those 3 buttons on the top-left corner but somehow it's not possible...

Here's image so you can see where the buttons are:

What i've already tried:

• Adding wraptext="true"
• setting textOverrun="CLIP" But it doesn't work in both cases!

Here's the FXML snippet:

<HBox fx:id="buttons_group" alignment="CENTER_LEFT" prefHeight="22.0" spacing="7" style="-fx-padding: 0 0 0 8" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.5" AnchorPane.topAnchor="0.0">

                  <Button fx:id="closebtn" text="×" textFill="black" onMouseClicked="#onClickCloseBtn" style="-fx-background-radius: 50; -fx-min-height: 9; -fx-min-width: 9; -fx-max-height: 9; -fx-max-width: 9; -fx-background-color: #FF453A" />
                  <Button fx:id="minimizebtn" text="-" textFill="black" onMouseClicked="#onClickMinimizeBtn" style="-fx-background-radius: 50; -fx-min-height: 9; -fx-min-width: 9; -fx-max-height: 9; -fx-max-width: 9; -fx-background-color: #FFD60A" />
                  <Button fx:id="maximizebtn" text="□" textFill="black" onMouseClicked="#onClickMaximizeBtn" style="-fx-background-radius: 50; -fx-min-height: 9; -fx-min-width: 9; -fx-max-height: 9; -fx-max-width: 9; -fx-background-color: #32D74B" />
        </HBox

Thanks!

Answer 1

Set negative padding to your buttons.

You might also want to decrease font size as the default is 12px, while your buttons are 9px in size.

Centering is not perfect with such small buttons though...

Here's an example done in SceneBuilder.

  <HBox alignment="CENTER_LEFT" prefHeight="22.0" spacing="7.0" style="-fx-background-color: #333;">
     <children>
        <Button maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" mnemonicParsing="false" prefHeight="9.0" prefWidth="9.0" style="-fx-background-radius: 4.5; -fx-background-color: #FF453A; -fx-padding: -100;" text="x">
           <font>
              <Font size="10.0" />
           </font>
        </Button>
        <Button maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" mnemonicParsing="false" prefHeight="9.0" prefWidth="9.0" style="-fx-background-radius: 4.5; -fx-background-color: #FFD60A; -fx-padding: -100;" text="-">
           <font>
              <Font size="10.0" />
           </font>
        </Button>
        <Button maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" mnemonicParsing="false" prefHeight="9.0" prefWidth="9.0" style="-fx-background-radius: 4.5; -fx-background-color: #32D74B; -fx-padding: -100;" text="□">
           <font>
              <Font size="10.0" />
           </font>
        </Button>
     </children>
     <padding>
        <Insets bottom="7.0" left="7.0" right="7.0" top="7.0" />
     </padding>
  </HBox>

Result: