JavaFX Controls in py5

The following source code demonstrates using javafx controls in py5. This demo may be run in the Thonny editor using ‘Imported mode for py5’. In addition, copies of the seven javafx.xxxx.jar files and a copy of javafx.jar must be in a folder entitled ‘jars’ in the py5 sketch folder. These may be copy/pasted from your Processing libraries folder; on MacOS the jar files are located at the following path: Documents/Processing/libraries/javafx/library/yourOSFolder/modules/seven javafx.xxxxx.jar files. The javafx.jar is found in the ‘library’ folder (making eight jar files copy/pasted to the ‘jars’ folder). Disclaimer: May not work in Windows.

# Uses Imported mode for py5
import javafx.stage.Stage

global pane

def toggleBtnAction(event):
  global toggleBtn
  if(toggleBtn.getText() == "Off"):
    toggleBtn.setText("On")
  else:
    toggleBtn.setText("Off")

def dialogBtnAction(self):
  global dialog
  dialog.showAndWait()
  
def sliderBtnAction(self):
  global myCircle
  global slider
  myCircle.setRadius(slider.getValue())
  
def colorPickerAction(self):
  global colorPicker
  global label
  global myCircle
  label.setTextFill(colorPicker.getValue())
  myCircle.setFill(colorPicker.getValue())

def datePickerAction(self):
  global datePicker
  value = datePicker.getValue()
  
def listViewListener(self):
  global listView
  label.setText(str(listView.getSelectionModel().getSelectedItem()))
  
def addControls():
  global toggleBtn
  global dialog
  global myCircle
  global slider
  global colorPicker
  global label
  global datePicker
  global listView
  
# Pane
  pane = javafx.scene.layout.Pane()

# Label
  label = javafx.scene.control.Label("Label")
  font = javafx.scene.text.Font.font("Menlo", javafx.scene.text.FontWeight.BOLD, javafx.scene.text.FontPosture.REGULAR, 15)
  label.setFont(font)
  label.setTextFill(javafx.scene.paint.Color.RED)
  label.setTranslateX(60)
  label.setTranslateY(65)
  pane.getChildren().add(label)

# Toggle Button
  toggleBtn = javafx.scene.control.ToggleButton("Off")
  toggleBtn.setLayoutX(390)
  toggleBtn.setLayoutY(140)
  toggleBtn.isSelected() == False
  toggleBtn.setOnAction(toggleBtnAction)
  pane.getChildren().add(toggleBtn)

# Button with Dialog
  dialog = javafx.scene.control.Dialog()
  dialog.setTitle("Error Dialog")
  btnType = javafx.scene.control.ButtonType("Ok")
  dialog.setContentText("Message goes here.")
  dialog.getDialogPane().getButtonTypes().add(btnType)
  btn = javafx.scene.control.Button("Push Me")
  btn.setLayoutX(80)
  btn.setLayoutY(20)
  btn.setOnAction(dialogBtnAction)
  pane.getChildren().add(btn)

# Circle
  myCircle = javafx.scene.shape.Circle(400, 60, 20)
  myCircle.setFill(javafx.scene.paint.Color.GREEN)
  pane.getChildren().add(myCircle)

# Slider
  slider = javafx.scene.control.Slider(1, 50, 10)
  slider.setLayoutX(190)
  slider.setLayoutY(20)
  tooltip1 = javafx.scene.control.Tooltip("Sets radius")
  slider.setTooltip(tooltip1)
  slider.setOnMouseDragged(sliderBtnAction)
  pane.getChildren().add(slider)

# Spinner
  spinner = javafx.scene.control.Spinner(0, 255, 0)
  spinner.setPrefSize(70, 25)
  spinner.setLayoutX(480)
  spinner.setLayoutY(60)
  pane.getChildren().add(spinner)

# ComboBox
  combo = javafx.scene.control.ComboBox()
  combo.setPromptText("Select One")
  myList = combo.getItems()
  myList.add("Java")
  myList.add("C++")
  myList.add("Python")
  myList.add("Processing")
  combo.setLayoutX(560)
  combo.setLayoutY(70)
  pane.getChildren().add(combo)

# ListView
  items = javafx.collections.FXCollections.observableArrayList("Item 1", "Item 2", "Item 3")
  listView = javafx.scene.control.ListView(items)
  listView.setMaxSize(120, 80)
  listView.setLayoutX(60)
  listView.setLayoutY(90)
  listView.getSelectionModel().selectedItemProperty().addListener(listViewListener)
  pane.getChildren().add(listView)

# TabPane
  tabPane = javafx.scene.control.TabPane()
  tabPane.setLayoutX(30)
  tabPane.setLayoutY(190)
  tab1 = javafx.scene.control.Tab("Tab 1")
  tab2 = javafx.scene.control.Tab("Tab 2")
  tab3 = javafx.scene.control.Tab("Tab 3")
  tab1.setContent(javafx.scene.shape.Rectangle(200, 100, javafx.scene.paint.Color.BLUE))
  tab2.setContent(javafx.scene.shape.Rectangle(200, 100, javafx.scene.paint.Color.RED))
  tab3.setContent(javafx.scene.shape.Rectangle(200, 100, javafx.scene.paint.Color.GREEN))
  tabPane.getTabs().addAll(tab1, tab2, tab3)
  pane.getChildren().add(tabPane)
  
# TextArea
  txtArea = javafx.scene.control.TextArea()
  txtArea.setLayoutX(250)
  txtArea.setLayoutY(190)
  txtArea.setMaxSize(180, 130)
  pane.getChildren().add(txtArea)

# RadioButton Group
  radioPane = javafx.scene.layout.TilePane(15, 15)
  group = javafx.scene.control.ToggleGroup()
  radio1 = javafx.scene.control.RadioButton("A")
  radio1.setToggleGroup(group)
  radio1.setSelected(True)
  radio2 = javafx.scene.control.RadioButton("B")
  radio2.setToggleGroup(group)
  radio3 = javafx.scene.control.RadioButton("C")
  radio3.setToggleGroup(group)
  radioPane.getChildren().addAll(radio1, radio2, radio3)
  radioPane.setLayoutX(200)
  radioPane.setLayoutY(120)
  pane.getChildren().add(radioPane)

# CheckBox
  cBox = javafx.scene.control.CheckBox("Checkbox")
  cBox.setIndeterminate(False)
  cBox.setLayoutX(200)
  cBox.setLayoutY(90)
  pane.getChildren().add(cBox)

# TextField
  txtFld = javafx.scene.control.TextField()
  txtFld.setLayoutX(200)
  txtFld.setLayoutY(150)
  pane.getChildren().add(txtFld)

# MenuBar **** //
  menu = javafx.scene.control.Menu("File")
  menuItem1 = javafx.scene.control.MenuItem("Open")
  menuItem2 = javafx.scene.control.MenuItem("Save")
  menu.getItems().addAll(menuItem1, menuItem2)
  menuBar = javafx.scene.control.MenuBar()
  menuBar.getMenus().add(menu)
  pane.getChildren().add(menuBar)

# ToolBar **** //
  toolBar = javafx.scene.control.ToolBar()
  openBtn = javafx.scene.control.Button("Build")
  saveBtn = javafx.scene.control.Button("Run")
  toolBar.getItems().addAll(openBtn, saveBtn)
  toolBar.setLayoutX(450)
  tbarTip = javafx.scene.control.Tooltip("ToolBar")
  toolBar.setTooltip(tbarTip)
  pane.getChildren().add(toolBar)

# ProgressBar
  pBar = javafx.scene.control.ProgressBar()
  pBar.setLayoutX(560)
  pBar.setLayoutY(20)
  pane.getChildren().add(pBar)

# TreeView **** //
  rootItem = javafx.scene.control.TreeItem("Pets")
  dogItem = javafx.scene.control.TreeItem("Dogs")
  dogItem.getChildren().add(javafx.scene.control.TreeItem("Poodle"))
  dogItem.getChildren().add(javafx.scene.control.TreeItem("Collie"))
  dogItem.getChildren().add(javafx.scene.control.TreeItem("Bulldog"))
  rootItem.getChildren().add(dogItem)

  catItem = javafx.scene.control.TreeItem("Cats")
  catItem.getChildren().add(javafx.scene.control.TreeItem("Siamese"))
  catItem.getChildren().add(javafx.scene.control.TreeItem("Ragdoll"))
  catItem.getChildren().add(javafx.scene.control.TreeItem("Persian"))
  rootItem.getChildren().add(catItem)

  treeView = javafx.scene.control.TreeView()
  treeView.setRoot(rootItem)
  treeView.setLayoutX(460)
  treeView.setLayoutY(110)
  treeView.setMaxSize(140, 230)
  treeView.setShowRoot(True)
  pane.getChildren().add(treeView)

# ColorPicker
  colorPicker = javafx.scene.control.ColorPicker()
  colorPicker.setLayoutX(200)
  colorPicker.setLayoutY(50)
  colorPicker.setValue(javafx.scene.paint.Color.GREEN)
  colorPicker.setOnAction(colorPickerAction) 
  pane.getChildren().add(colorPicker)

# DatePicker
  datePicker = javafx.scene.control.DatePicker()
  datePicker.setLayoutX(30)
  datePicker.setLayoutY(350)
  datePicker.setOnAction(datePickerAction) 
  pane.getChildren().add(datePicker)

# Line Chart
  xAxis = javafx.scene.chart.NumberAxis()
  xAxis.setLabel("No. of months")
  yAxis = javafx.scene.chart.NumberAxis()
  yAxis.setLabel("Dollars Per Dozen")
  lineChart = javafx.scene.chart.LineChart(xAxis, yAxis)
  dataSeries1 = javafx.scene.chart.XYChart.Series()
  dataSeries1.setName("2024")
  dataSeries1.getData().add(javafx.scene.chart.XYChart.Data( 1, 2))
  dataSeries1.getData().add(javafx.scene.chart.XYChart.Data( 2, 3))
  dataSeries1.getData().add(javafx.scene.chart.XYChart.Data(3, 4))
  dataSeries1.getData().add(javafx.scene.chart.XYChart.Data(4, 5))
  dataSeries1.getData().add(javafx.scene.chart.XYChart.Data(5, 6))
  dataSeries1.getData().add(javafx.scene.chart.XYChart.Data(6, 6))
  lineChart.getData().add(dataSeries1)
  lineChart.setTitle("Price of Eggs")
  lineChart.setLayoutX(280)
  lineChart.setLayoutY(350)
  lineChart.setMaxSize(320, 240)
  pane.getChildren().add(lineChart)
  
  return pane

def settings():
  size(1, 1, FX2D)
  
def setup():  
  stage = javafx.stage.Stage()
  stage.setTitle("JavaFX Controls")
  pane = addControls()
  scene = javafx.scene.Scene(pane, 700, 600)
  stage.setScene(scene)
  stage.show()

Output: