Objects / オブジェクト

Jitterクラスを作成し、オブジェクトをインスタンス化して、画面内を移動させます。Casey ReasとBen Fryによる「Getting Started with Processing」からの翻案。

class object instantiation
Objects Class

View Source Code

/*
 * @name Objects
 * @arialabel Small white circle on dark navy background that moves in small amounts in various directions by a small amount by itself like it is jittering 
 * @description Create a Jitter class, instantiate an object,
 * and move it around the screen. Adapted from Getting Started with
 * Processing by Casey Reas and Ben Fry.
 */

let bug; // Declare object

function setup() {
  // createCanvas(710, 400);
  createCanvas(windowWidth, windowHeight);
  // Create object
  bug = new Jitter();
}

function draw() {
  background(50, 89, 100);
  bug.move();
  bug.display();
}

// Jitter class
class Jitter {
  constructor() {
    this.x = random(width);
    this.y = random(height);
    this.diameter = random(10, 30);
    this.speed = 1;
  }

  move() {
    this.x += random(-this.speed, this.speed);
    this.y += random(-this.speed, this.speed);
  }

  display() {
    ellipse(this.x, this.y, this.diameter, this.diameter);
  }
}

License

Source code is available on GitHub p5.js website legacy.

All examples are licensed under CC BY-NC-SA 4.0.