Selfkleptomaniac

ImageAsResized更新

AndroidにもTiBlobの機能としてImageAsResizedが実装されたにも関わらず細々と利用されているImageAsResizedモジュールですが、Titanium側の仕様変更に追随していなかった部分を更新しておきました。2.0系に合わせて更新して以来の変更です。今回の変更でローカルファイルのリサイズが正常に動作するようになりました（これまでもTiBlobを渡せば動いていたんですが）。

特徴は、回転に対応していること、支点と距離を指定すると切り取りにも対応していること、元画像とプロポーションが違う大きさにリサイズしようとすると勝手に切り取られること（仕様です）。

// Resources以下のファイルは先頭に「/」があってもなくても大丈夫です。
// SDCARDの中のファイルはTi.Filesystem.externalStorageDirectoryでフルパスを渡します。
var androimage = require('org.selfkleptomaniac.ti.imageasresized');
var image_data = androimage.imageAsResized(width, height, "images/boy.jpg", 0);
var rotated_image_data = androimage.imageAsResized(width, height, "/images/boy.jpg", 90);
var sd_card_image = androimage.imageAsResized(width, height, Ti.Filesystem.externalStorageDirectory + "tmp.jpg", 0);

// ちなみにimage_view2は90度回転しています。
// そう、回転にも対応しているんです。
var image_view1 = Ti.UI.createImageView({image:image_data, top:20, canScale:true, width:width, height:height});
var image_view2 = Ti.UI.createImageView({image:rotated_image_data, top:20, width:height, height:width});
var image_view3 = Ti.UI.createImageView({image:sd_card_image, top:20, width:width, height:height});

wrap.add(image_view1);
wrap.add(image_view2);
wrap.add(image_view3);

結果はこんな感じ。

Android実機上でのデバッグ

Androidもやりましたよ。

原文：http://docs.appcelerator.com/titanium/latest/#!/guide/Debugging_on_Android_Devices

====================================================

Android実機上でのデバッグ

【はじめに】

Titanium SDK 3.0から、Titanium Studioを利用してAndroid実機上でデバッグセッションを開始することができるようになりました。Android実機でのデバッグは以下のステップで実行できます：

• 「Debug on Android Device」を選択する
• Stuidoでアプリをビルドする
• アプリを自動または手動で実機に同期する
• アプリを実機上で起動する
• LANのWifiを経由してStudioとデバッグセッションを開始する

本項ではこれらのステップとデバッグセッションの起動について解説します。

事前に「Deploying to Android devices」で解説されているようにAndroid実機でアプリを実行できるようにセットアップしておく必要があります。

【必要なもの】

デバッグセッションを実行するために必要なのは：

• Titanium SDKリリース3.0以降
• Titanium Studioリリース3.0以降
• USBケーブルでマシンに接続されたAndroid実機

【デバッグセッションの起動】

デバッグを開始する前に、AndroidをターゲットにしたTitaniumのプロジェクトを作成しておく必要があります。基本的には次の2つのステップがあります：

1. Titanium Studioでデバッグ用セッションを初期化する
2. 実機でアプリを実行してデバッグを開始する

デバッグ用セッションの開始

1. Titanium StudioのApp ExplorerまたはProject Explorerビューからプロジェクトを選択
2. ツールバーのDebugアイコンをクリック
3. 「Android Device」を選択して「Debug on ANdroid Device」プログレスダイアログを開く
4. Titanium Studioでアプリをビルドして実機にインストール

作成したアプリでデバッグ用のセッションを開始すると、Titanium Studioは起動設定を作成し、Titanium Android Device – <アプリ名>として保存します。この起動設定をDebugのドロップダウンメニューから選択するとウィザードをスキップして同じ設定の新しいデバッグ用セッションを開始することができます。

アプリのSDKバージョンの指定を変更する場合は：

1. Debug > Debug Configurationをクリック
2. 起動時の設定を選択し、Applyをクリックして変更内容を保存するか、Debugをクリックして変更内容を保存した上でデバッグ用セッションを開始

【アプリの起動とデバッグ】

アプリのインストールが完了したら：

1. 実機上でアプリを実行
2. Titanium Studioに実機が接続されてデバッグ用セッションが開始（して、Titanium StudioのDebugパースペクティブが表示される）

【関連トピック】

略

ImageAsResized for Android更新

無料公開なので誰が使っているのか（あるいは誰も使っていないのか）さっぱり把握していないImageAsResized for Androidですが、前回の更新から1年くらい放置したままだったので、いくつか機能を追加して更新しました。というのも、AppceleratorからImageFactoryというAndroidで使える画像処理用モジュールが出ていたので、ああこれは役割を終えたなと思っていたところ、ImageFactoryを実際の案件で使ってみたらout of memoryが出まくって使い物にならなかったので、またこちらに戻ってきたのでした。

ビルドが面倒な方はAppceleratorのMarketplaceからビルド済みのファイルをダウンロードできます。

追加した機能はこちら：

• 画像の回転
• 画像の切り抜き

実際のところ回転は以前も動いていたので、実質的には切り取りを追加しただけですけどね。久しぶりなので復習しておくと、このモジュールには大きくわけて２つの機能があります。ひとつは、カメラやギャラリーから受け取るTiBlobを扱うcameraImageAsResizedとcameraImageAsCroppedのセットで、例えばTi.Media.showCameraのsuccessコールバックの中でe.mediaを渡すとそれをリサイズします。

image_mod.cameraImageAsResized(TiBlob, 幅, 高さ, 回転角度);
image_mod.cameraImageAsCropped(TiBlob, 幅, 高さ, 回転角度, 切り取り開始位置（横）, 切り取り開始位置（縦）);

切り取り開始位置は0がそれぞれ左端と一番上です。そこから幅と高さで指定された分だけの範囲を切り取ります。

button.addEventListener('click', function(){
  showCamera({
    success:function(e){
      var androimage = require('org.selfkleptomaniac.ti.imageasresized');
      var image = androimage.cameraImageAsResized(e.media, w, h, 0); //これでリサイズされる
      ......
      ......
    },
    error:function(e){...},
    cancel:function(e){...}
  });
});

もうひとつは、ローカルのファイルシステムにある画像を加工するimageAsResizedとimageAsCroppedのペアです。

image_mod.imageAsResized(幅, 高さ, ファイル, 回転角度);
image_mod.imageAsCropped(幅, 高さ, ファイル, 回転角度, 切り取り開始位置（横）, 切り取り開始位置（縦）);

使い方はこんな感じ。画像素材はexamle/imagesに入っています。

var self = Ti.UI.createWindow();
var image_mod = require('org.selfkleptomaniac.ti.imageasresized');

// 半分サイズ
var cropped_image = image_mod.imageAsResized(64, 106, "images/tzara.jpg", 0);
var imageView = Ti.UI.createImageView({image:cropped_image, top:250});
self.add(imageView);

// 顔のアップ
var cropped_image2 = image_mod.imageAsCropped(24, 56, "images/tzara.jpg", 0, 17, 5);
var imageView2 = Ti.UI.createImageView({image:cropped_image2, top:380});
self.add(imageView2);

// 手のアップ
var cropped_image3 = image_mod.imageAsCropped(64, 26, "images/tzara.jpg", 0, 0, 80);
var imageView3 = Ti.UI.createImageView({image:cropped_image3, top:450});
self.add(imageView3);

// 顔のアップを回転させてみた
var cropped_image4 = image_mod.imageAsCropped(24, 56, "images/tzara.jpg", 90, 17, 5);
var imageView4 = Ti.UI.createImageView({image:cropped_image4, top:520});
self.add(imageView4);

 return self;

注意事項ですが、元の画像のプロポーションと異なる幅と高さを指定すると勝手に画像が切り取られます。まあ、そりゃそうですよね。