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

学習日

2025年10月21日

名前

河西恵太

練習問題4-2-1

上の例題を参考にして、1秒ごとに切り替わるスライドショーとして、
表示される写真を5枚に増やしなさい

回答

let photo = [];
let n = 0;

function preload() {
  photo[0] = loadImage('olive-700x933.jpg');
  photo[1] = loadImage('mint-700x933.jpg');
  photo[2] = loadImage('rukka-700x933.jpg');
  photo[3] = loadImage('kaori.jpg');
  photo[4] = loadImage('yuichi.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;
}

感想

下のプログラムが例題のところで完成していたので上のところに追加したい画像をリストに入れるだけでいいので一瞬で終わらせられた。

また、画像を読み込むときのやり方を知ることができました。それほど難しくないので使えるときにささっと使えるようにしたいです。

コメントする