user2196346
user2196346

Reputation: 51

How to set javafx button Icon using shape?

I want to set my button icon using some geometry shapes, such as circle, square, etc.

I also want to set it in FXML something like:

<Button .....>
  <graphics>
    <group>
      <shape>
      ......
      </shape>
    </group>
  </graphics>
</Button>

Is it possible? I do know how to load image icon into ImageView then setGraphic.

TIA

Upvotes: 0

Views: 2774

Answers (1)

jewelsea
jewelsea

Reputation: 159281

The graphic in a button can be any Node. A Shape such as a Circle is a Node.

So just set the button graphic to the shape. You can even put many shapes in a container such as a VBox or StackPane and set the button's graphic to the container so the graphic consists of many shapes.

Here is a sample FXML file you can copy and paste and load up in SceneBuilder 2.

dontpanic

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.shape.*?>

<VBox spacing="10.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
  <children>
    <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="Panic">
      <graphic>
        <Circle fill="RED" radius="8.0" stroke="BLACK"/>
      </graphic>
    </Button>
    <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="All OK">
      <graphic>
        <StackPane>
          <children>
            <Rectangle arcHeight="5.0" arcWidth="5.0" fill="LEMONCHIFFON" height="15.0" stroke="BLACK"
                       strokeType="INSIDE" width="15.0"/>
            <SVGPath
                content="M 1.3657704,4.938667 C 1.1462945,5.1582921 1.1462945,5.5133282 1.3657704,5.7329533 L 3.7236648,8.0924507 C 3.9431407,8.3120765 4.2979355,8.3120765 4.5174113,8.0924507 L 9.5366913,3.0697579 C 9.7561672,2.8501328 9.7561674,2.4950969 9.5366913,2.2754716 L 8.6962538,1.4344625 C 8.4767779,1.2148374 8.121983,1.2148374 7.9025071,1.4344625 L 4.6107933,4.7284147 L 3.4902099,3.6070693 C 3.270734,3.3874441 2.9159392,3.387444 2.6964632,3.6070693 L 1.3657704,4.938667 z"
                fill="GREEN"/>
          </children>
        </StackPane>
      </graphic>
    </Button>
  </children>
  <padding>
    <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/>
  </padding>
</VBox>

Upvotes: 1

Related Questions