[XCODE] 複数のUIImageを結合して、1枚のUIImageを生成する

こんにちは、@yoheiMuneです。
本日はかなりマイナーネタですが、UIImageを結合する実装方法をブログに書きたいと思います。

UIImageを結合する処理とは

複数のUIImageを結合する処理とは、複数のUIImageを結合して1枚のUIImageにしたいというお話です（そのままですね。。）。
この処理が必要になった場面としては、Objective-Cでスクリーンショットを取得する方法のブログで言及した内容で、「スクリーンショットを取得した際に、ステータスバー部分の画像が取得できない。なので、ステータスバー部分は別画像として用意しておいて、スクリーンショット画像と合成する」というお話でした。

今回の実装では、以下のスクリーンショット画像と、ステータスバー画像を合成します。

（スクリーンショット画像）



（ステータスバー画像）

合成する処理

合成する処理は簡単で、以下のように合成したいUIImageを順番に、Contextにレンダリングしていくことで、合成画像を生成することが出来ます。

// 必要なライブラリをインポートします
#import <CoreGraphics/CoreGraphics.h>
#import <QuartzCore/QuartzCore.h>

// スクリーンショットの画像と、ステータスバーの画像
UIImage *capturedImage = /*上記の実装で取得した画像*/
UIImage *statusBar = [UIImage imageNamed:@"status_bar"];

// 合成したいサイズを指定して、描画を開始します
UIGraphicsBeginImageContext(CGSizeMake(capturedImage.size.width, capturedImage.size.height));

// まずは最下位レイヤーにしたいスクリーンショット画像をレンダリングします。
[capturedImage drawAtPoint:CGPointMake(0, 0)];

// 次にステータスバーをレンダリングします。
[statusBar drawAtPoint:CGPointMake(0, 0)];

// 上記2枚を描画した内容をUIImageとして受け取ります。
capturedImage = UIGraphicsGetImageFromCurrentImageContext();

// 描画を終了します。
UIGraphicsEndImageContext();

そしてこの実装の結果、以下のような画像が生成できます。

これで合成画像を作成する実装が完了です。

最後に

UIImageに関する処理は、Tipsとして色々と蓄積できると良いですね！ このブログでもUIImage関連で以下のような記事を記載しておりますので、ご参考になれば幸いです。

- UIImageから任意の部分の画像を切り取る方法
- UIImageを任意のサイズにリサイズする方法
- UIImageをPNGファイルとして保存する方法

最後までご覧頂きましてありがとうございました！