PIYO - Tech & Life -

KIFを使ったスクリーンショットの自動撮影

Tips iOS Xcode

昨日書いたの記事では、Objective-Cのコードを用いてスクリーンショットを撮影する方法を紹介しました。

iPhoneアプリの画面をObjective-Cでキャプチャ - ぴよログ

今日はそのTipsを用いて各画面のスクリーンショットを自動的に撮る方法を紹介します。

スクリーンショットを撮影してドキュメントなどに使うというケースはそこそこ起こりえることだと思いますが、見た目に手をいれるたびに撮影するのは大変面倒な作業です。コードでスクリーンショットを撮れるのであれば半自動化してしまおうと思い、今日のネタを思いつきました。

自動化の方法

KIFという受け入れテストのライブラリを使います。このブログでも2度取り上げました。導入はこちらを参考にしてもらえるといいと思います。

XCode5対応！KIFでiPhoneアプリの受け入れ（統合）テスト - ぴよログ

iOS用UIテストフレームワークKIFで色々な要素をタップさせる方法 - ぴよログ

スクリーンショットを撮る

KIFを使うことでシミュレータや実機で実際にアプリを起動してUIを操作させることができます。あとは任意のタイミングでスクリーンショットを撮影するコードを呼び出せば今回の目的を果たせるというわけです。

ソースコード

実行できるソースコードはここにあります。

ios-sandbox/CaptureScreenshots at master · xoyip/ios-sandbox

サンプルとしてナビゲーションで画面を3つ持ったアプリを考えます。

このアプリの全ての画面のスクリーンショットを自動で撮ることにしましょう。

事前準備として、最初のViewと2番目のViewのUIButtonにAccessibilityLabelを設定します。それぞれ、ToSecondView、ToThirdViewとしました。

テストコードは次のようになります。少し長いですが。。。

captureScreenは、現在の画面のキャプチャ画像をアプリのディレクトリに保存するためのメソッドで、キャプチャを撮りたいタイミングで呼びます。

testメソッドでは、ボタンタップによる画面移動と、キャプチャメソッドの呼び出しを行っています。

#import <XCTest/XCTest.h>
#import <KIF.h>

@interface CaptureScreenshotsTests : KIFTestCase

@end

@implementation CaptureScreenshotsTests


- (void)captureScreen:(NSString*)name
{
    NSArray* paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
    NSString* dir = [paths objectAtIndex:0];

    UIWindow* window = [[UIApplication sharedApplication] keyWindow];
    UIGraphicsBeginImageContextWithOptions(window.bounds.size, NO, 0);
    CGContextRef context = UIGraphicsGetCurrentContext();
    for (UIWindow* win in [[UIApplication sharedApplication] windows]) {
        [win.layer renderInContext:context];
    }

    UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    [UIImagePNGRepresentation(image) writeToFile:[dir stringByAppendingPathComponent:name] atomically:YES];
}

- (void)test
{
    [self captureScreen:@"first_view.png"];
    [tester waitForViewWithAccessibilityLabel:@"ToSecondView"];
    [tester tapViewWithAccessibilityLabel:@"ToSecondView"];
    [self captureScreen:@"second_view.png"];
    [tester waitForViewWithAccessibilityLabel:@"ToThirdView"];
    [tester tapViewWithAccessibilityLabel:@"ToThirdView"];
    [self captureScreen:@"third_view.png"];
}

@end

結果

今回はシミュレータで実行しましたので、シミュレータ用のディレクトリの中を覗いてみましょう。

ちなみに、シミュレータで動かしているアプリのドキュメントディレクトリを見るのにはこちらが便利です。

iOSシミュレータのアプリディレクトリ探しから開放される - ぴよログ

該当のディレクトリをFinderで開いてみると、ちゃんと撮れていますね。これを応用すれば何枚でも自動でスクリーンショットを撮ることができますね。