[아이폰 앱 개발] OpenGL ES for iPhone : Part 3 with Accelerometer control

OpenGL ES for iPhone : Part 3 with Accelerometer control

In this part 3, we will add the accelerometer control to move the position of ellipse object that we have created in part 2 of the Tutorial.



1) UIAccelerometerDelegate
We need to add the UIAccelerometerDelegate protocol to the EAGLView and implement the accelerometer: didAccelerate: method as below


@interface EAGLView : UIView <UIAccelerometerDelegate>

- (void)accelerometer:(UIAccelerometer*)accelerometer didAccelerate:(UIAcceleration*)acceleration


We need to configure and start the accelerometer in the setupView method

[[UIAccelerometer sharedAccelerometer] setUpdateInterval:(1.0 / kAccelerometerFrequency)];
[[UIAccelerometer sharedAccelerometer] setDelegate:self];


2) Accelerometer values
Inside the accelerometer: didAccelerate: method, we add a low-pass filter in the accelerometer values. This low-pass filter codes are sourced from the GLGravity Sample Code from Apple.

//Use a basic low-pass filter in the accelerometer values
accel[0] = acceleration.x * kFilteringFactor + accel[0] * (1.0 - kFilteringFactor);
accel[1] = acceleration.y * kFilteringFactor + accel[1] * (1.0 - kFilteringFactor);
accel[2] = acceleration.z * kFilteringFactor + accel[2] * (1.0 - kFilteringFactor);


The meaning of accelerometer values:

acceleration.x = Roll. It corresponds to roll, or rotation around the axis that runs from your home button to your earpiece. Values vary from 1.0 (rolled all the way to the right) to -1.0 (rolled all the way to the left).

acceleration.y = Pitch. Place your iPhone on the table and mentally draw a horizontal line about half-way down the screen. That's the axis around which the Y value rotates. Values go from 1.0 (the headphone jack straight down) to -1.0 (the headphone jack straight up).

acceleration.z = Face up/face down. It refers to whether your iPhone is face up (-1.0) or face down (1.0). When placed on it side, either the side with the volume controls and ringer switch, or the side directly opposite, the Z value equates to 0.0.

3) Control on movement of the ellipse is using the variables moveX and moveY and the ellipse position will be changed according to acceleration.x (that is accel[0]) and acceleration.y (that is accel[1]) values that passed from the Accelerometer control after the low-pass filter. The larger the absolute value of acceleration.x/acceleration.y, the greater for the magnitude for the value of moveX/moveY and thus the faster the ellipse will change its position to that direction. As the object should not move beyond the screen view, the ellipseData.pos.x and ellipseData.pos.y values will be governed by the boundaries of the screen.

 ellipseData.pos.x += moveX;
 if (accel[0] > -0.1 & accel[0] < 0.1 ) {
   moveX = 0.0f;
 }
 else {
  moveX = 10.0f * accel[0];
 }

 ellipseData.pos.y += moveY;
 if (accel[1] > -0.1 & accel[1] < 0.1 ) {
   moveY = 0.0f;
 }
 else {
   moveY = -10.0f * accel[1];
 }


4) Conditional compilation code for the iPhone Simulator and on-screen debug info
As iPhone Simulator does not have Accelerometer control, we have added the code that will change the ellipse position inside this compiler directive, so that the ellipse will keep moving on the iPhone Simulator.
  #if TARGET_IPHONE_SIMULATOR 

Moroever, we have added a UILabel to the code so that we can read the Accelerometer values while we debug the program on actual device. This UILabel can be disabled using this define directive.
  #undef DEBUGSCREEN

5) The source codes are here, you just need to create a new project from OpenGL ES Application template of XCode and copy the source codes of EAGLView.h and EAGLView.m from below and paste them for Build & Go in XCode. The accelerometer control can only be tested on actual device.



EAGLView.h Select all

// EAGLView.h
// OpenGL ES Tutorial - Part 3 by javacom


// To enable Debug NSLog, add GCC_PREPROCESSOR_DEFINITIONS DEBUGON in Project Settings for Debug Build Only and replace NSLog() with DEBUGLOG()
#ifdef DEBUGON
#define DEBUGLOG if (DEBUGON) NSLog
#else
#define DEBUGLOG
#endif

#define DEBUGSCREEN

#import <UIKit/UIKit.h>
#import <OpenGLES/EAGL.h>
#import <OpenGLES/ES1/gl.h>
#import <OpenGLES/ES1/glext.h>

typedef struct
{
BOOL rotstop; // stop self rotation
BOOL touchInside; // finger tap inside of the object ?
BOOL scalestart; // start to scale the obejct ?
CGPoint pos; // position of the object on the screen
CGPoint startTouchPosition; // Start Touch Position
CGPoint currentTouchPosition; // Current Touch Position
GLfloat pinchDistance; // distance between two fingers pinch
GLfloat pinchDistanceShown; // distance that have shown on screen
GLfloat scale; // OpenGL scale factor of the object
GLfloat rotation; // OpenGL rotation factor of the object
GLfloat rotspeed; // control rotation speed of the object
} ObjectData;

/*
This class wraps the CAEAGLLayer from CoreAnimation into a convenient UIView subclass.
The view content is basically an EAGL surface you render your OpenGL scene into.
Note that setting the view non-opaque will only work if the EAGL surface has an alpha channel.
*/
@interface EAGLView : UIView {

@private
/* The pixel dimensions of the backbuffer */
GLint backingWidth;
GLint backingHeight;

EAGLContext *context;

/* OpenGL names for the renderbuffer and framebuffers used to render to this view */
GLuint viewRenderbuffer, viewFramebuffer;

/* OpenGL name for the depth buffer that is attached to viewFramebuffer, if it exists (0 if it does not exist) */
GLuint depthRenderbuffer;

NSTimer *animationTimer;
NSTimeInterval animationInterval;

@public
ObjectData squareData;
ObjectData ellipseData;
GLfloat ellipseVertices[720];
CGFloat initialDistance;
UIAccelerationValue accel[3];
GLfloat moveX, moveY;
#ifdef DEBUGSCREEN
UILabel *textView;
#endif
}

@property NSTimeInterval animationInterval;

@property (nonatomic) ObjectData squareData;
@property (nonatomic) ObjectData ellipseData;
@property CGFloat initialDistance;
#ifdef DEBUGSCREEN
@property (nonatomic, assign) UILabel *textView;
#endif

- (void)startAnimation;
- (void)stopAnimation;
- (void)drawView;
- (void)setupView;

@end


EAGLView.m Select all

// EAGLView.m
// OpenGL ES Tutorial - Part 3 by javacom
//
#import <QuartzCore/QuartzCore.h>
#import <OpenGLES/EAGLDrawable.h>

#import "EAGLView.h"

#include <math.h>

// Macros
#define degreesToRadians(__ANGLE__) (M_PI * (__ANGLE__) / 180.0)
#define radiansToDegrees(__ANGLE__) (180.0 * (__ANGLE__) / M_PI)

CGFloat distanceBetweenPoints (CGPoint first, CGPoint second) {
CGFloat deltaX = second.x - first.x;
CGFloat deltaY = second.y - first.y;
return sqrt(deltaX*deltaX + deltaY*deltaY );
};

CGFloat angleBetweenPoints(CGPoint first, CGPoint second) {
// atan((top - bottom)/(right - left))
CGFloat rads = atan((second.y - first.y) / (first.x - second.x));
return radiansToDegrees(rads);
}

CGFloat angleBetweenLines(CGPoint line1Start, CGPoint line1End, CGPoint line2Start, CGPoint line2End) {

CGFloat a = line1End.x - line1Start.x;
CGFloat b = line1End.y - line1Start.y;
CGFloat c = line2End.x - line2Start.x;
CGFloat d = line2End.y - line2Start.y;

CGFloat rads = acos(((a*c) + (b*d)) / ((sqrt(a*a + b*b)) * (sqrt(c*c + d*d))));

return radiansToDegrees(rads);
}

#define USE_DEPTH_BUFFER 0

// CONSTANTS
#define kMinimumTouchLength 30
#define kMaximumScale 7.0f
#define kMinimumPinchDelta 15
#define kAccelerometerFrequency 100.0 // Hz
#define kFilteringFactor 0.1


// A class extension to declare private methods
@interface EAGLView ()

@property (nonatomic, retain) EAGLContext *context;
@property (nonatomic, assign) NSTimer *animationTimer;

- (BOOL) createFramebuffer;
- (void) destroyFramebuffer;

@end


@implementation EAGLView

@synthesize context;
@synthesize animationTimer;
@synthesize animationInterval;
@synthesize squareData;
@synthesize ellipseData;
@synthesize initialDistance;
#ifdef DEBUGSCREEN
@synthesize textView;
#endif

// You must implement this method
+ (Class)layerClass {
return [CAEAGLLayer class];
}


//The GL view is stored in the nib file. When it's unarchived it's sent -initWithCoder:
- (id)initWithCoder:(NSCoder*)coder {

if ((self = [super initWithCoder:coder])) {

// Get the layer
CAEAGLLayer *eaglLayer = (CAEAGLLayer *)self.layer;

eaglLayer.opaque = YES;
eaglLayer.drawableProperties = [NSDictionary dictionaryWithObjectsAndKeys:
[NSNumber numberWithBool:NO], kEAGLDrawablePropertyRetainedBacking, kEAGLColorFormatRGBA8, kEAGLDrawablePropertyColorFormat, nil];

context = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES1];

if (!context || ![EAGLContext setCurrentContext:context]) {
[self release];
return nil;
}

animationInterval = 1.0 / 60.0;
[self setupView];
}
return self;
}

// These are four methods touchesBegan, touchesMoved, touchesEnded, touchesCancelled and use to notify about touches and gestures

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
/*
NSUInteger numTaps = [[touches anyObject] tapCount]; // number of taps
NSUInteger numTouches = [touches count]; // number of touches
*/
UITouch *touch = [[touches allObjects] objectAtIndex:0];

DEBUGLOG(@"TouchBegan event counts = %d ",[[event touchesForView:self] count]);
DEBUGLOG(@"TouchBegan tounches counts = %d ",[touches count]);
if ([touches count]== 2) {
NSArray *twoTouches = [touches allObjects];
UITouch *first = [twoTouches objectAtIndex:0];
UITouch *second = [twoTouches objectAtIndex:1];
initialDistance = distanceBetweenPoints([first locationInView:self], [second locationInView:self]);
squareData.rotstop = YES;
squareData.touchInside = NO;
}
else if ([touches count]==[[event touchesForView:self] count] & [[event touchesForView:self] count] == 1) {
squareData.startTouchPosition = [touch locationInView:self];
if (distanceBetweenPoints([touch locationInView:self], squareData.pos) <= kMinimumTouchLength * squareData.scale) {
DEBUGLOG(@"Square Touch at %.2f, %.2f ",squareData.pos.x,squareData.pos.y);
squareData.rotstop = YES;
squareData.touchInside = YES;
}
}

}

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [[touches allObjects] objectAtIndex:0];
squareData.currentTouchPosition = [touch locationInView:self];
if ([touches count]== 2) {
NSArray *twoTouches = [touches allObjects];
UITouch *first = [twoTouches objectAtIndex:0];
UITouch *second = [twoTouches objectAtIndex:1];

// Calculate the distance bewtween the two fingers(touches) to determine the pinch distance
CGFloat currentDistance = distanceBetweenPoints([first locationInView:self], [second locationInView:self]);

squareData.rotstop = YES;
squareData.touchInside = NO;

if (initialDistance == 0.0f)
initialDistance = currentDistance;
if (currentDistance - initialDistance > kMinimumPinchDelta) {
squareData.pinchDistance = currentDistance - initialDistance;
squareData.scalestart = YES;
DEBUGLOG(@"Outward Pinch %.2f", squareData.pinchDistance);
}
else if (initialDistance - currentDistance > kMinimumPinchDelta) {
squareData.pinchDistance = currentDistance - initialDistance;
squareData.scalestart = YES;
DEBUGLOG(@"Inward Pinch %.2f", squareData.pinchDistance);
}
}
else if ([touches count]==[[event touchesForView:self] count] & [[event touchesForView:self] count] == 1) {
if (squareData.touchInside) {
// Only move the square to new position when touchBegan is inside the square
squareData.pos.x = [touch locationInView:self].x;
squareData.pos.y = [touch locationInView:self].y;
DEBUGLOG(@"Square Move to %.2f, %.2f ",squareData.pos.x,squareData.pos.y);
squareData.rotstop = YES;
}
}
}


- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
if ([touches count] == [[event touchesForView:self] count]) {
initialDistance = squareData.pinchDistanceShown = squareData.pinchDistance = 0.0f;
squareData.rotstop = squareData.touchInside = squareData.scalestart = NO;
DEBUGLOG(@"touchesEnded, all fingers up");
}
else {
initialDistance = squareData.pinchDistanceShown = squareData.pinchDistance = 0.0f;
squareData.scalestart = NO;
DEBUGLOG(@"touchesEnded");
}
}


- (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event {
initialDistance = squareData.pinchDistanceShown = squareData.pinchDistance = 0.0f;
squareData.rotstop = squareData.touchInside = squareData.scalestart = NO;
DEBUGLOG(@"touchesCancelled");
}

- (void)setupView { // new method for intialisation of variables and states

// Enable Multi Touch of the view
self.multipleTouchEnabled = YES;

//Configure and start accelerometer
[[UIAccelerometer sharedAccelerometer] setUpdateInterval:(1.0 / kAccelerometerFrequency)];
[[UIAccelerometer sharedAccelerometer] setDelegate:self];
#if TARGET_IPHONE_SIMULATOR
moveX = 2.0f;
moveY = 3.0f;
#else
moveX = 0.0f;
moveY = 0.0f;
#endif

#ifdef DEBUGSCREEN
UIColor *bgColor = [[UIColor alloc] initWithWhite:1.0f alpha:0.0f];
textView = [[UILabel alloc] initWithFrame:CGRectMake(10.0f, 350.0f, 300.0f, 96.0f)];
textView.text = [NSString stringWithFormat:@"-Accelerometer Data-"];
textView.textAlignment = UITextAlignmentLeft;
[textView setNumberOfLines:4];
textView.backgroundColor = bgColor;
textView.font = [UIFont fontWithName:@"Arial" size:18];
[self addSubview:textView];
[self bringSubviewToFront:textView];
#endif


// Initialise square data
squareData.rotation = squareData.pinchDistance = squareData.pinchDistanceShown = 0.0f;
ellipseData.rotation = 0.0f;
squareData.scale = 1.0f;
squareData.rotstop = squareData.touchInside = squareData.scalestart = NO;
squareData.pos.x = 160.0f;
squareData.pos.y = 240.0f;
squareData.pinchDistance = 0.0f;
squareData.rotspeed = 1.0f;

// Initialise ellipse data
ellipseData.rotation = 0.0f;
ellipseData.rotstop = ellipseData.touchInside = ellipseData.scalestart = NO;
ellipseData.pos.x = 160.0f;
ellipseData.pos.y = 100.0f;
ellipseData.rotspeed = -4.0f;

// calculate the vertices of ellipse
const GLfloat xradius = 35.0f;
const GLfloat yradius = 25.0f;
for (int i = 0; i < 720; i+=2) {
ellipseVertices[i] = (cos(degreesToRadians(i)) * xradius) + 0.0f;
ellipseVertices[i+1] = (sin(degreesToRadians(i)) * yradius) + 0.0f;
// DEBUGLOG(@"ellipseVertices[v%d] %.1f, %.1f",i, ellipseVertices[i], ellipseVertices[i+1]);
}

// setup the projection matrix
glMatrixMode(GL_PROJECTION);
glLoadIdentity();

// Setup Orthographic Projection for the 320 x 480 of the iPhone screen
glOrthof(0.0f, 320.0f, 480.0f, 0.0f, -1.0f, 1.0f);
glMatrixMode(GL_MODELVIEW);

}

- (void)drawView {

// Define the square vertices
const GLfloat squareVertices[] = {
-20.0f, -20.0f,
20.0f, -20.0f,
-20.0f, 20.0f,
20.0f, 20.0f,
};

// Define the colors of the square vertices
const GLubyte squareColors[] = {
255, 255, 0, 255,
0, 255, 255, 255,
0, 0, 0, 0,
255, 0, 255, 255,
};


// Define the colors of the ellipse vertices
const GLubyte ellipseColors[] = {
233, 85, 85, 255,
233, 85, 85, 255,
233, 85, 85, 255,
233, 85, 85, 255,
233, 85, 85, 255,
};


[EAGLContext setCurrentContext:context];
glBindFramebufferOES(GL_FRAMEBUFFER_OES, viewFramebuffer);
glViewport(0, 0, backingWidth, backingHeight);

// Clear background color
glClearColor(0.5f, 0.5f, 0.5f, 1.0f);
glClear(GL_COLOR_BUFFER_BIT);

// draw the square
glLoadIdentity();
glTranslatef(squareData.pos.x, squareData.pos.y, 0.0f);
glRotatef(squareData.rotation, 0.0f, 0.0f, 1.0f);
glScalef(squareData.scale, squareData.scale, 1.0f);
glVertexPointer(2, GL_FLOAT, 0, squareVertices);
glColorPointer(4, GL_UNSIGNED_BYTE, 0, squareColors);
glEnableClientState(GL_VERTEX_ARRAY);
glEnableClientState(GL_COLOR_ARRAY);
glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

// draw the ellipse
glLoadIdentity();
glTranslatef(ellipseData.pos.x, ellipseData.pos.y, 0.0f);
glRotatef(ellipseData.rotation, 0.0f, 0.0f, 1.0f);
glVertexPointer(2, GL_FLOAT, 0, ellipseVertices);
glColorPointer(4, GL_UNSIGNED_BYTE, 0, ellipseColors);
glEnableClientState(GL_VERTEX_ARRAY);
glEnableClientState(GL_COLOR_ARRAY);
glDrawArrays(GL_TRIANGLE_FAN, 0, 360); // the ellipse has 360 vertices

// control the square rotation
if (!squareData.rotstop) {
squareData.rotation += squareData.rotspeed;
if(squareData.rotation > 360.0f)
squareData.rotation -= 360.0f;
else if(squareData.rotation < -360.0f)
squareData.rotation += 360.0f;
}

// control the ellipse rotation
if (!ellipseData.rotstop) {
ellipseData.rotation += ellipseData.rotspeed;
if(ellipseData.rotation > 360.0f)
ellipseData.rotation -= 360.0f;
else if(ellipseData.rotation < -360.0f)
ellipseData.rotation += 360.0f;
}

// control the square scaling
if (squareData.scalestart && squareData.scale <= kMaximumScale) {
GLfloat pinchDelta = squareData.pinchDistance - squareData.pinchDistanceShown;
if (squareData.pinchDistance != 0.0f) {
squareData.scale += pinchDelta/30;
squareData.pinchDistanceShown = squareData.pinchDistance;
if (squareData.scale >= kMaximumScale) {
squareData.scale = kMaximumScale;
squareData.pinchDistanceShown = squareData.pinchDistance = 0.0f;
squareData.scalestart = NO;
} else if (squareData.scale <= 1.0f) {
squareData.scale = 1.0f;
squareData.pinchDistanceShown = squareData.pinchDistance = 0.0f;
squareData.scalestart = NO;
}
DEBUGLOG(@"scale is %.2f",squareData.scale);
}
}

// control the ellipse movement
#if TARGET_IPHONE_SIMULATOR
ellipseData.pos.x += moveX;
if (ellipseData.pos.x >= 290.f) {
moveX = -2.0f;
}
else if (ellipseData.pos.x <= 30.f) {
moveX = 2.0f;
}

ellipseData.pos.y += moveY;
if (ellipseData.pos.y >= 450.f) {
moveY = -1.5f;
}
else if (ellipseData.pos.y <= 55.f) {
moveY = 3.5f;
}
#else
ellipseData.pos.x += moveX;
if (accel[0] > -0.1 & accel[0] < 0.1 ) {
moveX = 0.0f;
}
else {
moveX = 10.0f * accel[0];
}

ellipseData.pos.y += moveY;
if (accel[1] > -0.1 & accel[1] < 0.1 ) {
moveY = 0.0f;
}
else {
moveY = -10.0f * accel[1];
}
#endif
if (ellipseData.pos.x >= 290.f) {
ellipseData.pos.x = 290.0f;
}
else if (ellipseData.pos.x <= 30.f) {
ellipseData.pos.x = 30.0f;
}
if (ellipseData.pos.y >= 450.f) {
ellipseData.pos.y = 450.0f;
}
else if (ellipseData.pos.y <= 55.f) {
ellipseData.pos.y = 55.0f;
}


glBindRenderbufferOES(GL_RENDERBUFFER_OES, viewRenderbuffer);
[context presentRenderbuffer:GL_RENDERBUFFER_OES];
}

- (void)accelerometer:(UIAccelerometer*)accelerometer didAccelerate:(UIAcceleration*)acceleration
{
/*
The meaning of acceleration values for firmware 2.x
acceleration.x = Roll. It corresponds to roll, or rotation around the axis that runs from your home button to your earpiece.
Values vary from 1.0 (rolled all the way to the right) to -1.0 (rolled all the way to the left).

acceleration.y = Pitch. Place your iPhone on the table and mentally draw a horizontal line about half-way down the screen.
That's the axis around which the Y value rotates.
Values go from 1.0 (the headphone jack straight down) to -1.0 (the headphone jack straight up).

acceleration.z = Face up/face down.
It refers to whether your iPhone is face up (-1.0) or face down (1.0).
When placed on it side, either the side with the volume controls and ringer switch, or the side directly opposite
, the Z value equates to 0.0.
*/

//Use a basic low-pass filter in the accelerometer values
accel[0] = acceleration.x * kFilteringFactor + accel[0] * (1.0 - kFilteringFactor);
accel[1] = acceleration.y * kFilteringFactor + accel[1] * (1.0 - kFilteringFactor);
accel[2] = acceleration.z * kFilteringFactor + accel[2] * (1.0 - kFilteringFactor);

#ifdef DEBUGSCREEN
textView.text = [NSString stringWithFormat:
@"X (roll, %4.1f%%): %f\nY (pitch %4.1f%%): %f\nZ (%4.1f%%) : %f",
100.0 - (accel[0] + 1.0) * 50.0, accel[0],
100.0 - (accel[1] + 1.0) * 50.0, accel[1],
100.0 - (accel[2] + 1.0) * 50.0, accel[2]
];
#endif
}

- (void)layoutSubviews {
[EAGLContext setCurrentContext:context];
[self destroyFramebuffer];
[self createFramebuffer];
[self drawView];
}


- (BOOL)createFramebuffer {

glGenFramebuffersOES(1, &viewFramebuffer);
glGenRenderbuffersOES(1, &viewRenderbuffer);

glBindFramebufferOES(GL_FRAMEBUFFER_OES, viewFramebuffer);
glBindRenderbufferOES(GL_RENDERBUFFER_OES, viewRenderbuffer);
[context renderbufferStorage:GL_RENDERBUFFER_OES fromDrawable:(CAEAGLLayer*)self.layer];
glFramebufferRenderbufferOES(GL_FRAMEBUFFER_OES, GL_COLOR_ATTACHMENT0_OES, GL_RENDERBUFFER_OES, viewRenderbuffer);

glGetRenderbufferParameterivOES(GL_RENDERBUFFER_OES, GL_RENDERBUFFER_WIDTH_OES, &backingWidth);
glGetRenderbufferParameterivOES(GL_RENDERBUFFER_OES, GL_RENDERBUFFER_HEIGHT_OES, &backingHeight);

if (USE_DEPTH_BUFFER) {
glGenRenderbuffersOES(1, &depthRenderbuffer);
glBindRenderbufferOES(GL_RENDERBUFFER_OES, depthRenderbuffer);
glRenderbufferStorageOES(GL_RENDERBUFFER_OES, GL_DEPTH_COMPONENT16_OES, backingWidth, backingHeight);
glFramebufferRenderbufferOES(GL_FRAMEBUFFER_OES, GL_DEPTH_ATTACHMENT_OES, GL_RENDERBUFFER_OES, depthRenderbuffer);
}

if(glCheckFramebufferStatusOES(GL_FRAMEBUFFER_OES) != GL_FRAMEBUFFER_COMPLETE_OES) {
DEBUGLOG(@"failed to make complete framebuffer object %x", glCheckFramebufferStatusOES(GL_FRAMEBUFFER_OES));
return NO;
}

return YES;
}


- (void)destroyFramebuffer {

glDeleteFramebuffersOES(1, &viewFramebuffer);
viewFramebuffer = 0;
glDeleteRenderbuffersOES(1, &viewRenderbuffer);
viewRenderbuffer = 0;

if(depthRenderbuffer) {
glDeleteRenderbuffersOES(1, &depthRenderbuffer);
depthRenderbuffer = 0;
}
}


- (void)startAnimation {
self.animationTimer = [NSTimer scheduledTimerWithTimeInterval:animationInterval target:self selector:@selector(drawView) userInfo:nil repeats:YES];
}


- (void)stopAnimation {
self.animationTimer = nil;
}


- (void)setAnimationTimer:(NSTimer *)newTimer {
[animationTimer invalidate];
animationTimer = newTimer;
}


- (void)setAnimationInterval:(NSTimeInterval)interval {

animationInterval = interval;
if (animationTimer) {
[self stopAnimation];
[self startAnimation];
}
}


- (void)dealloc {

[self stopAnimation];

if ([EAGLContext currentContext] == context) {
[EAGLContext setCurrentContext:nil];
}

[context release];
[super dealloc];
}

@end

.http://iphonesdkdev.blogspot.com/2009/04/opengl-es-for-iphone-part-3-with.html
.
Posted by 오늘마감
[MammothHunting] - Cocos2D를 사용한 아이폰 게임 개발 튜토리얼 3

출처 : http://lambert.tistory.com/293

충돌 검사
이전 포스트까지의 내용대로 개발된 게임은 아무리 총알을 발사해도 타겟을 통과할 뿐이다. 이 문제를 해결하기 위해 충돌 검사라는 것이 필요하다.

케익에 맞은 맘모스는 게임 화면에서 사라져와 한다. 물론 잘 만들어진 게임이라면 총알 맞는 효과 같은 것들이 부수적으로 필요할 것이다. 

그러나 간단한 게임 예제라는 전제로 이런 부분들은 배제하고 간단히 총알과 타겟이 만났을 경우만 처리하는 코드를 작성할 것이다. 게임 물리의 거리, 운동 등의 다양한 면을 담당하는 게임 엔진의 한 부분인 물리 엔진은 사용되지 않는다.

먼저 다음 코드를 MammothHuntingScene.h에 추가하자.

NSMutableArray *_targets;

NSMutableArray *_projectiles;


그리고 MammothHuntingScene.m의 init 메소드의 self.isTouchEnabled = YES; 아래에 다음 코드를 추가한다.

_targets = [[NSMutableArrayalloc] init];

_projectiles = [[NSMutableArrayalloc] init];


마지막으로 메모리 관리를 위해 MammothHuntingScene.m의 dealloc 메소드에 다음 코드를 추가한다.

[_targetsrelease];

_targets = nil;

[_projectilesrelease];

_projectiles = nil;


이제 addTarget 메소드르 수정할 차례이다. 위에서 선언한 _targets 배열에 새로운 target를 추가하는 것이다. 제일 아랫 부분에 다음처럼 추가하자. 새로 설정한 tag는 나중에 사용될 것이다.

target.tag = 1;

[_targets addObject:target];


그리고 ccTouchesEnded 메소드 역시 _projectiles 배열에 새로운 projectile을 추가하게 끔 다음 코드를 메소드 마지막에 추가한다. 새로 설정한 tag는 나중에 사용될 것이다.

projectile.tag = 2;

[_projectiles addObject:projectile];


마지막으로 spriteMoveFinished 메소드에 위에서 설정한 tag를 기반으로 스프라이트를 삭제하는 코드를 추가한다.

if (sprite.tag == 1) { // 타겟.

[_targets removeObject:sprite];

} else if (sprite.tag == 2) { // 총알.

[_projectiles removeObject:sprite];

}


빌드앤런 해보자. 그런데 이전과 마찬가지로 실제 사냥이 되지는 않을 것이다. 당연하다. 충돌 검사 코드가 아직 작성되지 않았다. 다음 update: 메소드를 MammothHuntingScene.m에 추가해야 한다.

- (void)update:(ccTime)dt {

NSMutableArray *projectilesToDelete = [[NSMutableArrayalloc] init];

for (CCSprite *projectile in _projectiles) {

CGRect projectileRect = CGRectMake(

  projectile.position.x - (projectile.contentSize.width/2), 

  projectile.position.y - (projectile.contentSize.height/2), 

  projectile.contentSize.width

  projectile.contentSize.height);

NSMutableArray *targetsToDelete = [[NSMutableArrayalloc] init];

for (CCSprite *target in _targets) {

CGRect targetRect = CGRectMake(

  target.position.x - (target.contentSize.width/2), 

  target.position.y - (target.contentSize.height/2), 

  target.contentSize.width

  target.contentSize.height);

if (CGRectIntersectsRect(projectileRect, targetRect)) {

[targetsToDelete addObject:target];

}

}

for (CCSprite *target in targetsToDelete) {

[_targets removeObject:target];

[self removeChild:target cleanup:YES];

}

if (targetsToDelete.count > 0) {

[projectilesToDelete addObject:projectile];

}

[targetsToDelete release];

}

for (CCSprite *projectile in projectilesToDelete) {

[_projectiles removeObject:projectile];

[self removeChild:projectile cleanup:YES];

}

[projectilesToDelete release];

}


update: 메소드는 루프를 돌면서 총알과 타겟이 교차하는 지  CGRectIntersectsRect를 통해 검사한다. 만약 교차한다면 화면과 배열에서 제거해 버린다. 
여기서 한 가지 주의할 것이 있다. 충돌 검사 루프를 하는 동안은 배열의 객체를 삭제할 수 없으므로 제거 대상을 배열에 넣었다가 삭제한다.

정말 마지막으로 다음의 코드를 init 메소드 하단에 추가하고 빌드앤런하자. 이제 맘모스를 사냥할 수 있을 것이다.

[selfschedule:@selector(update:)];


서두에 간단히 물리 엔진에 대해서 이야기 했던 것처럼, 간단한 그래픽 기반 게임 조차 어느 정도 물리 코드가 필요하다. 이 말은 충돌 검사의 다양한 방법이 있다는 것이다. 다음 기회에 Cocos2D의 물리 엔진인 Box2d와 Chipmunk를 공부할 항목에 추가해야 겠다.


출처 : http://blog.naver.com/PostView.nhn?blogId=cbdman&logNo=130085022575
Posted by 오늘마감
XCODE2010.06.21 09:28
[펌] Xcode 3 둘러보기(1) - Xcode
출처 - http://www.cocoadev.co.kr/166






Xcode 3.1을 제가 사용해 보면서 눈에 뛰는 점들만 알아 보겠습니다. 사용 경험이 없어 틀린 내용이나 중요하지만 언급하지 않은 내용들이 많이 있을 수 있습니다. 틀린 내용들은 알려 주시면 수정하겠습니다.

제목 그대로 깊이 없고 두서 없는 '둘러보기'식 내용이니, 정확하고 체계적인 내용은 애플에서 제공하는 아래의 문서들을 확인해 보시기 바랍니다.



1. 인트로(Welcome) 화면
Xcode 시작시에 인트로 화면이 추가되었습니다. 보통 어플리케이션 사용시에 이런 Welcome이나 오늘의 팁 같은 기능들은 잘 사용하지 않습니다. 하지만 Xcode에서는 RSS로 새로운 소식들도 보여주고, 순간 관심이 가는 링크들을 클릭해서 내용도 읽어 보기 위해서 하단의 'Show at launch'를 체크해 놓고 시작할 때 마다 한번씩 새로운 소식들을 확인해 볼 수 있습니다. 화면은 아래와 같이 다섯개의 색션으로 되어 있습니다.
var servicePath="http://www.cocoadev.co.kr"; var blogURL="http://www.cocoadev.co.kr/";function TTGallery(containerId) { this.containerId = containerId; this.container = document.getElementById(this.containerId); this.container.style.filter = "progid:DXImageTransform.Microsoft.Fade(duration=0.3, overlap=1.0)"; this.container.style.textAlign = "center"; this.container.style.width = "100%"; this.container.instance = this; this.numImages = 0; this.imageLoaded = 0; this.offset = 0; this.src = new Array(); this.caption = new Array(); this.width = new Array(); this.height = new Array(); this.imageCache = new Array(); this.container = null; }; TTGallery.prototype.appendImage = function(src, caption, width, height) { this.numImages++; var imageCache = new Image(); imageCache.src = src; // imageCache.onload = function() { var tmp = this.src; }; this.imageCache[this.imageCache.length] = src; this.src[this.src.length] = src; this.width[this.width.length] = width; this.height[this.height.length] = height; this.caption[this.caption.length] = caption; }; TTGallery.prototype.getControl = function() { var control = document.createElement("div"); control.style.marginBottom = "10px"; control.className = "galleryControl"; control.style.color = "#777"; control.style.font = "bold 0.9em Verdana, Sans-serif"; control.innerHTML = '(' + (this.offset + 1) + '/' + this.numImages + ') '; return control; }; TTGallery.prototype.getImage = function() { var image = document.createElement("img"); image.instance = this; image.src = this.src[this.offset]; image.width = this.width[this.offset]; image.height = this.height[this.offset]; image.onclick = this.showImagePopup2; image.style.cursor = "pointer"; return image; }; TTGallery.prototype.getCaption = function() { var captionText = this.caption[this.offset]; captionText = captionText.replace(new RegExp("&?", "gi"), "&"); captionText = captionText.replace(new RegExp("<?", "gi"), "<"); captiontext = captiontext.replace(new regexp(">?", "gi"), ">"); captionText = captionText.replace(new RegExp(""?", "gi"), "\""); captionText = captionText.replace(new RegExp("'?", "gi"), "'"); var caption = document.createElement("div"); caption.style.textAlign = "center"; caption.style.marginTop = "8px"; caption.style.color = "#627e89"; caption.className = "galleryCaption"; caption.appendChild(document.createTextNode(captionText)); return caption; }; TTGallery.prototype.show = function(offset) { this.container = document.getElementById(this.containerId); if(this.numImages == 0) { var div = document.createElement("div"); div.style.textAlign = "center"; div.style.color = "#888"; div.style.margin = "10px auto"; div.style.font = "bold 2em/1 Verdana, Sans-serif"; div.innerHTML = ''; this.container.appendChild(div); this.container = null; return; } if(typeof offset == "undefined") this.offset = 0; else { if(offset <0) this.offset = this.numimages -1; else if(offset>= this.numImages) this.offset = 0; else this.offset = offset; } if(this.container.filters) this.container.filters[0].Apply(); this.container.innerHTML = ""; this.container.appendChild(this.getControl()); this.container.appendChild(this.getImage()); this.container.appendChild(this.getCaption()); if(this.container.filters) this.container.filters[0].Play(); this.container = null; }; TTGallery.prototype.prev = function() { this.show(this.offset-1); }; TTGallery.prototype.next = function() { this.show(this.offset+1); }; TTGallery.prototype.showImagePopup1 = function() { this.showImagePopup(); }; TTGallery.prototype.showImagePopup2 = function() { this.instance.showImagePopup(); }; TTGallery.prototype.showImagePopup = function(offset) { try { open_img(this.src[this.offset]); } catch(e) { window.open(this.src[this.offset]); } }; //
1) Getting Started
  • Create your first Cocoa application
  • Build your user interface
  • Store your application data
  • Optimize your application

위와 같이 4개의 내용으로 구성되어 있으며 각 제목을 클릭하면 해당 도움말이 열립니다. Xcode 3을 처음 실행하는 분들은 한번씩 읽어 볼만한 내용들입니다. Xcode는 소개화면에서 다섯개의 색션중 최종적으로 선택한 색션을 기억하고 있습니다. 'Getting Started'는 한번정도 볼만한 내용이므로 RSS 색션을 선택해 놓고 종료하면 다시 실행될 때 RSS 색션으로 열립니다.

2) iPhone Dev Center
아이폰 개발과 관련된 Video, Sample Code, Reference Library에 대한 링크로 구성되어 있습니다. 클릭하면 ADC의 해당 문서가 웹브라우져에서 열립니다. 모바일에서의 개발이 맥에서 개발보다 앞에 위치 있다는 것은 애플이 iPhone에 많은 기대를 가지고 있다는 것을 보여 주는 것 같습니다. 개발자도 iPhone 개발자들이 더 많은지는 잘 모르겠습니다.

3) Mac Dev Center
내용은 위와 동일하며 OS X에서 개발에 관련된 Video, Sample Code, Reference Library에 대한 링크로 구성되어 있습니다.

4) Xcode News [RSS]
맥 개발과 관련된 최신 뉴스를 확인할 수 있습니다. 하단의 Mac OS X, Mac OS X server, Core Foundation, Quicktime, Internet & Web, Games, Graphics & Imaging, Networking 링크를 클릭하면 해당 색션의 RSS를 등록할 수 있습니다. 애플에서 제공하는 개발 관련 RSS 목록은 'More RSS feeds...'를 클릭하거나 개발자 RSS Feeds 페이지에 서 확인할 수 있습니다.

5) Mailling Lists
맥 개발과 관련된 메일링 리스트들입니다. 뉴스와 마찬가지로 RSS로 등록하여 확인할 수 있습니다. 애플과 관련된 전체 메일링 리스트들은 'More...'를 클릭하거나 Apple Mailing Lists 페이지에서 확인할 수 있습니다.

6) Tips
Xcode 사용에 관련된 팁들이 있습니다. 주로 Xcode 3에서 추가된 기능들에 관한 설명들이 있으며, 아쉽지만 내용이 다시 실행될 때 마다 변경되지는 않는 것 같습니다. 버젼업 때마다 변경되는 것인지 일정 기간을 두고 변경되는지도 모르겠습니다.


2. New Project
가장 먼저 New Project를 실행해 보았습니다. UI를 제외하고는 이전과 비슷해 보입니다.
iPhoneSDK 를 설치하였기 때문에 템플릿중에 iPhone OS 항목이 있습니다. 이외에 MAC OS X의 Application항목에서 Cocoa-Python과 Cocoa-Ruby에 관련된 템플릿들이 많이 추가되었습니다.



3. 에디터
'TestXcode3' 로 새로운 Cocoa Application 프로젝트를 생성하였습니다. 겉으로 단순히 보기에는 Xcode 2.5와 큰 차이점이 보이지 않습니다.
이 프로젝트에서는 텍스트 필드에 입력 받은 내용을 버튼을 클릭하면 라벨에 출력하는 간단한 어플리케이션을 만들어 볼려고 합니다. 먼저 AppController 클래스를 생성하였습니다.

1) 자동완성/제안 기능 향상
IB까지 입력하면 IBAction과 같이 출력 됩니다. 여기서 엔터를 입력하면 자동으로 IBAction이 입력됩니다. IBO까지 입력하면 좌측과 같이 IBOutlet이 출력되며 이상태에서 엔터를 입력하면 IBOutlet으로 완성됩니다. 프레임워크 와 사용자가 정의한 변수, 함수, 상수등의 모든 입력에서 적용됩니다.

메소드에서도 인자의 정보를 알 수 있어 편리합니다. 얼마 사용하지 않았지만 일반적으로 팝업을 뛰우는 방식과 비교해서 매우 빠르고 편리한 것 같습니다.
 
2) 블럭
* Focus ribbon

또 하나 재미있는 기능은 구역별로 범위를 확인하거나 감출 수 있다는 것입니다. 이런 기능을 가진 툴들은 보았지만 시각적인 효과에 있어서는  Xcode가 가장 인상적인 것 같습니다.

새로 추가된 좌측의 회색 바(Focus ribbon)를 보면 내부로 구역이 중첩될 수록 진하게 표시됩니다. 저 범위에 마우스를 가져가면 범위를 확인하거나 출력되는 삼각형 모양의 아이콘을 클릭하여 해당 범위를 감출 수 있습니다.


* Code folding
가장 바깥쪽의 @implementation 구역에 마우스 커서를 가져가면 좌측과 같이 해당 구역만 하이라이트되어서 보여집니다.

상하 로 삼각형 모양의 아이콘이 범위의 시작과 끝을 알려 줍니다. 이 아이콘을 클릭하면 아래와 같이 @implementsion 내의 내용이 생략되어 보여집니다.






[''']가 구역내의 내용이 생략되었다는 표시입니다. 좌측의 삼각형을 클릭하면 다시 위와 같이 펼쳐집니다.

아래의 이미지들을 확대해서 위의 이미지와 비교해서 보시면 이 기능과 화면효과에 대해서 짐작이 가실 것입니다.

또하나 입력시에 (), [], {}가 끝나는 부분에서 대응되는 시작위치를 알려 주는 기능이 좀 더 시각적으로 변경되었습니다.

4) Message bubbles
이제 빌드를 해보겠습니다. 아래가 빌드 후에 결과 화면입니다.


오류와 경고 메시지가 아주 이쁜(?) 모양으로 강조되어 출력됩니다. 첫번째 오류는 k++ 다음에 ';'를 생략해서이고, 그 아래의 경고는 헤더 파일에서 setLabelText의 선언을 구현과 다르게 해놓았기 때문에 출력되었습니다. 물론 이전과 같이 별도의 결과창도 존재합니다.

5) 스냅샷
스냅샷은 소스내의 변경사항을 간편하게 저장하고 복구할 수 있는 간편한 방법입니다. 소스를 변경하고 Control+Command+s 또는 메뉴에서 File/Make Snapshot을 클릭하면 현재의 상태가 저장됩니다.

#import <Cocoa/Cocoa.h>

@interface AppController : NSObject {
    IBOutlet NSTextField *inputText;
}

@end

AppController.h 에서 위의 상태에서 스냅샷을 설정하고 다시 "- (IBAction)setLabelText:(id)sender;" 선언을 추가한 후에 다시 스냅샷을 설정합니다. 이제 File메뉴 밑의 Snapshot을 실행합니다.
위 와 같이 처음 설정한 곳과 다음 설정한 곳의 차이점을 diff와 같이 보여 줍니다. 툴바의 'Restore' 버튼을 클릭하면 이전 상태로 복구됩니다. 이와 같이 CVS나 SVN을 사용하지 않는 혼자서 진행하는 간단한 프로젝트에 사용하거나 저장소와 병행하여 간편하게 사용할 수 있습니다.

6) 리펙토링
클 래스나 변수, 함수의 이름을 변경하고 슈퍼클래스를 생성하고 메소드를 상위 클래스 또는 하위 클래스로 이동하는 작업을 편리하게 관리할 수 있습니다. 변경된 사항은 관련된 소스와 파일에 자동으로 반영됩니다.

사용방법은 변경할 아이템을 선택한 후에 Shift + command + j 또는 메뉴의 Edit에서 Refactor...를 선택하면 실행됩니다. 

* Rename
AppController 클래스의 이름을 변경해 보겠습니다. 선택사항을 확인한 후에 입력창에 변경될 이름을 입력합니다. Snapshot에 체크를 하면 변경된 내역이 스냅샷에 저장이 됩니다. 저는 아래와 같이 'MyAppController'로 입력하였습니다. 변경될 이름을 입력했으면 [Preview] 버튼을 클릭합니다.
하 단에 변경될 파일들과 항목의 수를 알려 줍니다.
파 일의 클릭하면 해당 파일에서 변경될 내역들을 이전 내용과 비교하여 확인할 수 있습니다. 이상이 없으면 Apply 버튼을 클릭하여 적용합니다.
Xcode 에서 파일이름이 'MyAppController.*'로 변경되고 각 소스에 해당 내용이 변경되었음을 확인할 수 있습니다.


* Extract
선 택된 내용을 새로 메소드나 함수를 생성하여 추가하여 줍니다. 'abc = newValue;'에 적용하면 아래와 같이 소스 코드가 변경됩니다. (사용방법은 Rename과 거의 유사하기 때문에 생략합니다)

변경 전
- (void) setAbc: (int) newValue {
  abc = newValue;
}

 Extract 적용 후
- (void) extracted_method: (int) newValue  {
  abc = newValue;

}
- (void) setAbc: (int) newValue {
  [self extracted_method: newValue];
}

* Encapsulate
클래스 맴버 변수의 setter/getter를 자동으로 생성하여 줍니다. 'int abc;'로 멤버변수를 만들고 Encapsulate를 실행하면 헤더파일과 소스파일에 아래의 내용이 자동으로 추가됩니다.

*.h
- (int) abc;
- (void) setAbc: (int) newValue;

*.m
- (int) abc {
  return abc;
}

- (void) setAbc: (int) newValue {
  abc = newValue;
}

* Create Superclass
해 당 클래스의 슈퍼클래스를 생성합니다.

* Move Up
선택된 변수와 메소드를 상위 클래스로 이동합니다.

* Move Down
선 택된 변수와 메소드를 하위 클래스로 이동합니다.

* Modernize Loop
아래와 같이 반복문에 적용하면 Objective-C 2.0에 추가된 문법으로 변경하여 줍니다.
while ((item = [enumerator nextObject]) != nil) => while (item in itemArray)

Xcode 3에서 코딩은 아직 해보지 못했지만 몇 번 실행은 시켜 보았습니다. 인터페이스 빌더만 조금 변경된 것 같고 Xcode는 Objective-C 2.0외에는 그다지 변경된 내용이 없는 줄 았았습니다. 하지만 잠시 사용해 보았지만 구석구석 편리한 기능들이 많이 추가되고 개선된 것 같습니다. 다른 개발툴에도 있는 기능들이지만 사용하기 편리하고 보기 좋게 잘 만들어 놓은 것 같습니다.

용 어도 잘 모르겠고 제 손에 걸린 것들만 언급을 해서 내용이 매우 부실하니, 시작시에 언급한 문서들에서 확인하시기 바랍니다. 몇 달 더 사용해 보고 '둘러보기'가 아닌 제목으로 다시 한번 포스팅 해보겠습니다.




출처 : http://blog.naver.com/PostView.nhn?blogId=seogi1004&logNo=110085699985
Posted by 오늘마감
XCODE2010.06.21 09:28
[펌] Xcode 3 둘러보기(2) - Interface Builder
출처 - http://www.cocoadev.co.kr/168




이번 포스팅에서는 인터페이스 빌더 3.1을 둘러 보겠습니다. 역시나 이전 Xcode 둘러보기와 같이 두서없고 깊이 없이 둘러만 보겠습니다.



1. XIB 파일
처음 Xcoe3.1을 실행하고 당황스러운 부분은 더블클릭해서 인터페이스 빌더를 실행해야 할 nib 파일이 없어졌다는 것입니다.

그대신 Resources 그룹을 보면 MainMenu.xib가 새로 추가되어 있습니다. 이 MainMenu.xib를 더블클릭 하면 이전과 같이 인터페이스 빌더가 실행됩니다.


아래는 텍스트 에디터에서 열어본 *.xib 파일의 내용입니다.


요즘 많은 툴들에서 사용하는 XML 포맷으로 되어 있지만, 애플에서는 절대 직접 수정하지 말라고 권하고 있습니다. xib 파일은 기본 3,305 라인이기 때문에 그다지 수정할 생각은 들지 않습니다. xib 파일은 아마 윈도우의 rc 파일의 역활을 하는 것 같습니다.

nib 파일은 Xcode에서는 찾을 수 없지만(하위 호환을 위해서 NIB Files 그룹이 존재 하는 것 같습니다) 빌드 후에는 패키지내에 포함됩니다.


2. XIB 윈도우
2.5 버젼과는 달리 Instance, Classes, Images, Sounds, Nib등의 탭이 없어지고, 이전의 Instance에 해당되는 부분만 있습니다. Application과 Font Manager가 추가되었습니다.


3. 라이브러리 윈도우

이 전의 팔레트가 라이브러리 윈도우로 변경되었습니다. 이제 UI 컨트롤, 인스턴스를 추가하는 작업에 라이브러리 윈도우를 사용합니다. 이전과 같이 NIB 윈도우에서 Classes 탭을 이용하여 subclass를 추가할 수는 없는 것 같습니다. 하지만 인스턴스를 클래스(파일)로 만드는 것은 여전히 가능합니다. 아래가 라이브러리 윈도우 입니다.


Cocoa 어플리케이션에서 사용하는 오브젝트와 컨트롤들은 Cocoa 그룹 하단에 다시 세부로 분류되어 잘 정리 되어 있습니다. 지금은 용도를 알수 없는 아이템들이 많고 이전과 비교하여 추가된 부분이 많기 되었기 때문에 기회가 되면 따로 각 아이템의 용도를 공부한 후에 설명해야 될 것 같습니다.

아직 각 아이템들의 명칭을 잘 몰라서 라이브러리 윈도우에서 우클릭을 하면 나오는 보기 옵션에서 'View Icons And Lables'를 선택하여 이름도 같이 볼 수 있도록 선택해 놓았습니다.


4. AppController 인스턴스 생성
우선 AppController 인스턴스와 클래스 파일을 만들어 보겠습니다. 라이브러리 윈도우에서 Cocoa/Objecrts & Controllers(/Controllers) 에서 Object 아이템을 드래그해서 아래와 같이 xib 도큐멘트 윈도우로 가져다 놓습니다.
새로 만들어진 Object가 선택된 상태에서 Shift+Command+i를 클릭하여 인스펙트 윈도우를 오픈합니다. 아래와 같이 Identity 항목을 선택한 다음 Class에 AppController를 입력합니다. 그리고 Action과 Outlet 하단의 [+] 버튼을 클릭하여 아래와 같이 changeTextLabel과 textLabel, userInput을 각각 추가하였습니다.



5. Outlet, Action 연결
라 이브러리 윈도우에서 Label, TextField, Push Button을 윈도우로 드래그 해서 아래와 같이 배치하였습니다.
연결은 오브젝트를 컨트롤 키와 함께 클릭하여 연결될 오브젝트로 드래그 하는 이전과 동일한 방법도 가능합니다. 이전과 다른 점은 인스펙터의 연결창이 오픈되는 것이 아니라 아래와 같이 연결될 Action 또는 Outlet의 목록만 출력됩니다.

인 터페이스 빌더 3에서는 더욱 편리한 방법이 있습니다. xib 도큐먼트 윈도우에서 AppController에 마우스 우클릭을 하면 아래와 같이 연결 판넬이 오픈됩니다.


textLabel의 우측에 원모양의 아이콘을 드래그 하여 Label에 연결합니다. 동일한 방법으로 userInput을 텍스트필드에 연결하고 Received Action의 changeTextLabel을 Set 버튼에 연결합니다.
  

모두 연결된 모습입니다. 해당 항목 앞의 x 아이콘을 클릭하면 연결이 삭제됩니다.

인스펙트 윈도우의 연결 항목에서도 현재 상태를 확인할 수 있습니다. 또한 이곳에서도 해당 아이템 우측의 원모양 아이콘을 드래그하여 해당 오브젝트와 연결 또는 x를 클릭하여 삭제 할 수 있습니다.


6. 소스코드와 연결
1) 클래스 파일 생성
이제 AppController 인스턴스의 클래스 파일을 만들어 보겠습니다. AppController 인스턴스를 선택한 상태에서 인터페이스 빌더 메뉴의 File/Write Class Files...을 클릭합니다. 아래의 창이 뜨면 Save 버튼을 클릭하여 저장합니다.
생 성된 파일의 프로젝트에 포함시키기 위하여 체크를 하고 Add 버튼을 클릭합니다.
2) 슈퍼클래스 지정
Xcode에서 보면 AppController 클래스 파일을 확인할 수 있습니다. 인터페이스 빌더에서 위와 같이 생성한 클래스들은 헤더파일에서 슈퍼클래스를 지정해 주어야 합니다. 오랜지 색으로 되어 있는 부분을 NSObject로 변경하고 저장합니다.

#import <Cocoa/Cocoa.h>

@interface AppController : /* Specify a superclass (eg: NSObject or NSView) */ {
    IBOutlet NSTextField *textLabel;
    IBOutlet NSTextField *userInput;
}
- (IBAction)changeTextLabel:(id)sender;
@end

3) 코드와 동기화
이제 인스펙터에서 다시 확인하면 아래의 붉은색 사각형 부분과 같이 AppController.h라 바가 생겨 Xcode의 AppController 클래스와 연결되어 있음을 알려줍니다.


이전에는 소스코드에 변경사항이 생기면 Xcode에서 해당 클래스의 헤더파일을 드래그 하여 인터페이스 빌더의 nib 도큐먼트로 드랍 해서 변경사항을 적용시켜 주어야 했습니다. 하지만 이제는 Xcode에서 소스코드에 변경사항이 생기고 저장이 되면 인터페이스 빌더에 바로 반영이 되어 매우 편리합니다.

Xcode에서 미리 클래스 파일을 만들어 놓고 인터페이스 빌더에서 해당 클래스를 선택하는 것도 가능합니다.


AppContorller 의 인스펙터에서 새롭게 Outlet을 추가해 보았습니다.

위와 같이 AppController.h의 상단에 MainMenu.xib 바 밑에 추가되기 때문에, 헤더파일에 반영이 되지 않은 것을 쉽게 확인할 수 있습니다. 소스코드에서 아래와 같이 myOutlet1을 추가한 후에 저장해 보았습니다.

#import <Cocoa/Cocoa.h>

@interface AppController : NSObject {
    IBOutlet NSTextField *textLabel;
    IBOutlet NSTextField *userInput;
    IBOutlet NSTextField *myOutlet1;
}
- (IBAction)changeTextLabel:(id)sender;
@end

다시 인터페이스 빌더의 AppController의 인스펙터에서 확인하면 좌측과 같이 변경된 사항이 자동으로 반영되어 있습니다.




7. 기타
1) Effect
눈에 뛰는 것은 인스펙터에 'Effect' 항목이 추가되었다는 것입니다. 코어에니메이션을 이용하여 사용자 UI에 화려한 효과를 주는 것으로 보입니다. 아래는 효과를 선택하는 화면이며,  보시는 바와 같이 다양한 효과가 있습니다. 재미있는 것이 많을 것 같은데 몇가지만 확인해 보았습니다.


코어에니메이션을 사용하기 위해서는 Content View를 체크해야 합니다. Context Filters에서 Color Invert와 Gaussian Blur 필터를 추가해 보았습니다.


* Color Invert + Gaussian Blur 필터 적용

* Color Invert 필터 적용

2) 크기조절과 정렬
윈도우 확대시에 컨트롤들의 위치와 크기를 조절하는 부분을 움직이는 gif로 만들어 보았습니다. (실제로는 훨씬 부드럽습니다)

하 얀색으로 된 부분이 윈도우고 붉은색이 해당 콘트롤입니다. 윈도우 확대시 변화되는 모습을 시각적으로 보여 줍니다.


정렬 기능이 인스펙터에 추가되었습니다. Alignment 항목은 다른 오브젝트와 같이 선택되었을 때 적용이 가능합니다.

Placement는 가로 또는 세로로 정중앙에 위치하게 합니다.



Xcode와 마찬가지로 인터페이스 빌더 3.1에도 재미있고 신기한 기능들이 많이 추가 된 것 같습니다. 잠시 사용해 본 것이라 틀린 내용들이 있을 수 있습니다. 알려 주시면 수정하겠습니다.

이전 인터페이스 빌더를 보면 독특한 방식은 인상 깊었지만 무엇인지 약간 부족한 느낌을 받았습니다. 하지만 이번 3.1버젼은 비록 짧은 시간 일부분만 확인해 보았지만, 안정적이고 완성도가 많이 높아졌다는 느낌을 받았습니다.




출처 : http://blog.naver.com/PostView.nhn?blogId=seogi1004&logNo=110085700131
Posted by 오늘마감
XCODE2010.06.21 09:28
[펌] Xcode 3 둘러보기(3) - 기타
출처 - http://www.cocoadev.co.kr/167






이번 포스팅에서는 Xcode 3에서 2.0으로 업그레이드 된 Objective-C와 추가된 컴파일 옵션에 대해서 알아 보겠습니다.

역시나 깊이도 없고 내용도 별로 없는 제목 그대로 둘러보기 입니다. 자세하고 정확한 자료는 아래의 애플에서 제공하는 문서들을 참고하시기 바랍니다.



1. Objective-C 2.0

1) 가비지 컬렉션 지원
Cocoa Object에 가비지 콜렉션이 지원됩니다. 이제는 더이상 retain, release에 신경을 쓰면서 오브젝트의 retain counts를 관리할 필요가 없게 되었습니다. 가비지 컬렉션은 기본으로 꺼져있습니다. 이를 사용하기 위해서는 Project 정보 윈도우의 Build에서 GCC 4.0 - Code Generation 분류중 'Objective-C Garbage Collection' 항목에서 지원여부를 선택해야 합니다.
   

* Unsupported
가비지 컬렉션을 사용하지 않습니다.

* Supported (-fobjc-gc)
가비지 컬렉션과 이전의 retain/release를 병행해서 사용할 수 있습니다.

* Required (-fobjc-gc-only)
가 비지 컬렉션만 사용하고 이전의 retain, release를 사용하지 않습니다. 새롭게 시작하는 프로젝트는 이 옵션을 선택하는 것이 좋을 것 같습니다.

가비지 컬렉션에 의해 메모리에서 삭제되는 오브젝트에게는 finalize이란 메시지가 전달됩니다. 이 메시지를 처리할 경우에는 반드시 super의 finalize도 호출해야 합니다.

- (void)finalize
{
    ...
    ...
    [super finalize];   
}


2) Property

@property 와 @synthesize를 이용하여 class 내부변수를 편리하고 쉽게 관리할 수 있습니다.

@property(속성) 타입 변수명;
@synthesize 변수명

property의 속성들은 아래와 같으며 ','로 구분합니다.

* getter
getter=getName과 같이 getter 함수의 이름을 지정합니다. 특별히 지정되지 않았을 경우에는 변수명과 같은 이름이 사용됩니다.

* setter
setter=setName과 같이 setter 함수의 이름을 지정합니다. 특별히 지정되지 않았을 경우에는 set[변수명]으로 사용됩니다.

* readonly
읽기전용으로 getter 함수만 사용 가능하고 setter 함수는 사용할 수 없습니다.

* readwrite
getter, setter 함수 모두 사용할 수 있습니다.

* assign
setter 에서 'value = newValue;'와 같이 단순한 할당이 적용됩니다;

* retain
아래와 같이 할당시 변수의 retain이 적용됩니다.
if (value != newValue)
{
    [value release];
    value = [newValue retain];
}

* copy
아래와 같이 할당시 변수의 copy가 적용됩니다.
if (value != newValue)
{
    [value release];
    value = [newValue copy];
}

아래는 property와 synthesize의 사용예입니다. property는 interface내에서 synthesize는 implementation내에서 선언됩니다.

* MyObject.h
#import <Cocoa/Cocoa.h>

@interface MyObject : NSObject {
    NSString *myName;
}

@property(copy,readwrite) NSString *myName;

@end

* MyObject.m
#import "MyObject.h"

@implementation MyObject
@synthesize myName;

@end

이 제 getter와 setter의 구현없이 소스코드에서 아래와 같이 사용할 수 있습니다.
MyObject *myObject = [[MyObject alloc] init];

[myObject setMyName:@"KingKong"];
NSLog(@"%@", [myObject myName]);


3) Dot(.) 문법지원
C++, Java에서 사용하는 '.'를 사용할 수 있게되었습니다. '[obj myName]'과 같이 사용하던 것을 'obj.myName'으로 사용할 수 있습니다. 아래가 사용예입니다.

obj.myName = @"cocoa"; // [obj setMyName:@"cocoa"];
NSLog(@"%@", obj.myName); // NSLog(@"%@", [obj myName]);


4) 에뉴뮬레이션 문법 지원
C 스타일의 for문 대신에 "for ([변수] in [collection 오브젝트])"와 같이 편리하게 사용할 수 있습니다. collection 오브젝트에는 NSArray, NSDictionary, NSSet등의 클래스의 인스턴스가 올 수 있습니다.

NSArray *myArray = [NSArray arrayWithObjects: @"A", @"B", @"C", nil];
   
for (int i = 0; i < [myArray count]; i++) {
    NSLog(@"%@", [myArray objectAtIndex:i]);
}
       
for (NSString *str in myArray) {
    NSLog(@"%@", str);
}



2. 다양한 플랫폼 지원

1) OS X 지원
OS X 10.5, OS X 10.4, OS X 10.3(Xcode 설치시 옵션)의 여러 OS X 버젼과 아이폰을 지원합니다.


2) 64bit 아키텍쳐 지원
이제 코코아 어플리케이션도 64비트로 작성할 수 있습니다.  


3) 컴파일러(GCC) 버젼 선택
GCC 버젼을 선택할 수 있습니다. Xcode 2.5에서도 사용했던 4.0 버젼이 기본으로 선택되어 있으며, 최신버젼 4.2 또는 시스템에 실치된 gcc도 사용이 가능합니다. 그리고 LLVM(Low Level Virtual Machine)을 지원하는 gcc도 선택할 수 있습니다.



가 비지 컬렉션, Property나 에뮬레이션 지원은 반가운 소식인데 닷('.') 문법 지원은 다소 의외입니다. '.'을 사용한 소스를 보면 C++, Java 프로그래머들은 처음 접할 시에 이질감이 덜하겠지만, Objective-C스러운(?) 맛이 줄어 들지 않을까 기우가 듭니다.

아무튼 애플에 의해 Objective-C가 다른 언어들의 장점을 흡수하면서 발전하는 모습을 보니 좋습니다.



출처 : http://blog.naver.com/PostView.nhn?blogId=seogi1004&logNo=110085700261
Posted by 오늘마감