04-02 写真をスライド表示

学習日

6月24日

名前

中村 結

✅ 練習問題 4-2-1

let photo = [];
let n = 0;

function preload() {
  photo[0] = loadImage('img/olive.jpg');
  photo[1] = loadImage('img/mint.jpg');
  photo[2] = loadImage('img/rukka.jpg');
  photo[3] = loadImage('img/yuichi.jpg');
  photo[4] = loadImage('img/kaori.jpg');
}

function setup() {
  createCanvas(202, 268);
  frameRate(1);  // 1秒に1回
}

function draw() {
  background(220);

  image(photo[n], 0, 0, 202, 268);
  n = (n + 1) % 5;
}

📷 実行結果

5枚の画像が順番に繰り返し表示される

まとめ

・画像を描画するにはbackground(); と image(); を使うことで描画することができる

・画像の数を増やすにはphotoの数を増やしていくことでできる

・%はあまりを意味する。(繰り返すときに使われることが多い)

コメントする