Core Graphicsを更に使いこなそう！ (3/6)

では、イメージを画面に描画してみましょう。これは、mySampleViewのdrawRect:メソッドを修正すればよいでしょう。

下のリスト欄に、簡単なサンプルをあげておきました（drawRect:の修正(1)のほう）。これを記述して実行してみましょう。sample.jpgのイメージが画面に表示されます！　……ただし、よくイメージが上下逆になってますが……。前に、テキストの描画で起こったのと同じ現象が、ここでも起こってしまっています。

この問題については次に説明するとして、まずはイメージの描画の基本的な流れについて説明しておきましょう。まずは、CGContextRefを取得した後、描画に必要な情報として、表示するUIImageのサイズを取り出しておきます。

CGContextRef context = UIGraphicsGetCurrentContext();
CGSize s = [myimg size];

サイズは、CGSizeという構造体として扱われます。UIImageの「size」というプロパティの値を取り出すことで、このようにイメージの大きさが得られます。

CGRect r = CGRectMake(20, 20, s.width, s.height);

続いて、描画する領域をCGRect構造体の値として用意します。これはCGRectMake関数を使って作成します。これで描画の準備は完了です。後は描画をするだけです。

CGContextDrawImage(context, r, [myimg CGImage]);

CGContextDrawImageが、描画を行うための関数です。第１引数には例のごとくCGContextRefを指定し、代２引数には描画する領域を示すCGSize、そして第３引数には描画するイメージを用意します。これは、UIImageをそのまま指定するのではないので注意が必要です。UIImageから「CGImage」というプロパティの値を取り出し、これを指定します。

このCGImageは構造体で、ビットマップイメージに関する各種の情報を管理するものです。これを引数に指定して描画を行います。扱い方自体は、そう難しくはありませんね。


では、「描いた図形が上下反転する」という問題についてです。これを解決するにはどうすればいいのか。――一番、簡単なのは、「イメージを上下逆にして用意しておく」というものですね。（いや、冗談ではなくて。Appleが配布するサンプルを見ると、本当にイメージを逆にして描画するようなものが用意されています）

そうではなくて、イメージをそのまま（上下が逆にならないように）描く方法はないのか。まぁ、ないわけではありません。下のリスト欄に修正メソッドを掲載しておきました（drawRect:メソッドの修正(2)のほう）。これで、上下が逆にならずに表示されるようになります。

ここでは、★マーク以降の４行の文が追加されています。これでイメージをもとに戻った状態で描画できるようになります。ここで何をやっているのか？については、とりあえず今は深く考えないでください。「とりあえずこう書けばいいんだ」とだけ理解しておきましょう。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

※drawRect:の修正(1)

- (void)drawRect:(CGRect)rect
{
	CGContextRef context = UIGraphicsGetCurrentContext();
	CGSize s = [myimg size];
	CGRect r = CGRectMake(20, 20, s.width, s.height);
	CGContextDrawImage(context, r, [myimg CGImage]);
}


※drawRect:メソッドの修正(2)

- (void)drawRect:(CGRect)rect
{
	CGContextRef context = UIGraphicsGetCurrentContext();
	CGSize s = [myimg size];
	CGRect r = CGRectMake(20, 20, s.width, s.height);
	
	// ★ここから追加した文
	CGAffineTransform affine = CGAffineTransformIdentity;
	affine.d = -1.0f;
	affine.ty = 20 + 20 + s.height;
	CGContextConcatCTM(context, affine);
	
	CGContextDrawImage(context, r, [myimg CGImage]);
}