# Customizable Multi-sketch processing program?

**URL:** https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260
**Category:** Libraries
**Created:** [April 14, 2019, 1:15pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260 "2019-04-14T13:15:55Z")
**Posts on this page:** 10
**Page:** 1

<div class="post-metadata">

### Author: ![stan\_11](https://avatars.discourse-cdn.com/v4/letter/s/8491ac/32.png) [@stan\_11](https://discourse.processing.org/u/stan_11)
#### Post date: [April 14, 2019, 1:15pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/1 "2019-04-14T13:15:55Z")

</div>

Hi Nice to see you here, it would be great that if you can spare some of your time to help me go through this. I have trouble implementing multiple window application on Processing.

Basic Background: I am developing a software for brain-computer interface to get my graduation thesis done, I want to configure it like this. **Fig1** The purple area is the control panel. The gray area is the layout for the sub-window. If the users want to have a new sub-window, they click the _Plot_ , **Fig2** show up , and select the time series Plot( three ways for visualizing the brain signal as you can see), the control panel will generate a new subwindow to show the brain signal in the time domain. For the exact design for subwindow, it has plot and configuration droplist. Like this **Fig 3** It has both the Plot component and the configuration component.

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/7e76c109d395416e2b8ce19178c6c6b1294dc25e.jpeg)

Based on information above  
So I need a multiwindow display:

1. The close of them did not affect the main control Bar(main window).
2. I can customize the controllers(_i.e_ drop-down list, button). to make it compatible with my UI style.
3. I can use _Grafica_ or other packages to help me with the plot stuff. And I can access them through t

Then I search online:

G4P can help me with1 definitely. For 3 there is a [solution](https://forum.processing.org/two/discussion/27141/how-to-use-grafica-objects-methods-in-an-independent-window-generated-by-g4p-gui-builder) but not seem convenient if I have to manage multiple sub-windows.

So I want to make a new class extended from G4P so that I can manage each sub-window as a new object. pseudocode should be like

```auto
class MyClass extend Gwindow(){
Control P5
MyClass(pos_x,pos_y,w_width,w_height)
{
//initiate a series of relevant variable
}
viod setup(){}
void draw(){
//some globale variable about the plot.
}
void action_on_close(){
//delete variable about the plot. 
}
}
Then in the main pde file it will be 
void setup()
{
//some button;some droplists
}
ControlEvent(){
//define the behavior of the droplist
// if select the option timeseries plot
//create a new window by
MyClass timeseries = new MyClass(0,0,20,20); 
}

```

In summary, I am looking for a way to make the view of the subwindow customizable while keep the good feature of the G4P( close the main window without closing the main thread) and My solution is to consider each type of subwindow(timeseries, FFT) as types of class so that I can put the controlP5 and Grafica component into these classes which will ease my development. But I did not find a way to extend the Gwindow object of G4P like pseudocode here.

it would be very nice of you if you can provide help or just leave some comments. Plus: I am also open to other ways to implement it(or another language).  
Appreciate your time!

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 14, 2019, 8:43pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/2 "2019-04-14T20:43:23Z")

</div>

Can you post your code so far?

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 15, 2019, 12:19pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/3 "2019-04-15T12:19:34Z")

</div>

One possibly way might be to draw the single program outputs on separate PGraphics of the size you wish. Then you show the PGraphics canvas in the position you want.

Thus the output is cut off and can’t overlap the separate windows

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 15, 2019, 12:20pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/4 "2019-04-15T12:20:33Z")

</div>

But controlP5 also allows to have separate windows I guess (or g4p)

---

<div class="post-metadata">

### Author: ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)
#### Post date: [April 20, 2019, 4:21pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/5 "2019-04-20T16:21:40Z")

</div>

Is your goal that ControlP5 and Grafica be sandboxed in each GWindow – e.g. so that none of the ControlP5 elements in one window can affect / communicate with another GWindow or the main sketch?

If not, have you considered a composition approach as an alternative to inheritence? Create a class that contains a GWindow and your Control elements, then pass the GWindow to the elements as their target PApplet. Use the elements as normal, and they render to the target (untested!)

Normally you could render elements to PGraphics buffers and the draw those onto the windows you want, but I believe that ControlP5 does not render to PGraphics: “drawing into a PGraphics object is not possible since an instance of PApplet is passed to each controller for being drawn.” [\*\*](https://forum.processing.org/one/topic/controlp5-in-pgraphic.html) Of course, GWindow inherits from PApplet…

@quark is the expert on multiwindow g4p applications. In general I’m not sure about the strategy of mixing both GUI libraries though – it seems like introducing a lot of complexity to be working with two GUI libraries at the same time. If you really want ControlP5 elements in multiple windows then I think the demo is to use an awt frame rather than a G4P GWindow-- would that meet your requirements?

- [http://www.sojamo.de/libraries/controlP5/examples/extra/ControlP5frame/ControlP5frame.pde](http://www.sojamo.de/libraries/controlP5/examples/extra/ControlP5frame/ControlP5frame.pde)

Also possibly relevant to you if you go the G4P+CP5 route:

- [https://forum.processing.org/two/discussion/16138/g4p-gwindow-noloop](https://forum.processing.org/two/discussion/16138/g4p-gwindow-noloop)

---

<div class="post-metadata">

### Author: ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)
#### Post date: [April 20, 2019, 4:44pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/6 "2019-04-20T16:44:07Z")

</div>

Are you the guy I have been exchanging emails with over the last few days?

---

<div class="post-metadata">

### Author: ![stan\_11](https://avatars.discourse-cdn.com/v4/letter/s/8491ac/32.png) [@stan\_11](https://discourse.processing.org/u/stan_11)
#### Post date: [April 23, 2019, 3:36pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/7 "2019-04-23T15:36:21Z")

</div>

Yes I am, And I ended up with concesion to single sketch…

---

<div class="post-metadata">

### Author: ![stan\_11](https://avatars.discourse-cdn.com/v4/letter/s/8491ac/32.png) [@stan\_11](https://discourse.processing.org/u/stan_11)
#### Post date: [April 23, 2019, 3:49pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/8 "2019-04-23T15:49:37Z")

</div>

Thanks for your reply, I have tried it, I will post it later on. because it does not work well for my case. Be short, I set a globale ControlP5 _cp5_, created the GWindow _window_, and created buttons in the _window_, but it is not stable. By stable I mean it worked without adding draw method to _window_. However, after the draw method is added, it sometimes crashes, and I have to use force quit. I really do not want to deal with this java-\>processing-\>g4p code…

---

<div class="post-metadata">

### Author: ![stan\_11](https://avatars.discourse-cdn.com/v4/letter/s/8491ac/32.png) [@stan\_11](https://discourse.processing.org/u/stan_11)
#### Post date: [April 23, 2019, 3:50pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/9 "2019-04-23T15:50:44Z")

</div>

Thank for you reply, you words enlight me to dig deeper, but yeah, I failed… the failure was in my reply to jeremygoudlass.

---

<div class="post-metadata">

### Author: ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)
#### Post date: [April 23, 2019, 4:39pm UTC](https://discourse.processing.org/t/customizable-multi-sketch-processing-program/10260/10 "2019-04-23T16:39:31Z")

</div>

> [@stan\_11](#):
>
> I really do not want to deal with this java-\>processing-\>g4p code…

It is possible to create simple windows in Processing V3 this [link](https://gist.github.com/atduskgreg/666e46c8408e2a33b09a) provides one way. You might try this with controlP5.
