# G4P GUI builder library help request

**URL:** <https://discourse.processing.org/t/g4p-gui-builder-library-help-request/34957>\
**Category:** Libraries\
**Created:** [February 3, 2022, 1:59pm UTC](https://discourse.processing.org/t/g4p-gui-builder-library-help-request/34957 "2022-02-03T13:59:06Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![thoegersen](https://avatars.discourse-cdn.com/v4/letter/t/b9e5f3/32.png) [@thoegersen](https://discourse.processing.org/u/thoegersen)\
**Post date:** [February 3, 2022, 1:59pm UTC](https://discourse.processing.org/t/g4p-gui-builder-library-help-request/34957/1 "2022-02-03T13:59:06Z")

</div>

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

Is there a way to hide the buttons created by the G4P GUI builder tool so that they do not ubstruct the background of the window,  
I would like the buttons to either be deleted or hidden when “win” or “lose” == true

\<// Need G4P library  
import g4p\_controls.\*;  
PImage lab, skab;

PImage H2O2, NaI, Saebe;

PImage winScreen = new PImage[30];  
float winScreenFrameNumber = 0;  
PImage loseScreen = new PImage[50];  
float loseScreenFrameNumber = 0;

boolean h2o2 = false, nai = false, saebe = false;

boolean kemikalie1amount = false, kemikalie2amount = false, kemikalie3amount = false;

boolean win = false;  
boolean lose = false;

void setup(){  
size(600, 500, JAVA2D);  
createGUI();  
customGUI();  
// Place your setup code here

lab = loadImage(“Lab.png”);  
lab.resize(width,height);

skab = loadImage(“kemiskab.png”);  
skab.resize(500,500); //MATCH KEMISKAB HEGHT OG WIDTH

for (int i=0; i \< 30; i++){  
winScreen[i] = loadImage(“scene”+(i+1)+“.png”);  
println(i);  
winScreen[i].resize(width, height);  
}  
for (int i=0; i \< 50; i++){  
loseScreen[i] = loadImage(“explosion”+(i+1)+“.png”);  
println(i);  
loseScreen[i].resize(width, height);  
}

H2O2 = loadImage(“H2O2.png”);  
H2O2.resize(50,110);  
NaI = loadImage(“NaI.png”);  
NaI.resize(50,110);  
Saebe = loadImage(“sæbe.png”);  
Saebe.resize(50,110);  
}

void draw(){

if (win == false){  
background(lab);  
}  
if (h2o2 == true){  
image(H2O2, 120, 250);  
}  
if (nai == true){  
image(NaI, 240, 250);  
}  
if (saebe == true) {  
image(Saebe, 360, 250);  
}  
if (win == true){  
background(winScreen[(int)winScreenFrameNumber]);  
winScreenFrameNumber = winScreenFrameNumber + 0.12;  
if (winScreenFrameNumber \> 29){  
winScreenFrameNumber = 0;  
}  
}  
if (lose == true){  
background(loseScreen[(int)loseScreenFrameNumber]);  
loseScreenFrameNumber = loseScreenFrameNumber + 0.33;  
if (loseScreenFrameNumber \>49){  
exit();  
}  
}  
}

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

}\>

\</\* =========================================================

- ==== 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!
- =========================================================  
\*/

public void udfoerforsoeg\_click1(GButton source, GEvent event) { //_CODE_:udfoerforsoeg:772048:  
if (kemikalie1amount == true & kemikalie2amount == true & kemikalie3amount == true & saebe == true & h2o2 == true & nai == true) {  
win = true;  
}  
else {  
lose = true;  
}  
} //_CODE_:udfoerforsoeg:772048:

public void k1option1\_clicked1(GOption source, GEvent event) { //_CODE_:k1option1:514265:  
kemikalie1amount = false;  
} //_CODE_:k1option1:514265:

public void k1option2\_clicked1(GOption source, GEvent event) { //_CODE_:k1option2:467254:  
kemikalie1amount = true;  
} //_CODE_:k1option2:467254:

public void k1option3\_clicked1(GOption source, GEvent event) { //_CODE_:k1option3:761607:  
kemikalie1amount = false;  
} //_CODE_:k1option3:761607:

public void k2option1\_clicked1(GOption source, GEvent event) { //_CODE_:k2option1:669394:  
kemikalie2amount = false;  
} //_CODE_:k2option1:669394:

public void k2option2\_clicked1(GOption source, GEvent event) { //_CODE_:k2option2:896349:  
kemikalie2amount = true;  
} //_CODE_:k2option2:896349:

public void k2option3\_clicked1(GOption source, GEvent event) { //_CODE_:k2option3:633926:  
kemikalie2amount = false;  
} //_CODE_:k2option3:633926:

public void k3option1\_clicked1(GOption source, GEvent event) { //_CODE_:k3option1:370369:  
kemikalie3amount = false;  
} //_CODE_:k3option1:370369:

public void k3option2\_clicked1(GOption source, GEvent event) { //_CODE_:k3option2:795820:  
kemikalie3amount = true;  
} //_CODE_:k3option2:795820:

public void k3option3\_clicked1(GOption source, GEvent event) { //_CODE_:k3option3:507409:  
kemikalie3amount = true;  
} //_CODE_:k3option3:507409:

synchronized public void win\_draw1(PApplet appc, GWinData data) { //_CODE_:KemiSkab:296412:  
appc.background(skab);  
} //_CODE_:KemiSkab:296412:

synchronized public void win\_mouse(PApplet appc, GWinData data, MouseEvent mevent) { //_CODE_:KemiSkab:741848:  
} //_CODE_:KemiSkab:741848:

synchronized public void win\_ky(PApplet appc, GWinData data, KeyEvent kevent) { //_CODE_:KemiSkab:535722:  
} //_CODE_:KemiSkab:741848:

synchronized public void win\_pre(PApplet appc, GWinData data) { //_CODE_:KemiSkab:807217:  
} //_CODE_:KemiSkab:807217:

synchronized public void win\_post(PApplet appc, GWinData data) { //_CODE_:KemiSkab:610303:  
} //_CODE_:KemiSkab:610303:

public void win\_close(GWindow window) { //_CODE_:KemiSkab:303657:  
} //_CODE_:KemiSkab:303657:

public void H2O2Button\_click1(GImageButton source, GEvent event) { //_CODE_:H2O2Button:760100:  
if (h2o2 == true){  
h2o2 = false;  
}  
else{  
h2o2 = true;  
}  
} //_CODE_:H2O2Button:760100:

public void NaIButton\_click1(GImageButton source, GEvent event) { //_CODE_:NaIButton:556360:  
if (nai == true){  
nai = false;  
}  
else{  
nai = true;  
}  
} //_CODE_:NaIButton:556360:

public void saebeButton1\_click1(GImageButton source, GEvent event) { //_CODE_:saebeButton1:713846:  
if (saebe == true){  
saebe = false;  
}  
else{  
saebe = true;  
}  
} //_CODE_:saebeButton1:713846:

// Create all the GUI controls.  
// autogenerated do not edit  
public void createGUI(){  
G4P.messagesEnabled(false);  
G4P.setGlobalColorScheme(GCScheme.PURPLE\_SCHEME);  
G4P.setMouseOverEnabled(false);  
surface.setTitle(“Sketch Window”);  
udfoerforsoeg = new GButton(this, 220, 375, 90, 50);  
udfoerforsoeg.setIcon(“kolbe.png”, 1, GAlign.EAST, GAlign.LEFT, GAlign.TOP);  
udfoerforsoeg.setText(“Udfør forsøg”);  
udfoerforsoeg.setLocalColorScheme(GCScheme.RED\_SCHEME);  
udfoerforsoeg.addEventHandler(this, “udfoerforsoeg\_click1”);  
togGroup1 = new GToggleGroup();  
k1option1 = new GOption(this, 100, 150, 100, 20);  
k1option1.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k1option1.setText(“10 ml”);  
k1option1.setOpaque(false);  
k1option1.addEventHandler(this, “k1option1\_clicked1”);  
k1option2 = new GOption(this, 100, 175, 100, 20);  
k1option2.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k1option2.setText(“20 ml”);  
k1option2.setOpaque(false);  
k1option2.addEventHandler(this, “k1option2\_clicked1”);  
k1option3 = new GOption(this, 100, 200, 100, 20);  
k1option3.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k1option3.setText(“30 ml”);  
k1option3.setOpaque(false);  
k1option3.addEventHandler(this, “k1option3\_clicked1”);  
togGroup1.addControl(k1option1);  
k1option1.setSelected(true);  
togGroup1.addControl(k1option2);  
togGroup1.addControl(k1option3);  
togGroup2 = new GToggleGroup();  
k2option1 = new GOption(this, 220, 150, 100, 20);  
k2option1.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k2option1.setText(“2 ml”);  
k2option1.setOpaque(false);  
k2option1.addEventHandler(this, “k2option1\_clicked1”);  
k2option2 = new GOption(this, 220, 175, 100, 20);  
k2option2.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k2option2.setText(“5 ml”);  
k2option2.setOpaque(false);  
k2option2.addEventHandler(this, “k2option2\_clicked1”);  
k2option3 = new GOption(this, 220, 200, 100, 20);  
k2option3.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k2option3.setText(“7 ml”);  
k2option3.setOpaque(false);  
k2option3.addEventHandler(this, “k2option3\_clicked1”);  
togGroup2.addControl(k2option1);  
k2option1.setSelected(true);  
togGroup2.addControl(k2option2);  
togGroup2.addControl(k2option3);  
togGroup3 = new GToggleGroup();  
k3option1 = new GOption(this, 340, 150, 100, 20);  
k3option1.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k3option1.setText(“3 ml”);  
k3option1.setOpaque(false);  
k3option1.addEventHandler(this, “k3option1\_clicked1”);  
k3option2 = new GOption(this, 340, 175, 100, 20);  
k3option2.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k3option2.setText(“5 ml”);  
k3option2.setOpaque(false);  
k3option2.addEventHandler(this, “k3option2\_clicked1”);  
k3option3 = new GOption(this, 340, 200, 100, 20);  
k3option3.setIconAlign(GAlign.LEFT, GAlign.MIDDLE);  
k3option3.setText(“10 ml”);  
k3option3.setOpaque(false);  
k3option3.addEventHandler(this, “k3option3\_clicked1”);  
togGroup3.addControl(k3option1);  
k3option1.setSelected(true);  
togGroup3.addControl(k3option2);  
togGroup3.addControl(k3option3);  
KemiSkab = GWindow.getWindow(this, “Kemi Skab”, 100, 290, 500, 500, JAVA2D);  
KemiSkab.noLoop();  
KemiSkab.setActionOnClose(G4P.KEEP\_OPEN);  
KemiSkab.addDrawHandler(this, “win\_draw1”);  
KemiSkab.addMouseHandler(this, “win\_mouse”);  
KemiSkab.addKeyHandler(this, “win\_ky”);  
KemiSkab.addPreHandler(this, “win\_pre”);  
KemiSkab.addPostHandler(this, “win\_post”);  
KemiSkab.addOnCloseHandler(this, “win\_close”);  
H2O2Button = new GImageButton(KemiSkab, 80, 60, 40, 80, new String { “H2O2.png”, “H2O2-hover.png”, “H2O2-alpha.png” } , “H2O2-alpha.png”);  
H2O2Button.addEventHandler(this, “H2O2Button\_click1”);  
NaIButton = new GImageButton(KemiSkab, 80, 150, 40, 80, new String { “NaI.png”, “NaI-hover.png”, “NaI-alpha.png” } , “NaI-alpha.png”);  
NaIButton.addEventHandler(this, “NaIButton\_click1”);  
saebeButton1 = new GImageButton(KemiSkab, 80, 250, 40, 80, new String { “sæbe.png”, “sæbe-hover.png”, “sæbe-alpha.png” } , “sæbe-alpha.png”);  
saebeButton1.addEventHandler(this, “saebeButton1\_click1”);  
KemiSkab.loop();  
}

// Variable declarations  
// autogenerated do not edit  
GButton udfoerforsoeg;  
GToggleGroup togGroup1;  
GOption k1option1;  
GOption k1option2;  
GOption k1option3;  
GToggleGroup togGroup2;  
GOption k2option1;  
GOption k2option2;  
GOption k2option3;  
GToggleGroup togGroup3;  
GOption k3option1;  
GOption k3option2;  
GOption k3option3;  
GWindow KemiSkab;  
GImageButton H2O2Button;  
GImageButton NaIButton;  
GImageButton saebeButton1; \>

---

<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:** [February 3, 2022, 4:19pm UTC](https://discourse.processing.org/t/g4p-gui-builder-library-help-request/34957/2 "2022-02-03T16:19:59Z")

</div>

You can make a control visible / invisible with

```auto
controlName.setVisible(false); // make invisible
controlName.setVisible(true); // make visible

```

All controls created by GUI Builder start as visible any controls you want invisible at startup use `setVisible(false)` inside the `customGUI()` method.

---

<div class="post-metadata">

**Author:** ![thoegersen](https://avatars.discourse-cdn.com/v4/letter/t/b9e5f3/32.png) [@thoegersen](https://discourse.processing.org/u/thoegersen)\
**Post date:** [February 3, 2022, 9:36pm UTC](https://discourse.processing.org/t/g4p-gui-builder-library-help-request/34957/3 "2022-02-03T21:36:07Z")

</div>

Thank you very much, it worked exactly like i wanted 😃