CADisplayLinkを使って、キャラクターの移動に合わせて背景をズームする方法のメモ
(※Xcodeでプログラミングして、シミュレータ (iOS6)で確認。)
画像
ポイント
・CADisplayLink
・画面座標とモデル座標の変換
背景画像の座標をそのままモデル座標として、
タッチした部分に車がズームしながら移動するサンプル
#import “ViewController.h”
#import
@interface ViewController () {
CADisplayLink *timer;
CGRect car;
CGRect map;
CGPoint target;
float rate;
}
@property (nonatomic, strong) UIImageView *carView;
@property (nonatomic, strong) UIImageView *mapView;
@end
@implementation ViewController
@synthesize mapView, carView;
– (void)viewDidLoad
{
[super viewDidLoad];
}
– (void)viewDidAppear:(BOOL)animated
{
// 位置、大きさの初期化
map = CGRectMake(0, 0, 480, 300);
car = CGRectMake(50, 200, 50, 36);
target = CGPointMake(50, 200);
rate = 1.0;
// 道路の画像
mapView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@”map.png”]];
mapView.layer.borderColor = [[UIColor redColor] CGColor];
mapView.layer.borderWidth = 2.0;
// 車の画像
carView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@”car.png”]];
carView.center = CGPointMake(car.origin.x, car.origin.y);
// 道路 -> 車
[mapView addSubview:carView];
// parent.view -> 道路 -> 車
[self.view addSubview:mapView];
// init game timer
timer = [CADisplayLink displayLinkWithTarget:self selector:@selector(updateDisplay:)];
[timer addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSDefaultRunLoopMode];
}
– (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:mapView];
// convert
// touch point -> map point
float x = (point.x – map.origin.x) / rate;
float y = (point.y – map.origin.y) / rate;
target = CGPointMake(x, y);
}
– (void)updateDisplay:(CADisplayLink*)sender
{
float a = target.x – car.origin.x;
float b = target.y – car.origin.y;
float r = hypotf(a, b);
float dx = a * (1.0 / r);
float dy = b * (1.0 / r);
if (r > 1) {
car.origin.x = car.origin.x + dx;
car.origin.y = car.origin.y + dy;
// car point near station
if (car.origin.x > 300) {
if(rate < 1.5) {
rate += 0.01;
}
// zoom map
float width = map.size.width * rate;
float height = map.size.height * rate;
float x = – map.size.width * (rate – 1.0);
float y = – map.size.height * (rate – 1.0);
mapView.frame = CGRectMake(x, y, width, height);
// update car
// zoom and adjust position
carView.bounds = CGRectMake(0,0, car.size.width * rate, car.size.height * rate);
float carX = car.origin.x * rate;
float carY = car.origin.y * rate;
carView.center = CGPointMake(carX, carY);
} else {
if(rate > 1.0) {
rate -= 0.01;
}
// zoom map
float width = map.size.width * rate;
float height = map.size.height * rate;
float x = – map.size.width * (rate – 1.0);
float y = – map.size.height * (rate – 1.0);
mapView.frame = CGRectMake(x, y, width, height);
// update car
// zoom and adjust position
carView.bounds = CGRectMake(0,0, car.size.width * rate, car.size.height * rate);
float carX = car.origin.x * rate;
float carY = car.origin.y * rate;
carView.center = CGPointMake(carX, carY);
}
}
}
@end