The document discusses openFrameworks, an open-source C++ toolkit for creative coding, emphasizing its potential as a new material for expression in technology. It details its capabilities including cross-platform support, libraries for graphics and audio, and examples of setting up interactive applications, especially for mobile devices like the iPhone. Additionally, it covers coding structures for handling touch events, audio input/output, and graphics rendering, showcasing its use in creating an interactive sound game.

1. Openframeworks x Mobile
2011.08.20
黃怡靜
Janet Huang
@janetyc

2. why I am here...

3. why openframeworks...

4. openFrameworks is an open source C++ toolkit
for creative coding.

5. Computer Technology
“is not a tool;
it is a new material for expression”
Maeda, J. (2004). Creative Code. New York: Thames & Hudson Inc.

6. Media
Hardware
Openframeworks
Communication

7. cross platform
mac iphone windows linux android

8. Pros Cons
easy to use experimental
open source not complete
&
interactivity

9. basic libraries
openGL graphic
rtAudio audio input/output
freeType
fonts
freeImage
image input/output
quicktime
video playing
sequence grabbing

10. OF structure

11. OF component
openframeworks
apps addons libs
examples addons

12. android app
osx app iphone app
main.cpp main.mm
testApp.cpp testApp.mm
testApp.h testApp.h

13. #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 touchCancelled(ofTouchEventArgs &touch);
! void lostFocus();
! void gotFocus();
! void gotMemoryWarning();
! void deviceOrientationChanged(int
newOrientation);
};
testApp.h

14. #include "testApp.h"
//--------------------------------------------------------------
void testApp::setup(){!
! // register touch events
! ofRegisterTouchEvents(this);
!
! // initialize the accelerometer
! ofxAccelerometer.setup();
!
! //iPhoneAlerts will be sent to this.
! ofxiPhoneAlerts.addListener(this);
!
! //If you want a landscape oreintation
! //iPhoneSetOrientation(OFXIPHONE_ORIENTATION_LANDSCAPE_RIGHT);
!
! ofBackground(127,127,127);
}
//--------------------------------------------------------------
void testApp::update(){
}
//--------------------------------------------------------------
void testApp::draw(){
!
}
//--------------------------------------------------------------
void testApp::exit(){
}
testApp.mm

15. //--------------------------------------------------------------
void testApp::touchDown(ofTouchEventArgs &touch){
}
//--------------------------------------------------------------
void testApp::touchMoved(ofTouchEventArgs &touch){
}
//-------------------------------------------------------------- touch event
void testApp::touchUp(ofTouchEventArgs &touch){
}
//--------------------------------------------------------------
void testApp::touchDoubleTap(ofTouchEventArgs &touch){
}
//--------------------------------------------------------------
void testApp::lostFocus(){
}
//--------------------------------------------------------------
void testApp::gotFocus(){
} alert engine
//--------------------------------------------------------------
void testApp::gotMemoryWarning(){
}
//--------------------------------------------------------------
void testApp::deviceOrientationChanged(int newOrientation){
}
//--------------------------------------------------------------
void testApp::touchCancelled(ofTouchEventArgs& args){
} testApp.mm

16. How to start ?
1. create a copy of emptyExample in apps folder
2. rename the folder and .xcodeproj file
3. open the project
4. rename target
5. make sure it builds and runs

17. Let’s do it now.

18. audio audio
accelerometer graphic
touch
image
input output

19. audio input
setup()
initialBufferSize ! = 512;
sampleRate ! ! ! = 44100;
drawCounter! ! ! = 0;
bufferCounter!
! = 0;
!
buffer!! ! ! = new float[initialBufferSize];
memset(buffer, 0, initialBufferSize * sizeof(float));
!
ofSoundStreamSetup(0, 1, this, sampleRate, initialBufferSize, 4);
ofSetFrameRate(60);
// 0 output channels,
// 1 input channels
// 44100 samples per second
// 512 samples per buffer
// 4 num buffers (latency)
void testApp::audioIn(float * input, int bufferSize, int nChannels){
! if( initialBufferSize != bufferSize ){
! ! ofLog(OF_LOG_ERROR, "your buffer size was set to %i -
but the stream needs a buffer size of %i", initialBufferSize, bufferSize);
! ! return;
! }!
!
! // samples are "interleaved"
! for (int i = 0; i < bufferSize; i++){
! ! buffer[i] = input[i];
! }
}
testApp.mm

20. accelerometer
ofxAccelerometer.getForce().x
ofxAccelerometer.getForce().y
ofxAccelerometer.getForce().z
touch event
//--------------------------------------------------------------
void testApp::touchDown(ofTouchEventArgs &touch){
touch.x
} touch.y
//-------------------------------------------------------------- (0,0)
void testApp::touchMoved(ofTouchEventArgs &touch){
}
//--------------------------------------------------------------
void testApp::touchUp(ofTouchEventArgs &touch){
}
//--------------------------------------------------------------
void testApp::touchDoubleTap(ofTouchEventArgs &touch){
}

21. audio output
ofSoundPlayer bird_sound; declaration
bird_sound.loadSound("weeee.wav");
bird_sound.setVolume(1.0f); setup
bird_sound.setMultiPlay(false);
bird_sound.play(); play
draw image
ofImage head_img; declaration
head_img.loadImage("bird_cos.png");
setup
head_img.draw(x_pos, y_pos, width, height); play

22. graphics
- OpenGL (desktop)
- OpenGLES (iphone)
void testApp::draw()
{
ofFill(); 50
ofSetHexColor(0x3ABEE3);
ofCircle(100, 100, 50);
}
polygonExample

23. http://www.openframeworks.cc/documentation

24. sound
fun
interactive
game

25. Cos Bird: an interactive sound game

26. CosBird
quiet little noisy more noisy angry!

27. weeeeeeee

28. Live demo

29. Thanks very much.
http://twitter.com/janetyc
http://gplus.to/janetyc
janetyc@gmail.com