Example
// Learning Processing
// Daniel Shiffman
// http://www.learningprocessing.com

// Example 9-8: A snake following the mouse

// Declare two arrays with 50 elements.
int[] xpos = new int[50]; 
int[] ypos = new int[50];

void setup() {
  size(200,200);
  
  smooth();
  // Initialize all elements of each array to zero.
  for (int i = 0; i < xpos.length; i ++ ) {
    xpos[i] = 0; 
    ypos[i] = 0;
  }
}

void draw() {
  background(255);
  
  // Shift array values
  for (int i = 0; i < xpos.length-1; i ++ ) {
    // Shift all elements down one spot. 
    // xpos[0] = xpos[1], xpos[1] = xpos = [2], and so on. Stop at the second to last element.
    xpos[i] = xpos[i+1];
    ypos[i] = ypos[i+1];
  }
  
  // New location
  xpos[xpos.length-1] = mouseX; // Update the last spot in the array with the mouse location.
  ypos[ypos.length-1] = mouseY;
  
  // Draw everything
  for (int i = 0; i < xpos.length; i ++ ) {
     // Draw an ellipse for each element in the arrays. 
     // Color and size are tied to the loop's counter: i.
    noStroke();
    fill(255-i*5);
    ellipse(xpos[i],ypos[i],i,i);
  }
}
  • mauritus

    where did you declare xpos.length?
    what is xpos.length?
    you should explain your programs better.

  • http://www.learningprocessing.com Daniel Shiffman

    length is a “property” of an array so you can always access it with the dot syntax. See:

    http://processing.org/reference/Array.html

  • volkan ongun

    you should not copy paste everything. google it better

  • Anne

    how can i add interactivity to this “snake?”

  • Arnau Mas

    can you merge the value shifting and the drawing into one single loop?

  • shiffman

    indeed though note how the shifting has to skip the last element.

  • Arnau Mas

    and could you shift the array the other way, that is array[i] = array[i-1]. Is there a particular reason you do it from last to first (i = i+1) rather than first to last (i = i-1)’

  • shiffman

    Just style I suppose, it doesn’t matter whether you use the array front to back or vice versa.

  • Arnau Mas

    Alright, thanks!

  • Adrien

    Sometimes mistakes make interessting results : if forget to reinitiate background inside draw(), your snake will looks like an infinite 3D worm… :

    int [] xpos = new int [50];

    int [] ypos = new int [50];

    void setup () {

    size (400, 400);

    background (255);

    smooth();

    for (int i =0; i<xpos.length; i++) {

    xpos[i] =0;

    ypos[i]=0;

    }

    }

    void draw() {

    for (int i=0; i<xpos.length-1; i++) {

    xpos [i]=xpos[i+1];

    ypos [i]=ypos[i+1];

    }

    xpos [xpos.length-1] =mouseX;

    ypos [ypos.length-1]=mouseY;

    for (int i= 0; i<xpos.length; i++) {

    noStroke();

    fill (255-i*5);

    ellipse (xpos[i], ypos[i], i, i);

    }

    }

    void mousePressed (){

    background (255);

    }