1
votes

I wrote a program in Procesisng that renders opaque cubes with random colour and rotation on top of each other, but I'm looking to individually continuously spin each cube while the program is running. Here's my code at the moment,

int boxval = 1;

void setup(){
size (640, 320, P3D);
frameRate(60);
}

void draw(){
  for (int i = 0; i < boxval; i++){
translate(random(0,640), random(0,320), 0); 
rotateY(random(0,360));
rotateX(random(0,360));
rotateZ(random(0,360));
fill(random(0,255),random(0,255),random(0,255),50);
noStroke();
box(64,64,64);
  }
}

Here's a screenshot if it helps at all, Here's a screenshot if it helps.

1

1 Answers

5
votes

This is a great time to use Object Oriented Programming! If I understand the question correctly, you would like each cube to rotate independently of the other cubes. Let's make a Cube class. Think of each cube as an object that we will handle individually.

class Cube {
  float x, y, z; // position of the cube
  float size; // size of cube
  color c; // color of cube
  float xAngle, yAngle, zAngle; // current rotation amount of cube's x, y, z axes
  float xSpeed, ySpeed, zSpeed; // how quickly the cube is rotated in the x, y, z axes 

  // Cube constructor - create the cube and all of its parameters
  Cube(float x_, float y_, float z_, float size_, color c_, float xSpeed_, float ySpeed_, float zSpeed_) {
    x = x_;
    y = y_;
    z = z_;
    size = size_;
    c = c_;
    xSpeed = xSpeed_;
    ySpeed = ySpeed_;
    zSpeed = zSpeed_;

    xAngle = yAngle = zAngle = 0; // starting position
  }

  // update the cube
  // all we're doing is rotating each axis
  void update() {
    xAngle += xSpeed;
    yAngle += ySpeed;
    zAngle += zSpeed;
  }

  // draw the cube to the screen
  void display() {
    pushMatrix(); // need this
    translate(x, y, z); // position on screen
    rotateX(xAngle); // rotation amounts
    rotateY(yAngle);
    rotateZ(zAngle);
    fill(c);
    noStroke(); 
    box(size);
    popMatrix(); // and this
    // push and pop matrix allows for individual cube rotation
    // otherwise you would rotate the whole draw window, which isn't what you're looking for
  }
}

If you would like each cube to change color and position on screen but still rotate independently, the display() function could be something like this instead:

  void display() {
    pushMatrix(); 
    translate(random(0, width), random(0, height), random(-100, 100)); // random position on screen
    rotateX(xAngle);
    rotateY(yAngle);
    rotateZ(zAngle);
    fill(random(255), random(255), random(255), 50); // random color
    noStroke(); 
    box(size);
    popMatrix();
  }

Understanding rotation and translation of elements in Processing is really key. I highly recommend this tutorial from the Processing website if you have not read it. I incorporated some concepts into the Cube class.

Since you would like to have more than one Cube drawn on the screen, let's make an array of Cubes. I chose 25 as an arbitrary number.

Cube[] cube = new Cube[25];

Now in setup(), we'll need to actually create each Cube and give it certain parameters, like position on screen, color, etc. Here is how that is accomplished.

for (int i = 0; i < cube.length; i++) {
  cube[i] = new Cube(random(0, width), random(0, height), 0, // x, y, z position
  random(30, 80), color(random(255), random(255), random(255), 50), // size, color
  random(0.001, 0.020), random(0.001, 0.020), random(0.001, 0.020)); // xSpeed, ySpeed, zSpeed
}

Now we just need to draw the Cubes to the screen and update the rotation of each one, which simply happens in the draw() loop.

for (int i = 0; i < cube.length; i++) {
  cube[i].update();
  cube[i].display()      
}

Here is whole program. It's important to call background() each time through the draw() loop so the display window will be cleared each frame. Comment it out to see what will happen, but I noticed that was not in the code snippet you provided above. I guess it can be an effect though!

Cube[] cube = new Cube[25];

void setup() {
  size(640, 320, P3D);
  smooth();
  frameRate(60);

  for (int i = 0; i < cube.length; i++) {
    cube[i] = new Cube(random(0, width), random(0, height), 0, 
    random(30, 80), color(random(255), random(255), random(255), 50), 
    random(0.001, 0.020), random(0.001, 0.020), random(0.001, 0.020));
  }
}

void draw() {
  camera();
  lights();
  background(50);
  for (int i = 0; i < cube.length; i++) {
    cube[i].update();
    cube[i].display();
  }
}

I'm not sure what your programming background is, but getting a hang of Object Oriented Programming is really helpful in Processing (and other OOP languages), so I'd recommend this OOP tutorial from the Processing website if you need a crash course. My programming life changed when OOP finally made sense.