# G4P library with GUI builder - Can I make Sliders in an Child applet?

**URL:** <https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646>\
**Category:** Libraries\
**Created:** [November 23, 2020, 9:57pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646 "2020-11-23T21:57:45Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![laptophead](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/laptophead/32/2701_2.png) [@laptophead](https://discourse.processing.org/u/laptophead)\
**Post date:** [November 23, 2020, 9:57pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/1 "2020-11-23T21:57:45Z")

</div>

> please format code with \</\> button \* [homework policy](https://discourse.processing.org/faq/#homework) \* [asking questions](https://discourse.processing.org/t/2147)

First of all , I love the GUI builder. Saved me lots of trouble… Thank you authors.

I am using the Demos/Tests/MultipleWindows sketch and I got a a second applet and I’d like to make features in the applet. Possible?

Thanks  
Mitch

---

<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:** [November 23, 2020, 10:01pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/2 "2020-11-23T22:01:31Z")

</div>

I never did this, but maybe check out this: [G4P - Checkbox grid](https://discourse.processing.org/t/g4p-checkbox-grid/25585/11)

quark made the library by the way

(forget the grid, it’s about handling the new Window imho)

Chrisir

---

<div class="post-metadata">

**Author:** ![laptophead](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/laptophead/32/2701_2.png) [@laptophead](https://discourse.processing.org/u/laptophead)\
**Post date:** [November 23, 2020, 10:23pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/3 "2020-11-23T22:23:26Z")

</div>

Good to see you again here. Thanks for the previous help with the legs,

I will try that. Sounds hard.  
But before that, a simpler question:  
Can I start / stop the applet after the main sketch is up?

In setup there is the line that starts it  
child = new ChildApplet();  
But I can’t cancel that after the sketch started. Or can I ? I have a toggle button to do it,.

```auto
public void imgTogButton1_click1(GImageToggleButton source, GEvent event) { //_CODE_:imgTogButton1:800288:
  println("imgTogButton1 - GImageToggleButton >> GEvent." + event + " @ " + millis());
  //imgTogButton1 = source.isSelected();
   Toggle = !Toggle; // false is Down 
   if (Toggle)
   {rect(30, 20, 55, 55, 7);
    println (Toggle);
   }
}

```

---

<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:** [November 23, 2020, 10:35pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/4 "2020-11-23T22:35:35Z")

</div>

a child applet?

Wouldn’t child window be easier, as in the link?  
I dunno…

Sorry, I can’ help you here…

---

<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:** [November 24, 2020, 10:47am UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/5 "2020-11-24T10:47:19Z")

</div>

> [@laptophead](#):
>
> I got a a second applet and I’d like to make features in the applet. Possible?

What do you mean by ‘features’?

> [@laptophead](#):
>
> In setup there is the line that starts it  
> child = new ChildApplet();

There is no class called `ChildApplet` in G4P - if you want a secondary window then use G4P’s `GWindow` class.

GUI Builder alreaddy allows you to create secondary windows and add G4P controls to them. Just make sure you add a draw handler for the new window.

---

<div class="post-metadata">

**Author:** ![laptophead](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/laptophead/32/2701_2.png) [@laptophead](https://discourse.processing.org/u/laptophead)\
**Post date:** [November 24, 2020, 5:02pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/6 "2020-11-24T17:02:48Z")

</div>

Quark  
Thanks a lot, I did make a second window with your example.  
But I was hoping to be able to open GUI Builder from tools and see the new window.  
Then make features, like buttons and sliders.

Is that possible?  
Mitch

---

<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:** [November 24, 2020, 5:33pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/7 "2020-11-24T17:33:26Z")

</div>

> [@laptophead](#):
>
> Thanks a lot, I did make a second window with your example.

What example?

As I said there is no class called `ChildApplet` in G4P. Since GUI Builder works exclusively with G4P it will not work with the `ChildApplet` class.

If you haven’t already done so I recommend you look at the four GUI Builder videos on my [website](http://www.lagers.org.uk/g4ptool/index.html).

---

<div class="post-metadata">

**Author:** ![laptophead](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/laptophead/32/2701_2.png) [@laptophead](https://discourse.processing.org/u/laptophead)\
**Post date:** [November 24, 2020, 5:46pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/8 "2020-11-24T17:46:01Z")

</div>

Someone recommended this above

> [@G4P - Checkbox grid](https://discourse.processing.org/t/g4p-checkbox-grid/25585/11):
>
> This is quite simple and does not require you to modify the CheckboxGrid class. Simply create the GWindow, add a draw handler with a background statement and pass the reference to the new window in the CheckboxGrid constructor. This is a modified version of my previous example. It will create 2 extra windows and 3 CheckboxGrids, one for each window. import g4p\_controls.\*; // Demonstration of a 2D grid of checkboxes. The size of the grid is user defineable. // CheckboxGrid cbg0, cbg1, cbg2; …

Is that a good example to start with for multi windows?

Thanks

---

<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:** [November 25, 2020, 3:00pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/9 "2020-11-25T15:00:14Z")

</div>

> [@laptophead](#):
>
> Is that a good example to start with for multi windows?

Not if you are using GUI Builder.

**Creating a secondary window with a slider on it**

1. Start Processing
2. Create a new empty sketch
3. Start GUI Builder  
**Using GUI Bulder**
4. clcik on the new window button

- add a draw handler called `win_draw`

1. click on the slider button to add a slider to the new window

If you follow the above instruction you will get a sketch with 2 windows and a slider in the secndary one and the code will look like

```auto
// Need G4P library
import g4p_controls.*;
// You can remove the PeasyCam import if you are not using
// the GViewPeasyCam control or the PeasyCam library.
import peasy.*;

public void setup() {
  size(480, 320, JAVA2D);
  createGUI();
  customGUI();
  // Place your setup code here
}

public void draw() {
  background(230);
}

// Use this method to add additional statements
// to customise the GUI controls
public void customGUI() {
}

```

and in the second tab

```auto
/* =========================================================
 * ==== WARNING ===
 * =========================================================
 * The code in this tab has been generated from the GUI form
 * designer and care should be taken when editing this file.
 * Only add/edit code inside the event handlers i.e. only
 * use lines between the matching comment tags. e.g.

 void myBtnEvents(GButton button) { //_CODE_:button1:12356:
     // It is safe to enter your event code here  
 } //_CODE_:button1:12356:
 
 * Do not rename this tab!
 * =========================================================
 */

synchronized public void win_draw1(PApplet appc, GWinData data) { //_CODE_:window1:452479:
  appc.background(230);
} //_CODE_:window1:452479:

public void slider1_change1(GSlider source, GEvent event) { //_CODE_:slider1:581575:
  println("slider1 - GSlider >> GEvent." + event + " @ " + millis());
} //_CODE_:slider1:581575:

// Create all the GUI controls. 
// autogenerated do not edit
public void createGUI(){
  G4P.messagesEnabled(false);
  G4P.setGlobalColorScheme(GCScheme.BLUE_SCHEME);
  G4P.setMouseOverEnabled(false);
  surface.setTitle("Sketch Window");
  window1 = GWindow.getWindow(this, "Window title", 0, 0, 240, 120, JAVA2D);
  window1.noLoop();
  window1.setActionOnClose(G4P.KEEP_OPEN);
  window1.addDrawHandler(this, "win_draw1");
  slider1 = new GSlider(window1, 70, 40, 100, 40, 10.0);
  slider1.setLimits(0.5, 0.0, 1.0);
  slider1.setNumberFormat(G4P.DECIMAL, 2);
  slider1.setOpaque(false);
  slider1.addEventHandler(this, "slider1_change1");
  window1.loop();
}

// Variable declarations 
// autogenerated do not edit
GWindow window1;
GSlider slider1; 

```

---

<div class="post-metadata">

**Author:** ![laptophead](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/laptophead/32/2701_2.png) [@laptophead](https://discourse.processing.org/u/laptophead)\
**Post date:** [December 2, 2020, 5:13pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/10 "2020-12-02T17:13:28Z")

</div>

Thanks a lot, That works for me. I was not aware I can do that.

Also for the first time I made a decimal output slider.

The depiction of the slider shows fine, 2 digit decimals but the output is an integer and a zero.  
I am using the GUI builder and here is the code it generated:

```auto
  IMU_Slider = new GSlider(this, 1230, 300, 210, 60, 10.0);
  IMU_Slider.setShowValue(true);
  IMU_Slider.setShowLimits(true);
  IMU_Slider.setLimits(0.0, -6.0, 6.0);
  IMU_Slider.setNbrTicks(5);
  IMU_Slider.setShowTicks(true);
  IMU_Slider.setNumberFormat(G4P.DECIMAL, 2);
  IMU_Slider.setLocalColorScheme(GCScheme.PURPLE_SCHEME);
  IMU_Slider.setOpaque(true);
  IMU_Slider.addEventHandler(this, "slider4_change1");

```

To get the value out I use

```auto
public void slider4_change1(GSlider source, GEvent event) { //_CODE_:IMU_Slider:603197:
 // println("IMU_Slider - GSlider >> GEvent." + event + " @ " + millis());
    float IMU_Bias = source.getValueI();
    println (IMU_Bias);

```

What am I doing wrong,  
Thanks again for this library , better than any thing.

Mitch

---

<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:** [December 2, 2020, 5:36pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/11 "2020-12-02T17:36:08Z")

</div>

> [@laptophead](#):
>
> The depiction of the slider shows fine, 2 digit decimals but the output is an integer and a zero.

Internally all sliders store their value as a float and you have used this  
`float IMU_Bias = source.getValueI();`  
to retrieve the value which is the problem. You are asking the slider to return the value as an integer and then store in in a float so it will always have a zero after the decimal point.

Instead use this  
`float IMU_Bias = source.getValueF();`  
which will return the slider value as a float.

---

<div class="post-metadata">

**Author:** ![laptophead](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/laptophead/32/2701_2.png) [@laptophead](https://discourse.processing.org/u/laptophead)\
**Post date:** [December 2, 2020, 6:07pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/12 "2020-12-02T18:07:53Z")

</div>

Thanks that worked, but I get too many decimals, such as 1.4081631

In the GUI builder I asked in "Numeric precision " for 1.  
Any ideas?  
Thanks

---

<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:** [December 3, 2020, 8:38am UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/13 "2020-12-03T08:38:37Z")

</div>

> [@laptophead](#):
>
> `IMU_Slider.setNumberFormat(G4P.DECIMAL, 2);`

This simply controls how decimal numbers appear on the slider e.g. limits and current value it has _ **no effect on the value stored internally** _ which happens to be a `float` with 7-8 significant figures

> [@quark](#):
>
> float IMU\_Bias = source.getValueF();

This retrieves the _ **value stored internally** _ as a float so it can be used in calculations or whaever.

If you want to display the number as a string with the specified decimal places then use  
`String IMU_BiasS = source.getValueS();`

---

<div class="post-metadata">

**Author:** ![laptophead](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/laptophead/32/2701_2.png) [@laptophead](https://discourse.processing.org/u/laptophead)\
**Post date:** [December 4, 2020, 10:41pm UTC](https://discourse.processing.org/t/g4p-library-with-gui-builder-can-i-make-sliders-in-an-child-applet/25646/14 "2020-12-04T22:41:50Z")

</div>

Thanks , I made a little process and trimmed to 2 decimals.  
IMU\_Bias = source.getValueF()\*100;  
int R = round (IMU\_Bias);  
IMU\_Bias = R/100.00;  
println (IMU\_Bias);

Mitch