Home > Software design >  How can i show text in a Button in JavaFX?
How can i show text in a Button in JavaFX?

Time:03-23

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:

enter image description here

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" onm ouseClicked="#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" onm ouseClicked="#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" onm ouseClicked="#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!

CodePudding user response:

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 : result visualized in SceneBuilder

  • Related