Making things Move on the iPhone

Making Things Move
on the iPhone
Keith Peters
www.bit-101.com

Wednesday, March 4, 2009

www.bit-101.com/
360iDev/
presentation.zip


CoreAnimation


Background


Background
2005


Background
2005
2007


Background
2005
2007
2008


What is Animation?


Coded Animation


Coded Animation
Apply a
rule


Coded Animation
Apply a
rule

Change
something


Coded Animation
Apply a
rule

Update Change
the screen something


Make something
to move


Make something
to move

(project ﬁles: Animation101)


// interface
UIImageView *ball;

// viewDidLoad
ball = [[UIImageView alloc] initWithImage:
[UIImage imageNamed:@quot;ball.pngquot;]];
[self.view addSubview:ball];


NSTimer


NSTimer
[NSTimer
scheduledTimerWithTimeInterval:1.0/60.0
target:self
selector:@selector(onTimer)
userInfo:nil
repeats:YES];


Moving UIViews


Moving UIViews

• view.center


Moving UIViews

• view.center
• view.transform


Moving UIViews

• view.center
• view.transform
• view.frame


// interface
float x;
float y;

// viewDidLoad
x = 50.0;
y = 50.0;


ball.center = CGPointMake(x, y);
x += 2.0;
y += 3.0;


ball.frame = CGRectMake(x, y, width, height);
x += 2.0;
y += 3.0;


ball.transform =
CGAffineTransformMakeTranslation(x, y);
x += 2.0;
y += 3.0;


ball.transform =
CGAffineTransformTranslate(
ball.transform, 2.0, 3.0);


Which is fastest?


Which is fastest?

• view.center


Which is fastest?

• view.center
• view.transform (~2-3x)


Which is fastest?

• view.center
• view.transform (~2-3x)
• view.frame (~2-3x)


Velocity

(project ﬁles:Velocity)


Velocity

+
(project ﬁles:Velocity)


speed
and
direction


speed
and
direction
y velocity

x velocity


- y velocity

- x velocity + x velocity

+ y velocity


// interface:
float vx;
float vy;


// interface:
float vx;
float vy;

// viewDidLoad:
vx = 2.0;
vy = 3.0;


// interface:
float vx;
float vy;

// viewDidLoad:
vx = 2.0;
vy = 3.0;

// onTimer:
x += vx;
y += vy;


speed

angle

(project ﬁles: AngularVelocity)


y velocity
speed =
sin(angle)
x
speed
angle
x velocity = cos(angle) x speed
(project ﬁles: AngularVelocity)


// interface:
float angle;
float speed;


// interface: // viewDidLoad:
float angle; angle = 45.0;
float speed; speed = 4.0;


float angle; angle = 45.0;
float speed; speed = 4.0;

// onTimer:
x += cos(angle * M_PI / 180.0) * speed;
y += sin(angle * M_PI / 180.0) * speed;


Acceleration

(project ﬁles: Acceleration)


Acceleration

+
(project ﬁles: Acceleration)


// interface:
float ax;
float ay;


float ax; ax = 0.07;
float ay; ay = 0.1;


float ax; ax = 0.07;
float ay; ay = 0.1;

// onTimer:
x += vx;
y += vy;
vx += ax;
vy += ay;


Bouncing

(project ﬁles: Bouncing)


-x velocity y velocity

y velocity
x velocity


// interface:
float bounce;


// interface:
float bounce;

// viewDidLoad:
bounce = -1.0;


x += vx;
y += vy;
if(x > 300) // 320 - radius (20)
{
x = 300;
vx *= bounce;
}
else if(x < 20) // 0 + radius
{
x = 20;
vx *= bounce;
}


if(y > 440) // 460 - radius

{
y = 440;
vy *= bounce;
}
else if(y < 20) // 0 + radius
{
y = 20;
vy *= bounce;
}


Gravity

acceleration
(+y)


// interface:
float gravity;


// interface:
float gravity;

// viewDidLoad:
gravity = 0.5;


// interface:
float gravity;

// viewDidLoad:
gravity = 0.5;

// onTimer:
vy += gravity;


acceleration.y

acceleration.x


@interface GravityViewController :
UIViewController <UIAccelerometerDelegate>
{
UIImageView *ball;
float x;
float y;
float vx;
float vy;
float bounce;
CGPoint gravity;
}


// viewDidLoad
gravity = CGPointZero;
[[UIAccelerometer sharedAccelerometer]
setDelegate:self];


// viewDidLoad
setDelegate:self];

- (void)accelerometer:(UIAccelerometer *)accelerometer
didAccelerate:(UIAcceleration *)acceleration
{
gravity = CGPointMake(acceleration.x,
-acceleration.y);
}


// viewDidLoad
setDelegate:self];

- (void)accelerometer:(UIAccelerometer *)accelerometer
didAccelerate:(UIAcceleration *)acceleration
{
gravity = CGPointMake(acceleration.x,
-acceleration.y);
}

// onTimer
vx += gravity.x;
vy += gravity.y;


Do we still have time?


Dragging and Throwing


// interface
BOOL dragging;


// interface // viewDidLoad
BOOL dragging; dragging = NO;


// interface // viewDidLoad
BOOL dragging; dragging = NO;

- (void)onTimer
{
if(!dragging)
{
...
}
}


- (void)touchesBegan:(NSSet *)touches
withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:self.view];
float dx = point.x - x;
float dy = point.y - y;
float dist = sqrt(dx * dx + dy * dy);
if(dist < 20)
{
dragging = YES;
x = point.x;
y = point.y;
vx = 0;
vy = 0;
}
}


- (void)touchesEnded:(NSSet *)touches
{
dragging = NO;
}


- (void)touchesMoved:(NSSet *)touches
{
if(dragging)
{
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:self.view];
vx = point.x - x;
vy = point.y - y;
x = point.x;
y = point.y;
ball.center = point;
}
}


Thank you
• Keith Peters
• kp@bit-101.com
• www.bit-101.com
• www.wickedpissahgames.com
• www.bit-101.com/360iDev/presentation.zip


Making things Move on the iPhone

Recommended

Recommended

More Related Content

More from John Wilker

More from John Wilker (20)

Recently uploaded

Recently uploaded (20)

Making things Move on the iPhone