# JavaFX DotView in Default Window

**URL:** <https://discourse.processing.org/t/javafx-dotview-in-default-window/46566>\
**Category:** Gallery\
**Created:** [June 17, 2025, 3:14pm UTC](https://discourse.processing.org/t/javafx-dotview-in-default-window/46566 "2025-06-17T15:14:11Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [June 17, 2025, 3:14pm UTC](https://discourse.processing.org/t/javafx-dotview-in-default-window/46566/1 "2025-06-17T15:14:11Z")

</div>

Demonstrates using JavaFX controls with Processing default window’s _draw()_ using familiar code.

```processing
import javafx.scene.canvas.Canvas;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.Pane;
import javafx.scene.control.Slider;
import javafx.scene.control.ColorPicker;
import javafx.scene.paint.Color;

Canvas canvas;
StackPane root;
Pane pane;
Slider slider;
ColorPicker colorPicker;

void setup(){
  size(600,600,FX2D);
  surface.setTitle("JavaFX DotView in Default Wnd");
  canvas = (Canvas)surface.getNative();
  root = (StackPane)canvas.getParent();
  pane = new Pane();
  root.getChildren().add(pane);
  slider = new Slider(20, 500, 10);
  slider.setLayoutX(190);
  slider.setLayoutY(20);
  pane.getChildren().add(slider);
  colorPicker = new ColorPicker();
  colorPicker.setLayoutX(400);
  colorPicker.setLayoutY(15);
  colorPicker.setValue(Color.GREEN);
  pane.getChildren().add(colorPicker);
}

void draw(){
 background(209);
 float r = (float)colorPicker.getValue().getRed()*255;
 float g = (float)colorPicker.getValue().getGreen()*255;
 float b = (float)colorPicker.getValue().getBlue()*255;
 fill(r,g,b);
 circle(width/2, height/2, (float)slider.getValue());
}

```

**Output:**

 ![dvdw](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/1/d/1d53c78e81e4ac89909c2e8c2feab6b1470afacf.jpeg)