makeyourownapp-jam/graphical-app/src/main/resources/fr/emiko/graphicalapp/hello-view.fxml

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

<?import javafx.geometry.Insets?>
<?import javafx.scene.canvas.Canvas?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ColorPicker?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ListView?>
<?import javafx.scene.control.Menu?>
<?import javafx.scene.control.MenuBar?>
<?import javafx.scene.control.MenuItem?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.Separator?>
<?import javafx.scene.control.Slider?>
<?import javafx.scene.control.SplitPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>

<VBox alignment="CENTER" xmlns="http://javafx.com/javafx/23.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="fr.emiko.graphicalapp.HelloController">
   <children>
      <MenuBar VBox.vgrow="NEVER">
         <menus>
            <Menu mnemonicParsing="false" text="File">
               <items>
                  <MenuItem fx:id="newCanvasButton" mnemonicParsing="false" text="New canvas" />
               </items>
            </Menu>
            <Menu mnemonicParsing="false" text="Connect">
               <items>
                  <MenuItem fx:id="hostButton" mnemonicParsing="false" text="Host" />
                  <MenuItem fx:id="joinButton" mnemonicParsing="false" text="Join" />
                  <MenuItem fx:id="disconnectButton" mnemonicParsing="false" text="Disconnect" />
                  <MenuItem fx:id="stopHostButton" mnemonicParsing="false" text="Stop host" />
               </items>
            </Menu>
            <Menu mnemonicParsing="false" text="Edit">
               <items>
                  <MenuItem fx:id="saveButton" mnemonicParsing="false" text="Save" />
                  <MenuItem fx:id="loadButton" mnemonicParsing="false" text="Load" />
               </items>
            </Menu>
            <Menu mnemonicParsing="false" text="Help">
               <items>
                  <MenuItem mnemonicParsing="false" text="About" />
               </items>
            </Menu>
         </menus>
      </MenuBar>
      <SplitPane fx:id="mainPane" dividerPositions="0.16948784722222218">
         <items>
            <VBox prefHeight="200.0" prefWidth="100.0" spacing="10.0">
               <children>
                  <GridPane>
                     <columnConstraints>
                        <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
                     </columnConstraints>
                     <rowConstraints>
                        <RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
                     </rowConstraints>
                     <children>
                        <Label text="Zoom" />
                        <Slider fx:id="zoomSlider" blockIncrement="0.1" majorTickUnit="5.0" max="5.0" min="1.0" minorTickCount="10" showTickLabels="true" showTickMarks="true" snapToTicks="true" value="1.0" GridPane.rowIndex="1" />
                     </children>
                  </GridPane>
                  <GridPane>
                     <columnConstraints>
                        <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
                     </columnConstraints>
                     <rowConstraints>
                        <RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
                     </rowConstraints>
                     <children>
                        <Label fx:id="brushSizeLabel" text="1">
                           <graphic>
                              <Label text="Brush Size :" />
                           </graphic>
                        </Label>
                        <Slider fx:id="brushSizeSlider" blockIncrement="1.0" majorTickUnit="5.0" max="10.0" minorTickCount="9" showTickLabels="true" showTickMarks="true" snapToTicks="true" GridPane.rowIndex="1" />
                     </children>
                  </GridPane>
                  <ColorPicker fx:id="colorPicker" editable="true" />
                  <Separator />
                  <GridPane>
                     <columnConstraints>
                        <ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                        <ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                     </columnConstraints>
                     <rowConstraints>
                        <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                     </rowConstraints>
                     <children>
                        <Button fx:id="addLayerButton" minHeight="25.0" minWidth="25.0" mnemonicParsing="false" text="+" />
                        <Button fx:id="removeLayerButton" minHeight="25.0" minWidth="25.0" mnemonicParsing="false" text="-" GridPane.columnIndex="1" />
                     </children>
                  </GridPane>
                  <ListView fx:id="layerListView" prefHeight="200.0" prefWidth="200.0" />
               </children>
               <padding>
                  <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
               </padding>
            </VBox>
            <ScrollPane fx:id="scrollPane" cache="true" cacheHint="QUALITY" depthTest="ENABLE" hbarPolicy="ALWAYS" style="-fx-background-color: #666666; -fx-background: #666666;" vbarPolicy="ALWAYS">
               <content>
                  <GridPane>
                     <columnConstraints>
                        <ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" />
                     </columnConstraints>
                     <rowConstraints>
                        <RowConstraints minHeight="10.0" valignment="CENTER" vgrow="SOMETIMES" />
                     </rowConstraints>
                     <children>
                        <Pane fx:id="pane">
                           <children>
                              <Canvas fx:id="drawingCanvas" height="600.0" nodeOrientation="INHERIT" translateX="10.0" translateY="10.0" width="800.0" />
                           </children>
                        </Pane>
                     </children>
                  </GridPane>
               </content>
            </ScrollPane>
         </items>
      </SplitPane>
      <HBox>
         <children>
            <Label text="Status : " />
            <Label text="Connected to username@localhost:8090" />
         </children>
         <VBox.margin>
            <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
         </VBox.margin>
      </HBox>
   </children>
</VBox>