Contenu connexe
Similaire à iTamabi 13 第3回：iPhoneアプリ実践開発講座 1 画像ファイルの読み込み 画像でアニメーションを作成する
Similaire à iTamabi 13 第3回：iPhoneアプリ実践開発講座 1 画像ファイルの読み込み 画像でアニメーションを作成する (11)
Plus de Atsushi Tadokoro (20)
iTamabi 13 第3回：iPhoneアプリ実践開発講座 1 画像ファイルの読み込み 画像でアニメーションを作成する
- 7. 画像を読み込む手順
‣ ofImageのインスタンスを生成
‣ 例) ofImage myImage;
‣ ofImageクラスのインスタンスmyImageを生成
‣ 画像ファイルを読み込み
‣ 例) myImage.loadImage("hoge.png");
‣ bin/dataフォルダにある hoge.png ファイルを読み込む
‣ 画像を表示
‣ 例) myImage.draw(0, 0);
‣ 座標(0, 0)を左上にして、画像を表示
- 9. 1枚の画像を表示する
‣ testApp.h
#pragma once
#include "ofMain.h"
#include "ofxiPhone.h"
#include "ofxiPhoneExtras.h"
class testApp : public ofxiPhoneApp {
public:
void setup();
void update();
void draw();
void exit();
void touchDown(ofTouchEventArgs &touch);
void touchMoved(ofTouchEventArgs &touch);
void touchUp(ofTouchEventArgs &touch);
void touchDoubleTap(ofTouchEventArgs &touch);
void lostFocus();
void gotFocus();
void gotMemoryWarning();
void deviceOrientationChanged(int newOrientation);
//ofImageクラスのインスタンスmyImageを生成
ofImage myImage;
};
- 10. 1枚の画像を表示する
‣ testApp.mm
#include "testApp.h"
void testApp::setup(){!
//iPhone初期設定
! ofRegisterTouchEvents(this);
! ofxAccelerometer.setup();
! ofxiPhoneAlerts.addListener(this);
! ofBackground(127,127,127);
//画像ファイルの読み込み
myImage.loadImage("myImage.png");
}
void testApp::update(){
}
void testApp::draw(){
//読み込んだ画像ファイルを座標(0, 0)を基準点にして描画
myImage.draw(0, 0);
}
// [後略]
- 15. 2枚の画像を切り替える
‣ testApp.h
#pragma once
#include "ofMain.h"
#include "ofxiPhone.h"
#include "ofxiPhoneExtras.h"
class testApp : public ofxiPhoneApp {
public:
void setup();
void update();
void draw();
void exit();
void touchDown(ofTouchEventArgs &touch);
void touchMoved(ofTouchEventArgs &touch);
void touchUp(ofTouchEventArgs &touch);
void touchDoubleTap(ofTouchEventArgs &touch);
void lostFocus();
void gotFocus();
void gotMemoryWarning();
void deviceOrientationChanged(int newOrientation);
//ofImageクラスのインスタンスを2枚分用意
ofImage image_a;
ofImage image_b;
//画面をタッチしているか否かを判定
bool touched;
};
- 16. 2枚の画像を切り替える
‣ testApp.mm (1/2)
#include "testApp.h"
void testApp::setup(){!
//iPhone初期設定
! ofRegisterTouchEvents(this);
! ofxAccelerometer.setup();
! ofxiPhoneAlerts.addListener(this);
! ofBackground(127,127,127);
//タッチ状態をFalseに
touched = false;
//画像ファイルを2枚読込み
image_a.loadImage("image_a.jpg");
image_b.loadImage("image_b.jpg");
}
void testApp::update(){
}
void testApp::draw(){
if (touched) {
//もしタッチされていたら、image_bを表示
image_b.draw(0, 0);
} else {
//そうでなければ、image_aを表示
image_b.draw(0, 0);
}
}
- 17. 2枚の画像を切り替える
‣ testApp.mm (2 / 2)
// [中略]
void testApp::touchDown(ofTouchEventArgs &touch){
//タッチ状態をTrueに
touched = true;
}
void testApp::touchMoved(ofTouchEventArgs &touch){
}
void testApp::touchUp(ofTouchEventArgs &touch){
//タッチ状態をFalseに
touched = false;
}
// [後略]
- 22. アニメーションを作成
‣ testApp.h
#pragma once
#include "ofMain.h"
#include "ofxiPhone.h"
#include "ofxiPhoneExtras.h"
#define FRAMENUM 12 //読み込む画像の枚数
class testApp : public ofxiPhoneApp {
public:
! void setup();
! void update();
! void draw();
! void exit();
! void touchDown(ofTouchEventArgs &touch);
! void touchMoved(ofTouchEventArgs &touch);
! void touchUp(ofTouchEventArgs &touch);
! void touchDoubleTap(ofTouchEventArgs &touch);
! void lostFocus();
! void gotFocus();
! void gotMemoryWarning();
! void deviceOrientationChanged(int newOrientation);
! //ofImageのインスタンスの配列を生成
! ofImage myImage[FRAMENUM];
! //現在のフレーム数を記録する変数
! int currentFrame;
};
- 23. アニメーションを作成
‣ testApp.mm (1/2)
#include "testApp.h"
void testApp::setup(){!
//iPhone初期設定
! ofRegisterTouchEvents(this);
! ofxAccelerometer.setup();
! ofxiPhoneAlerts.addListener(this);
! ofBackground(255, 255, 255);
ofSetFrameRate(24);
//連番がふられた画像を順番に読み込み
for (int i = 0; i < FRAMENUM; i++) {
//ファイル名を一時的に格納する文字列
char char1[32];
//連番のファイル名を生成
sprintf(char1, "images/myAnim%04d.png", i+1);
//画像をofImageのインスタンスの配列に読み込み
myImage[i].loadImage(char1);
}
//再生フレームを0から始める
currentFrame = 0;
}
// [中略]
- 24. アニメーションを作成
‣ testApp.mm (2/2)
‣void testApp::draw(){
//現在のフレームの画像を表示
myImage[currentFrame].draw(0, 0);
//フレーム数をひとつ進める
currentFrame++;
//もし指定した枚数よりフレーム数が大きくなったら
//フレーム数をリセット
if (currentFrame > FRAMENUM - 1) {
currentFrame = 0;
}
}
