PShape Vertices Colored with setFill()

Gallery
1

The following source code demonstrates a PShape 3D colored cube using setFill(index, color) on the vertices to change the colors. Both a Java version and a Python version are shown. The Java cube coordinates were taken from an openGL tutorial and the Python code uses a Box from the trimesh library.

Java demo:

// Cube reference:
// http://www.opengl-tutorial.org/beginners-tutorials/tutorial-4-a-colored-cube/
// setFill(indx,color) documented here: https://processing.org/tutorials/pshape

PShape cube;

void drawMyCube() {
  cube = createShape();
  cube.beginShape(TRIANGLES); // triangle 1 : begin
  cube.vertex( -1.0, -1.0, -1.0 );
  cube.vertex( -1.0, -1.0, 1.0 );
  cube.vertex( -1.0, 1.0, 1.0 ); // triangle 1 : end
  cube.vertex( 1.0, 1.0, -1.0 ); // triangle 2 : begin
  cube.vertex( -1.0, -1.0, -1.0 );
  cube.vertex( -1.0, 1.0, -1.0 );// triangle 2 : end
  cube.vertex( 1.0, -1.0, 1.0 );
  cube.vertex( -1.0, -1.0, -1.0 );
  cube.vertex( 1.0, -1.0, -1.0 );
  cube.vertex( 1.0, 1.0, -1.0 );
  cube.vertex( 1.0, -1.0, -1.0 );
  cube.vertex( -1.0, -1.0, -1.0 );
  cube.vertex( -1.0, -1.0, -1.0 );
  cube.vertex( -1.0, 1.0, 1.0 );
  cube.vertex( -1.0, 1.0, -1.0 );
  cube.vertex( 1.0, -1.0, 1.0 );
  cube.vertex( -1.0, -1.0, 1.0 );
  cube.vertex( -1.0, -1.0, -1.0 );
  cube.vertex( -1.0, 1.0, 1.0 );
  cube.vertex( -1.0, -1.0, 1.0 );
  cube.vertex( 1.0, -1.0, 1.0 );
  cube.vertex( 1.0, 1.0, 1.0 );
  cube.vertex( 1.0, -1.0, -1.0 );
  cube.vertex( 1.0, 1.0, -1.0 );
  cube.vertex( 1.0, -1.0, -1.0 );
  cube.vertex( 1.0, 1.0, 1.0 );
  cube.vertex( 1.0, -1.0, 1.0 );
  cube.vertex( 1.0, 1.0, 1.0 );
  cube.vertex( 1.0, 1.0, -1.0 );
  cube.vertex( -1.0, 1.0, -1.0 );
  cube.vertex( 1.0, 1.0, 1.0 );
  cube.vertex( -1.0, 1.0, -1.0 );
  cube.vertex( -1.0, 1.0, 1.0 );
  cube.vertex( 1.0, 1.0, 1.0 );
  cube.vertex( -1.0, 1.0, 1.0 );
  cube.vertex( 1.0, -1.0, 1.0 );
  cube.endShape();
  for (int i = 0; i < cube.getVertexCount(); i++) {
    cube.setFill(i, color(random(255), random(255), random(255)));
  }
}

void setup() {
  size(600, 600, P3D);
  surface.setTitle("Rotate cube with mouse and click to change colors.");
  strokeWeight(3);
  drawMyCube();
}

void draw() {
  background(209);
  translate(width/2, height/2);
  scale(100);
  rotateX(map(mouseY, 0, height, PI, -PI));
  rotateY(map(mouseX, 0, width, -PI, PI));
  shape(cube);
}

void mousePressed() {
  for (int i = 0; i < cube.getVertexCount(); i++) {
    cube.beginTessellation();
    cube.setFill(i, color(random(255), random(255), random(255)));
    cube.endTessellation();
  }
}

Alternate Java demo with predefined BOX Primitive Shape:

PShape cube;

void setup() {
  size(500, 500, P3D);
  surface.setTitle("Rotate with mouse; click to change color.");
  cube = createShape(BOX, 150, 150, 150);
  cube.setStroke(false);
  updateFill();
}

void updateFill() {
  for (int i = 0; i < cube.getVertexCount(); i++) {
    cube.beginTessellation();
    cube.setFill(i, color(random(255), random(255), random(255)));
    cube.endTessellation();
  }
}

void draw() {
  background(209);
  translate(width/2, height/2);
  rotateX(map(mouseY, 0, height, PI, -PI));
  rotateY(map(mouseX, 0, width, -PI, PI));
  shape(cube);
}

void mousePressed() {
  updateFill();
}

Output:

BOX
BOX642×632 23.9 KB

Python Demo:
Runs in Thonny editor using Imported mode for py5

# Uses Imported mode for py5

import trimesh
from trimesh.primitives import Box

def drawMyBox():
    global myBox
    myBox = convert_shape(Box((150,150,150)))
    for i in range(0, myBox.get_vertex_count()):
        myBox.set_fill(i,color(random(255),random(255),random(255)))
    
def setup():
    size(600, 600, P3D)
    window_title("Rotate with mouse and click to change colors.")
    stroke_weight(3)
    drawMyBox()
    
def draw():
    background(209)
    translate(width/2, height/2)
    rotate_x(remap(mouse_y, 0, height, PI, -PI))
    rotate_y(remap(mouse_x, 0, width, -PI, PI))
    shape(myBox)
    
def mouse_pressed():
    drawMyBox()

Output:

cube
cube862×776 47.9 KB

Alternate Python demo using Quads instead of Triangles:

# Uses Imported mode for py5

def drawMyCube():
  global cube
  cube = create_shape()
  s = 75
  cube.begin_shape(QUADS)
# back (-z)
  cube.vertex(-s, -s, -s)
  cube.vertex(+s, -s, -s)
  cube.vertex(+s, +s, -s)
  cube.vertex(-s, +s, -s)
# front (+z)  
  cube.vertex(-s, -s, +s)
  cube.vertex(+s, -s, +s)
  cube.vertex(+s, +s, +s)
  cube.vertex(-s, +s, +s)
# top (-y)
  cube.vertex(-s, -s, +s)
  cube.vertex(-s, -s, -s)
  cube.vertex(+s, -s, -s)
  cube.vertex(+s, -s, +s)
# bottom (+y)
  cube.vertex(+s, +s, +s)
  cube.vertex(+s, +s, -s)
  cube.vertex(-s, +s, -s)
  cube.vertex(-s, +s, +s)
# left (-x)
  cube.vertex(-s, -s, +s)
  cube.vertex(-s, -s, -s)
  cube.vertex(-s, +s, -s)
  cube.vertex(-s, +s, +s)
# right (+x)
  cube.vertex(+s, -s, +s)
  cube.vertex(+s, -s, -s)
  cube.vertex(+s, +s, -s)
  cube.vertex(+s, +s, +s)
  cube.end_shape()
  for i in range(0, cube.get_vertex_count()):
      cube.set_fill(i,color(random(255),random(255),random(255)))

def setup():
  size(600, 600, P3D)
  window_title("Rotate with mouse click to change colors.")
  stroke_weight(3)
  drawMyCube()

def draw():
  background(209)
  translate(width/2, height/2, 0)
  rotate_x(remap(mouse_y, 0, height, PI, -PI))
  rotate_y(remap(mouse_x, 0, width, -PI, PI))
  shape(cube)

def mouse_pressed():
  drawMyCube()

Output:

quads
quads640×626 22.8 KB

Python code using set_fills():
Py5 has an additional method called set_fills() which does not require iterating through the vertices.

# Uses Imported mode for py5

def drawMyCube():
  global cube
  cube = create_shape()
  s = 75
  cube.begin_shape(QUADS)
# back (-z)
  cube.vertex(-s, -s, -s)
  cube.vertex(+s, -s, -s)
  cube.vertex(+s, +s, -s)
  cube.vertex(-s, +s, -s)
# front (+z)  
  cube.vertex(-s, -s, +s)
  cube.vertex(+s, -s, +s)
  cube.vertex(+s, +s, +s)
  cube.vertex(-s, +s, +s)
# top (-y)
  cube.vertex(-s, -s, +s)
  cube.vertex(-s, -s, -s)
  cube.vertex(+s, -s, -s)
  cube.vertex(+s, -s, +s)
# bottom (+y)
  cube.vertex(+s, +s, +s)
  cube.vertex(+s, +s, -s)
  cube.vertex(-s, +s, -s)
  cube.vertex(-s, +s, +s)
# left (-x)
  cube.vertex(-s, -s, +s)
  cube.vertex(-s, -s, -s)
  cube.vertex(-s, +s, -s)
  cube.vertex(-s, +s, +s)
# right (+x)
  cube.vertex(+s, -s, +s)
  cube.vertex(+s, -s, -s)
  cube.vertex(+s, +s, -s)
  cube.vertex(+s, +s, +s)
  cube.end_shape()
  cube.set_fills(color(random(255),random(255),random(255)) for _ in range(24))

def setup():
  size(600, 600, P3D)
  window_title("Rotate with mouse click to change colors.")
  stroke_weight(3)
  drawMyCube()

def draw():
  background(209)
  translate(width/2, height/2, 0)
  rotate_x(remap(mouse_y, 0, height, PI, -PI))
  rotate_y(remap(mouse_x, 0, width, -PI, PI))
  shape(cube)

def mouse_pressed():
  drawMyCube()

Python code for Jet of Many Colors:

# Uses Imported mode for py5

"""
 Jet.cpp
 A hand modeled Jet airplane
 OpenGL SuperBible
 Beginning of OpenGL lighting sample
 Program by Richard S. Wright Jr.
"""

def  drawJet():
  global jet
  jet = create_shape()
  jet.begin_shape(TRIANGLES)
  
# Nose Cone
  jet.vertex (0.0 , 0.0 , 60.0 ) 
  jet.vertex (-15.0 , 0.0 , 30.0 ) 
  jet.vertex (15.0 ,0.0 ,30.0 ) 

 
  jet.vertex (15.0 ,0.0 ,30.0 ) 
  jet.vertex (0.0 , 15.0 , 30.0 ) 
  jet.vertex (0.0 , 0.0 , 60.0 ) 

  jet.vertex (0.0 , 0.0 , 60.0 ) 
  jet.vertex (0.0 , 15.0 , 30.0 ) 
  jet.vertex (-15.0 ,0.0 ,30.0 ) 

# Body of the Plane
  jet.vertex (-15.0 ,0.0 ,30.0 ) 
  jet.vertex (0.0 , 15.0 , 30.0 ) 
  jet.vertex (0.0 , 0.0 , -56.0 ) 

  jet.vertex (0.0 , 0.0 , -56.0 ) 
  jet.vertex (0.0 , 15.0 , 30.0 ) 
  jet.vertex (15.0 ,0.0 ,30.0 ) 
 
  jet.vertex (15.0 ,0.0 ,30.0 ) 
  jet.vertex (-15.0 , 0.0 , 30.0 ) 
  jet.vertex (0.0 , 0.0 , -56.0 ) 

# Left Wing - Large triangle for bottom
  jet.vertex (0.0 ,2.0 ,27.0 ) 
  jet.vertex (-60.0 , 2.0 , -8.0 ) 
  jet.vertex (60.0 , 2.0 , -8.0 ) 
 
  jet.vertex (60.0 , 2.0 , -8.0 ) 
  jet.vertex (0.0 , 7.0 , -8.0 ) 
  jet.vertex (0.0 ,2.0 ,27.0 ) 
 
  jet.vertex (60.0 , 2.0 , -8.0 ) 
  jet.vertex (-60.0 , 2.0 , -8.0 ) 
  jet.vertex (0.0 ,7.0 ,-8.0 ) 

# Other wing top section
  jet.vertex (0.0 ,2.0 ,27.0 ) 
  jet.vertex (0.0 , 7.0 , -8.0 ) 
  jet.vertex (-60.0 , 2.0 , -8.0 ) 

# Tail section - Bottom of  back end
  jet.vertex (-30.0 , -0.50 , -57.0 ) 
  jet.vertex (30.0 , -0.50 , -57.0 ) 
  jet.vertex (0.0 ,-0.50 ,-40.0 ) 

# Top of left side
  jet.vertex (0.0 ,-0.5 ,-40.0 ) 
  jet.vertex (30.0 , -0.5 , -57.0 ) 
  jet.vertex (0.0 , 4.0 , -57.0 ) 

# Top of right side
 
  jet.vertex (0.0 , 4.0 , -57.0 ) 
  jet.vertex (-30.0 , -0.5 , -57.0 ) 
  jet.vertex (0.0 ,-0.5 ,-40.0 ) 

# Back of bottom of tail
  jet.vertex (30.0 ,-0.5 ,-57.0 ) 
  jet.vertex (-30.0 , -0.5 , -57.0 ) 
  jet.vertex (0.0 , 4.0 , -57.0 ) 
    
# Top of Tail section left
  jet.vertex (0.0 ,0.5 ,-40.0 ) 
  jet.vertex (3.0 , 0.5 , -57.0 ) 
  jet.vertex (0.0 , 25.0 , -65.0 ) 

  jet.vertex (0.0 , 25.0 , -65.0 ) 
  jet.vertex (-3.0 , 0.5 , -57.0 ) 
  jet.vertex (0.0 ,0.5 ,-40.0 ) 

# Back of horizontal section
  jet.vertex (3.0 ,0.5 ,-57.0 ) 
  jet.vertex (-3.0 , 0.5 , -57.0 ) 
  jet.vertex (0.0 , 25.0 , -65.0 ) 

  jet.end_shape()
  jet.set_fills(color(random(255),random(255),random(255)) for _ in range(51))
  
def setup():
  size(600, 600, P3D)
  window_title("Rotate with mouse and click to change colors.")
  stroke_weight(3)
  drawJet()

def draw():
  background(209)
  translate(width/2, height/2, 0)
  scale(3)
  rotate_x(remap(mouse_y, 0, height, PI, -PI))
  rotate_y(remap(mouse_x, 0, width, -PI, PI))
  shape(jet)

def mouse_pressed():
  drawJet()

Output:

jet
jet876×688 28.1 KB

3 Likes