Basic Button
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
import beastybuttons.*;
BeastyWorld world;
String button = "nothing";
void setup(){
size(500, 500);
world = new BeastyWorld(this);
world.addWidget(new Button(this, "Click me", 40)
.setPosition(width/2, height/3)
.onLeftClick("left").onMiddleClick("middle").onRightClick("right"));
world.disableBackground(true);
}
void draw(){
background(100);
fill(0);
textAlign(CENTER);
text(button + " was clicked", width/2, (height/3)*2);
}
void left(){
button = "left";
}
void middle(){
button = "middle";
}
void right(){
button = "right";
}
Basic Checkbox
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
import beastybuttons.*;
BeastyWorld world;
color color1 = color(200, 200, 50);
color color2 = color(200, 30, 100);
void setup(){
size(500, 500);
world = new BeastyWorld(this);
world.addWidget(new Button(this, "Click me", 40)
.setPosition(width/2, height/3)
.onLeftClick("left"));
world.addWidget(new Checkbox(this, 30, false).setPosition(width/2, height/2));
world.setBackgroundColor(color1);
}
void draw(){
}
void left(){
//the id is automatically generated when not overriden
Checkbox b = (Checkbox)world.get_widget_by_id("Checkbox0");
if(b.getState()){
world.setBackgroundColor(color2);
}
else{
world.setBackgroundColor(color1);
}
}
Basic Label
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
import beastybuttons.*;
BeastyWorld world;
Label label1, label2;
void setup(){
size(500, 500);
world = new BeastyWorld(this);
//this constructor calculates the labelsize
label1 = new Label(this, "click left\nto change position", 30).setPosition("right", "bottom");
//this constructor calculates the labeltextsize
label2 = new Label(this, 300, 100, "click right\nto change color").setPosition("left", "top");
world.addWidget(label1);
world.addWidget(label2);
}
void draw(){
}
void mousePressed(){
if(mouseButton == LEFT){
int choice = int(random(0, 4));
if(choice == 0){
label1.setPosition("right", "top");
label2.setPosition("left", "bottom");
}
else if(choice == 1){
label1.setPosition("left", "top");
label2.setPosition("right", "bottom");
}
else if(choice == 2){
label1.setPosition("right", "bottom");
label2.setPosition("left", "top");
}
else if(choice == 3){
label1.setPosition("left", "bottom");
label2.setPosition("right", "top");
}
}
else if(mouseButton == RIGHT){
label1.setBackgroundColor(color(random(0, 255), random(0, 255), random(0, 255)));
label2.setBackgroundColor(color(random(0, 255), random(0, 255), random(0, 255)));
}
}
Basic Inputfield
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
//NOTE: Inputfield also supports multiline however this input here is meant to be single line so there is no update from the inputfield when a new line is created.
import beastybuttons.*;
BeastyWorld world;
Label l;
Inputfield i;
Button b;
String question;
void setup(){
size(500, 500);
world = new BeastyWorld(this);
question = "Guess the Answer:\nThe one who does it does not say it.\nThe one who says it does not do it\nThe one who takes it does not know it\nThe one who knows it does not take it";
l = new Label(this, question, 20).setPosition(width/2, height/4);
b = new Button(this, "Submit", 20).setPosition(width/2, (height/8)*7).onLeftClick("submit");
//This constructor calculates the size based of the longest input with textsize 10
i = new Inputfield(this, 17, 20).setPosition(width/2, (height/4)*3).setGreyedText("Click to write input");
world.addWidget(i);
world.addWidget(l);
world.addWidget(b);
}
void draw(){
}
void submit(){
if(i.getText().equals("counterfeit money") || i.getText().equals("Counterfeit Money") || i.getText().equals("Counterfeit money")){
//this updates the size of the Label to fit with the new text
l.setText("Congrats,\nright answer!", true);
}
}
Basic BB_Image
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
import beastybuttons.*;
BeastyWorld world;
BB_Image img;
void setup(){
size(500, 500);
world = new BeastyWorld(this);
//IMPORTANT: Set the Size before the Position
img = new BB_Image(this, "data/tree.jpg").setScaleFactor(0.7, 0.6)
.setPosition(width/2, height/2);
world.addWidget(img);
}
void draw(){
}
void mousePressed(){
if(mouseButton == LEFT){
img.cropImage("left", 20);
}
else if(mouseButton == RIGHT){
img.cropImage("bottom", 10);
}
}
Basic Surface
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
import beastybuttons.*;
BeastyWorld world;
BeastySurface surface1, surface2, surface3;
void setup(){
size(1280, 720);
world = new BeastyWorld(this);
world.registerHandler("hotkeys");
surface1 = new BeastySurface(this);
surface2 = new BeastySurface(this);
surface3 = new BeastySurface(this);
surface1.addWidget(new Label(this, "This is Surface 1", 30)
.setPosition("left", "top"));
surface2.addWidget(new Label(this, "This is Surface 2", 30)
.setPosition("left", "top"));
surface3.addWidget(new Label(this, "This is Surface 3", 30)
.setPosition("left", "top"));
surface1.addWidget(new Button(this, "Switch to Surface 2", 30)
.setPosition(width/4, height/2).onLeftClick("switchto2"));
surface1.addWidget(new Button(this, "Switch to Surface 3", 30)
.setPosition((width/4)*3, height/2).onLeftClick("switchto3"));
surface2.addWidget(new Button(this, "Switch to Surface 1", 30)
.setPosition(width/4, height/2).onLeftClick("switchto1"));
surface2.addWidget(new Button(this, "Switch to Surface 3", 30)
.setPosition((width/4)*3, height/2).onLeftClick("switchto3"));
surface3.addWidget(new Button(this, "Switch to Surface 1", 30)
.setPosition(width/4, height/2).onLeftClick("switchto1"));
surface3.addWidget(new Button(this, "Switch to Surface 2", 30)
.setPosition((width/4)*3, height/2).onLeftClick("switchto2"));
surface1.setSurfaceColor(color(255, 100, 100));
surface2.setSurfaceColor(color(150, 50, 50));
surface3.setSurfaceColor(color(0, 100, 200));
world.addSurface(surface1);
world.addSurface(surface2);
world.addSurface(surface3);
world.surface_jump_transition("BeastySurface0");
}
void draw(){
}
void switchto1(){
world.surface_jump_transition("BeastySurface0");
}
void switchto2(){
world.surface_jump_transition("BeastySurface1");
}
void switchto3(){
world.surface_jump_transition("BeastySurface2");
}
Advanced active_hide
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
import beastybuttons.*;
BeastyWorld world;
Label l, l2, l3, l4, l5, l6;
Button change_to_red, change_to_blue;
color red_layout = color(255, 0, 10), blue_layout = color(10, 0, 255);
void setup(){
size(500, 500);
world = new BeastyWorld(this);
l = new Label(this, "Label1", 30).setPosition(width/4, (height/5)*2)
.setBackgroundColor(red_layout);
l2 = new Label(this, "Label2", 30).setPosition(width/4, (height/5)*3)
.setBackgroundColor(red_layout);
l3 = new Label(this, "Label3", 30).setPosition(width/4, (height/5)*4)
.setBackgroundColor(red_layout);
l4 = new Label(this, "Label4", 30).setPosition((width/4)*3, (height/5)*2)
.setBackgroundColor(blue_layout);
l5 = new Label(this, "Label5", 30).setPosition((width/4)*3, (height/5)*3)
.setBackgroundColor(blue_layout);
l6 = new Label(this, "Label6", 30).setPosition((width/4)*3, (height/5)*4)
.setBackgroundColor(blue_layout);
world.addWidget(l);
world.addWidget(l2);
world.addWidget(l3);
world.addWidget(l4);
world.addWidget(l5);
world.addWidget(l6);
change_to_blue = new Button(this, "change to blue Layout", 20).setPosition(width/4, height/8)
.onLeftClick("changetoblue").setOvercolor(color(50, 200, 100));
change_to_red = new Button(this, "change to red Layout", 20).setPosition((width/4)*3, height/8)
.onLeftClick("changetored").setOvercolor(color(50, 200, 100));
world.setBackgroundColor(color(10, 100, 100));
world.addWidget(change_to_blue);
world.addWidget(change_to_red);
l.hide(true);
l2.hide(true);
l3.hide(true);
change_to_blue.setActive(false);
change_to_blue.hide(true);
}
void draw(){
}
void changetoblue(){
l.hide(true);
l2.hide(true);
l3.hide(true);
l4.hide(false);
l5.hide(false);
l6.hide(false);
change_to_red.setActive(true);
change_to_red.hide(false);
change_to_blue.setActive(false);
change_to_blue.hide(true);
}
void changetored(){
l.hide(false);
l2.hide(false);
l3.hide(false);
l4.hide(true);
l5.hide(true);
l6.hide(true);
change_to_red.setActive(false);
change_to_red.hide(true);
change_to_blue.setActive(true);
change_to_blue.hide(false);
}
Advanced export
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
import beastybuttons.*;
BeastyWorld world;
BeastySurface surface1, surface2, surface3;
Button button1, button2, button3;
Checkbox checkbox1, checkbox2, checkbox3;
Inputfield inputfield1, inputfield2, inputfield3;
Label label1, label2, label3;
BB_Image img1, img2, img3;
void setup(){
size(500, 500);
GUIsetup();
}
void draw(){
}
void GUIsetup(){
world = new BeastyWorld(this);
world.registerHandler("hotkeys");
world.registerHandler("tabswitch");
surface1 = new BeastySurface(this);
surface2 = new BeastySurface(this);
surface3 = new BeastySurface(this);
button1 = new Button(this, 100, 30, "Button1").setPosition(width/2, height/2).setHotkey(SHIFT);
button2 = new Button(this, 100, 30, "Button2").setPosition(width/2, height/2);
button3 = new Button(this, 100, 30, "Button3").setPosition(width/2, height/2).setHotkey(CONTROL);
surface1.addWidget(button1);
surface2.addWidget(button2);
surface3.addWidget(button3);
checkbox1 = new Checkbox(this, 30, false).setPosition("right", "bottom");
checkbox2 = new Checkbox(this, 30, false).setPosition("right", "bottom");
checkbox3 = new Checkbox(this, 30, true).setPosition("right", "bottom");
surface1.addWidget(checkbox1);
surface2.addWidget(checkbox2);
surface3.addWidget(checkbox3);
inputfield1 = new Inputfield(this, 10, 300, 100).setPosition("left", "bottom");
inputfield2 = new Inputfield(this, 10, 300, 100).setPosition("left", "bottom");
inputfield3 = new Inputfield(this, 10, 300, 100).setPosition("left", "bottom");
surface1.addWidget(inputfield1);
surface2.addWidget(inputfield2);
surface3.addWidget(inputfield3);
label1 = new Label(this, 300, 100, "label1").setPosition("left", "top");
label2 = new Label(this, 300, 100, "label2").setPosition("left", "top");
label3 = new Label(this, 300, 100, "label3").setPosition("left", "top");
surface1.addWidget(label1);
surface2.addWidget(label2);
surface3.addWidget(label3);
img1 = new BB_Image(this, "Java-Logo.jpg").setPosition("right", "top").setScaleFactor(0.1, 0.1).cropImage("top", 20).cropImage("right", 10);
img2 = new BB_Image(this, "JavaScript-Logo.jpg").setPosition("right", "top").setScaleFactor(0.3, 0.3);
img3 = new BB_Image(this, "Python-Logo.jpg").setScaleFactor(0.1, 0.1).setPosition("right", "top").cropImage("top", 20).cropImage("right", 500);
surface1.addWidget(img1);
surface2.addWidget(img2);
surface3.addWidget(img3);
world.addSurface(surface1);
world.addSurface(surface2);
world.addSurface(surface3);
world.exportLayout("export.beasty");
}
Advanced Inputfield
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
import beastybuttons.*;
BeastyWorld world;
Inputfield input;
Inputfield input2;
void setup(){
size(700, 700);
world = new BeastyWorld(this);
input = new Inputfield(this, 10, 30).setPosition(399, 399).setHotkey(ALT)
.createTooltip("Tooltip", 10).configureTooltip(false, 3000).setTooltipPosition(400, 300);
input2 = new Inputfield(this, 10, 300, 100).setPosition(199, 199).setHotkey(CONTROL);
world.addWidget(input);
world.addWidget(input2);
input.setInputLimit(50);
input2.setInputLimit(50);
world.registerHandler("hotkeys");
}
void draw(){
input.setSize(input.getSize()[0], input.getSize()[1], true);
input2.setTextsize(input2.getTextSize(), true);
}
Advanced Layers
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
import beastybuttons.*;
BeastyWorld world;
Label l, l2, l3, l4, l5;
Button change;
Inputfield input_layer, input_label;
void setup(){
size(500, 500);
world = new BeastyWorld(this);
l = new Label(this, "I am on Layer 0", 30).setPosition(width/2, height/2-(height/20)*2).setLayer(0).setBackgroundColor(color(15, 255, 1));
l2 = new Label(this, "I am on Layer 1", 30).setPosition(width/2, height/2-height/20).setLayer(1).setBackgroundColor(color(15*2, 255/2, 4));
l3 = new Label(this, "I am on Layer 2", 30).setPosition(width/2, height/2).setLayer(2).setBackgroundColor(color(15*3, 255/3, 9));
l4 = new Label(this, "I am on Layer 3", 30).setPosition(width/2, height/2+height/20).setLayer(3).setBackgroundColor(color(15*4, 255/4, 16));
l5 = new Label(this, "I am on Layer 4", 30).setPosition(width/2, height/2+(height/20)*2).setLayer(4).setBackgroundColor(color(15*5, 255/5, 25));
world.addWidget(l);
world.addWidget(l2);
world.addWidget(l3);
world.addWidget(l4);
world.addWidget(l5);
change = new Button(this, "set", 30).setPosition(width/2, "bottom").onLeftClick("change");
input_layer = new Inputfield(this, 6, 30).setPosition("right", "bottom").setGreyedText("layer");
world.addWidget(input_layer);
input_label = new Inputfield(this, 6, 30).setPosition("left", "bottom").setGreyedText("label");
world.addWidget(input_label);
world.addWidget(change);
}
void draw(){
}
void change(){
String layer_str = input_layer.getText();
String label = input_label.getText();
int layer = 0;
if(layer_str.equals("one")){
layer = 1;
}
else if(layer_str.equals("two")){
layer = 2;
}
else if(layer_str.equals("three")){
layer = 3;
}
else if(layer_str.equals("four")){
layer = 4;
}
else if(layer_str.equals("five")){
layer = 5;
}
else if(layer_str.equals("zero")){
layer = 0;
}
if(label.equals("one")){
l.setLayer(layer);
l.setText("I am on Layer " + str(layer), false);
}
if(label.equals("two")){
l2.setLayer(layer);
l2.setText("I am on Layer " + str(layer), false);
}
if(label.equals("three")){
l3.setLayer(layer);
l3.setText("I am on Layer " + str(layer), false);
}
if(label.equals("four")){
l4.setLayer(layer);
l4.setText("I am on Layer " + str(layer), false);
}
if(label.equals("five")){
l5.setLayer(layer);
l5.setText("I am on Layer " + str(layer), false);
}
input_layer.clearInput();
input_label.clearInput();
}
Advanced Logging
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
import beastybuttons.*;
BeastyWorld world;
Button b;
Inputfield input1, input2;
Checkbox loggingbox;
Label logginglabel;
boolean dark_mode = false;
void setup() {
size(500, 500);
world = new BeastyWorld(this);
b = new Button(this, "Dark Background", 20, true).setPosition("left", "top")
.setHotkey('Q').onLeftClick("changebackground");
loggingbox = new Checkbox(this, 30, true, false).setPosition(width/4, height/2)
.setChecktype("point").setHotkey('Y').onCheck("enableLogging").onUncheck("disableLogging");
logginglabel = new Label(this, "logging", 30, true).setPosition(width/2, height/2);
input1 = new Inputfield(this, 10, 20, true).setPosition("left", "bottom").setGreyedText("loginput")
.setHotkey(CONTROL);
input2 = new Inputfield(this, 10, 20, true).setPosition("right", "bottom").setGreyedText("loginput")
.setHotkey(ALT);
world.registerHandler("hotkeys");
world.addWidget(b);
world.addWidget(loggingbox);
world.addWidget(logginglabel);
world.addWidget(input1);
world.addWidget(input2);
}
void draw() {
}
void changebackground(){
if(!dark_mode){
world.setBackgroundColor(color(10, 10, 10));
}
else{
world.setBackgroundColor(color(200, 200, 200));
}
dark_mode = !dark_mode;
}
void enableLogging(){
world.enableLogging(1, "data/log.txt");
}
void disableLogging(){
world.disableLogging();
}
