Play with the Processing libraries "ControlP5", "Fisica"

Hello. Recently, I'm addicted to Processing as a hobby (planned) There are "Control P5" and "Fisica" as Processing original libraries. I would like to explain what it can be used for, including notes, using what I actually made as an example.

Real

• 2x speed.

code

Add library

Search from "Sketch"-> "Import Library .."-> "Add Library ..".

Then write the following at the beginning of the code.

sketch.pde

import controlP5.*;
import fisica.*;

Now you can use the modules of either library.

setup() ControlP5 In a nutshell, it's a __ library that makes it easy to create __GUI controllers.

Accordion, Background, Bang, Button, ButtonBar, Chart, CheckBox, ColorPicker, ColorWheel, ControlGroup, Controller, ControllerGroup, DropdownList, FrameRate, Group, Icon, Knob, ListBox, Matrix, MultiList, MultiListButton, Numberbox, Radio, RadioButton, Range , ScrollableList, Slider, Slider2D, Spacer, Tab, Textarea, Textfield, Textlabel, Toggle Reference

You can see that there are various things.

sketch.pde

ControlP5 slider;
ControlP5 button;
ControlP5 toggle;
int sliderValue;

void setup(){
  size(500,500);
  int r = color(255,0,0);

  //slider
  slider = new ControlP5(this);
  slider.addSlider("sliderValue") //Add slider
    .setRange(2,180) //Range of values
    .setValue(25) //Initial value of value
    .setPosition(50,40) //Slider coordinates
    .setColorValue(r) //Caption label color
    .setSize(300,20); //Slider size
    
  // Display the current value of the slider
  slider.getController("sliderValue")
    .getValueLabel()
    .align(ControlP5.RIGHT, ControlP5.BOTTOM_OUTSIDE)
    .setPaddingX(-20);
  
  //button
  button = new ControlP5(this);
  button.addButton("drop_circle") //Function to execute
      .setLabel("Drop")  //Text to display
      .setPosition(25, 400)
      .setSize(100,40);
  
  //Toggle switch
  toggle = new ControlP5(this);
  toggle.addToggle("appear_slope") 
      .setLabel("") //If you do not describe it, the ID name will be given.
      .setMode(ControlP5.SWITCH) //Switch design
      .setPosition(25,450)
      .setSize(100,40)
      .setValue(false);
  ...
//

I referred to @ akspect's article. I think it's more comprehensive about instant methods.

Fisica In a word, this is also __physics simulation library __. A wide lineup from spheres to polygons.

sketch.pde

FWorld world;
FBox box, slope;
FCircle ball;

void setup(){
  ...
  Fisica.init(this); //Initialize(Magic
  world = new FWorld(); //I will add objects to this(Magic
  
  // 
  box = new FBox(100,40);
  box.setPosition(75,420);
  box.setStatic(true); //Make an object stationary
  world.add(box); //add to
  
  slope = new FBox(500,2);
  slope.setStroke(255);
  slope.setPosition(width*2/3, height*2/5);
  slope.setRotation(-PI/5); //Angle setting
  slope.setStatic(true);
  
}

That's all for setup ().

draw()

sketch.pde

void draw(){
  background(sliderValue*1.38);
  
  ball = new FCircle(sliderValue);
  ball.setNoStroke(); //No contour
  ball.setPosition(width*3/4, -sliderValue/2);
  ball.setFill(120, 200, random(255));
  ball.setRestitution(0.6); //Setting the coefficient of restitution

  world.step();
  world.draw();
}

Since the value of sliderValue changes depending on the slider, the background also changes from black to white. At the same time, the size of the generated ball depends on the value of sliderValue. It's a snake, but if you set setRestitution to 1 or higher, the object will continue to jump. The last two lines are magic.

sketch.pde

void drop_circle(){
  world.add(ball);
}

void appear_slope(boolean value){
  if (value == true){
    world.add(slope);
  } else{
    world.remove(slope);
  }
}

The last is the function executed by the button and toggle switch. One caveat is that you shouldn't put a boolean type in .addToggle (). I did it and even more

sketch.pde

void draw(){
  ...
  if (toggleValue == true){
    world.add(slope);
  }else {
    world.remove(slope);
  }
  ...

However, because the draw () function loops infinitely, it creates an infinite slope and repeats processing omissions.

At the end

How was that? Since I have just learned, I think there were some points that were difficult to understand, but I hope that you can add some glamor to your creative coding life. We look forward to your questions, complaints and chats.

Twitter account: @ A9qoxC