iPhoneアプリといえばアニメーションが綺麗です。 どこぞのアンドロイドと違って変にカクカクしないですし、滑らかです。 そしてアニメーションといえば移動、回転、拡大、縮小の組み合わせが多いでしょう。 そんなわけで今回はUIViewをCGAffineTransformとか言うよく分からない奴で移動、回転、拡大、縮小をする方法の基本を学びましょう。 とりあえず対象のViewを用意します。 ほおおおおお…そいやっ – (void)viewDidLoad { [super viewDidLoad]; UIView *view = [UIView new]; view.frame = CGRectMake(0, 0, 200, 200); view.backgroundColor = [UIColor blueColor]; view.center = CGPoinMake(self.view.frame.size.width/2, self.view.frame.size.height/2); [self.view addSubview:view]; UIImageView *imageView = [UIImageView new]; imageView.image = [UIImage imageNamed:@”apple”]; [view addSubview:imageView]; …} いい感じですね。 そして相変わらずこのブログのコードのカラーリングはとっても見やすいです。 1.移動 右に40px、上に50px移動させます。 view.transform = CGAffineTransformMakeTranslation(40, -50); 2.回転 30°右に回転させます。 view.transform = CGAffineTransformMakeRotation(M_PI * 30.0 / 180.0); こんなDefineを用意すればスッキリします。 #define RADIAN(x) (M_PI * (x) / 180.0)…view.transform = CGAffineTransformMakeRotation(RADIAN(30)); 3.拡大と縮小 拡大と縮小です。比率を大きくすれば拡大、小さくすれば縮小出来ます。 view.transform = CGAffineTransformMakeScale(1.5, 1.5); 第1引数がx方向の拡大率、第2引数がy方向の拡大率なので、別の値を入れれば歪ませることも出来ます。 view.transform = CGAffineTransformMakeScale(0.5, 1.2); 4.初期化 真っさらな状態に戻します。つまりデフォルト値です。 view.transform = CGAffineTransformIdentity; 5.組み合わせる 「拡大して回転」みたいにアフィン変換を組み合わせます。 5.1.対象となるCGAffineTransformを指定するパターン アフィン変換をかける対象となるCGAffineTransformを指定するパターンです。 こんな感じ。 view.transform = CGAffineTransformMakeScale(1.2, 1.2);view.transform = CGAffineTransformRotate(view.transform, RADIAN(50));view.transform = CGAffineTransformTranslate(view.transform, -30, 30); 注意する点として、こちらは一見「1.2倍に拡大」⇒「右に50°傾ける」⇒「左に30px、下に30px移動」ってな変換をしてるイメージですが、Makeが付かないCGAffineTransformXXXの関数は第2引数の処理の後、第1引数のCGAffineTransformを掛けるので、 ①「1.2倍に拡大」②「右に50°傾ける」⇒①③「左に30px、下に30px移動」⇒② となり、実際は「左に30px、下に30px移動」⇒「右に50°傾ける」⇒「1.2倍に拡大」という処理になります。 5.2.CGAffineTransformを合成するパターン 複数のCGAffineTransformを合成したものを最後に適用させるパターンです。 CGAffineTransform t1 = CGAffineTransformMakeTranslation(-30, 30);CGAffineTransform t2 […]
View More