コピペでつくれる合成カメラアプリ。

用意したグラフィックとの合成写真が撮影できるアプリが急遽必要になったのでつくってみました。
その際に作成したアプリのソースを記録しておこうとおもいます。

以下の3ステップで動作すると思うので、
もしも必要になった方がいれば、ご自由にご利用ください。

1. Titaniumで新規プロジェクトを作成
2. Resources/app.jsに下記コードをコピペ
3. Resources/img/以下に camera.png と graphic.png を用意する

app.js

// iOS6.1.3のiPhone5でしか動作確認しておりません。

(function() {
    "use strict";

    var win           = Ti.UI.createWindow(),
        // カメラ起動ボタン
        button        = Ti.UI.createButton({
            top:             444,
            width:           50,
            height:          50,
            backgroundImage: "img/camera.png"
        }),
        cameraManager = new CameraManager;

    // 初回はカメラを自動的に起動
    cameraManager.showCamera();

    button.addEventListener("click", cameraManager.showCamera);

    win.add(button);
    win.open();

    // CameraManager Class
    function CameraManager() {
        var graphic, overlay;

        function showCamera() {
            // 合成するグラフィック（位置・サイズは適当です）
            graphic   = Ti.UI.createImageView({
                top:    265,
                width:  300,
                height: 210,
                image:  "img/graphic.png"
            }),
            overlay   = Ti.UI.createView();

            overlay.add(graphic);

            Ti.Media.showCamera({
                success:     handleSuccess,
                cansel:      handleCansel,
                error:       handleError,
                mediaTypes:  Ti.Media.MEDIA_TYPE_PHOTO,
                // オーバーレイ画像の設定
                overlay:     overlay,
                // アスペクト比の保持
                transform:   Ti.UI.create2DMatrix().scale(1)
            });
        }

        function handleSuccess(evt) {
            // カメラで撮影した画像をリサイズしたイメージビュー
            var imageView = Ti.UI.createImageView({
                    top:    10,
                    // アスペクト比を保持したまま画面内に収まるサイズにリサイズ
                    width:  318,
                    height: 424,
                    image:  evt.media
                });

            // グラフィックの位置を適当に移動（本来不要な処理）
            graphic.top = imageView.height - graphic.height;
            imageView.add(graphic);

            // カメラロールに保存
            imageView.toImage(function (evt) {
                Ti.Media.saveToPhotoGallery(evt.blob);
            });

            win.add(imageView);
        }

        function handleCansel(evt) {
            ;
        }

        function handleError(evt) {
            // カメラの起動に失敗した際のアラート
            alert("ERROR");
        }

        return {
            showCamera : showCamera,
        };
    }
})();

いかんせん超特急でつくったアプリだったので、
撮った写真をカメラロールに保存するという必要最低限の機能しか持たせてません。
また、カメラを起動している際と実際に保存される画像の合成位置に若干のズレが発生します。
そんなこんなですが、いつかどこかでこのソースが誰かの役に立つときがきてくれれば幸いです。