画像をスライドさせる

このアプレットは、3枚の画像ファイルを用意し、右から左へ順次画像をスライド表示するようにしてみます。下記で実際に試して頂けます。

アプレット：画像をスライドさせる

実際に実行すると下記のような感じになります。

runメソッド内のループ内で表示する画像のオフセットの変更を行い、画像の中で実際に表示させる部分を決めています。オフセットが画像の大きさに等しくなったらオフセットをクリアして表示対象の画像を切り替えます。

public void run(){
  while(true){
    /* 画像のどの部分を表示するかのオフセットを変更 */
    offset += 1;

    /* オフセットが画像の幅まで大きくなったら画像を変更 */
    if (offset > picWidth - 1){
      offset = 0;

      switch(picNo){
      case 0:
        picNo = 1;
        nextNo = 2;
        break;
      case 1:
        picNo = 2;
        nextNo = 0;
        break;
      case 2:
        picNo = 0;
        nextNo = 1;
        break;
      }
    }
  }
}

paintメソッドが呼び出された時に、メインの画像と次の表示される画像の画像ファイルのNoを参照して、表示する画像を指定しています。またスライドさせるため、一部分を指定の領域内に画像表示できるdrawImageメソッドを使っています。(詳しくは『一部分を指定の領域内に画像表示』を参照して下さい)。

public void paint(Graphics g){
  /* 画像ファイルをバッファに描画 */
  buffer.drawImage(img[picNo],
    0, 0, picWidth - offset, picHeight,
    offset, 0, picWidth, picHeight, this);

  buffer.drawImage(img[nextNo],
    picWidth - offset, 0, picWidth, picHeight,
    0, 0, offset, picHeight, this);
}

サンプル

下記が全てのソースファイルです。

Sample2.java

import java.applet.Applet;
import java.awt.Graphics;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Image;
import java.awt.MediaTracker;

public class Sample2 extends Applet implements Runnable{
  Image img[];
  MediaTracker tracker;

  Thread thread = null;

  int picNo;
  int nextNo;
  int offset;

  int picWidth = 300;  /* 画像の幅 */
  int picHeight = 225;  /* 画像の高さ */

  Dimension size;
  Image back;
  Graphics buffer;

  public void init(){
    tracker = new MediaTracker(this);

    /* 画像ファイルを読み込む */
    img = new Image[3];
    for (int i = 0 ; i < 3 ; i++){
      String file = "../img/pic" + (i + 1) + ".png";
      img[i] = getImage(getCodeBase(), file);
      tracker.addImage(img[i], i);
    }

    picNo = 0;
    nextNo = 1;
    offset = 0;

    /* ダブルバッファ用 */
    size = getSize();
    back = createImage(size.width, size.height);
    buffer = back.getGraphics();

    /* 新しいスレッドを作成し開始する */
    thread = new Thread(this);
    thread.start();
  }

  public void start(){
    try {
      tracker.waitForAll();
    } catch (InterruptedException e) {
    }
  }

  public void update(Graphics g){
    paint(g);
  }

  public void paint(Graphics g){
    /* アプレットの大きさと同じ画像を表示するため下記は実際は不要 */
    buffer.setColor(getBackground());
    buffer.fillRect(0, 0, size.width, size.height);

    /* 画像ファイルをバッファに描画 */
    buffer.drawImage(img[picNo],
      0, 0, picWidth - offset, picHeight,
      offset, 0, picWidth, picHeight, this);

    buffer.drawImage(img[nextNo],
      picWidth - offset, 0, picWidth, picHeight,
      0, 0, offset, picHeight, this);

    g.drawImage(back, 0, 0, this);
  }

  public void run(){
    while(true){
      /* 画像のどの部分を表示するかのオフセットを変更 */
      offset += 1;

      /* オフセットが画像の幅まで大きくなったら画像を変更 */
      if (offset > picWidth - 1){
        offset = 0;

        switch(picNo){
        case 0:
          picNo = 1;
          nextNo = 2;
          break;
        case 1:
          picNo = 2;
          nextNo = 0;
          break;
        case 2:
          picNo = 0;
          nextNo = 1;
          break;
        }
      }

      repaint();

      /* 50ミリ秒待機する */
      try{
        Thread.sleep(50);
      }catch (InterruptedException e){
      }
    }
  }
}

JavaDrive