Sencha Touch用にAndroidエミュレータを設定する

こんにちは、ゼノフィnakamuraです。

この記事は、6月19日に公開されたUS Sencha社ブログ Android Simulator Setup for Sencha Touch を翻訳したものです。遅くなりましたがお届けします。

Androidデバイス用に開発されたSencha Touchのアプリケーションは開発処理の一部として、Androidシミュレータでテストする必要があります。このブログ記事はSencha Architect、またはコマンドラインツールで作成されたSencha TouchのアプリケーションのためのAndroidシミュレータのインストールと利用方法について説明します。

販売され利用されているAndroidスマホの数は最近iOSのスマホの数を超えました。（2013年4月のTime誌の記事でその数字を分析しています）。

多くのSencha Touch開発者はAndroidプラットフォームをターゲットとしています。このブログ記事では最初から最後までAndroidの開発環境のセットアップを紹介します。スクリーンショットとディレクトリ名はMac向けです。Linuxでの手順はほぼ同じで、Windowsの手順でもとても似ています。

1. Android SDKツールのインストール

概要

Android SDKツールをインストールして下さい：ご使用のOSに合わせて適切なファイルをダウンロードして下さい。

ディスカッション

ダウンロードページで「Download for Other Platforms」のドロップダウンメニューをクリックし、「SDK Tools Only」のzipファイルをダウンロードして下さい。（Windowsの場合もinstaller.exeでなく、zipファイルをダウンロードして下さい）。

ダウンロードしているものはSDKそのものではなく、残りのSDKのインストーラが含まれているzipファイルです。次のセクションでSDKツールそのものを利用して実際のエミュレータをダウンロードします。

ホームディレクトリの「bin」ディレクトリにAndroid SDKツールを解凍して下さい。

Mac OS

Mac OSの場合、ファイルを/Users/username/binに保存して下さい（もし存在しない場合、「bin」ディレクトリを作成して下さい）。MacではAndroid SDKディレクトリのフルパスは/Users/username/bin/android-sdk-macosx/です。

Linux

Linuxの場合、/home/username/binにファイルを保存して下さい（もし存在しない場合、「bin」ディレクトリを作成して下さい）。LinuxではAndroid SDKディレクトリのフルパスは/home/username/bin/android-sdk-linux/です。

Windows

Windows 7を利用している場合、WindowsがファイルをC:\Users\usernameのディレクトリに入れます。すでにSencha Cmdをインストールしている場合（下記参照）、C:\Users\username\binディレクトリはすでに作成されています。また自分でも作成できます。binディレクトリの下でAndroid SDKを解凍して下さい。WindowsでのAndroid SDKディレクトリのフルパスはC:\Users\username\bin\android-sdk-windowsです。

2. Androidエミュレータのインストール

概要

Android SDKマネージャー（ダウンロードしたもの）を使用して、IntelベースのAndroidエミュレータをインストールしてください。

ディスカッション

android-touch-1

Android SDKディレクトリでは、「tools」のサブディレクトリの下に、「android」という実行可能ファイルがあります。Android SDK Managerを起動するためにそれをダブルクリックして下さい。

android-touch-2

「Android 4.2.2 (API 17)」の隣のボックスのチェックを外します。こうすると、そのセクションの全てのボックスのチェックが外れます。あとは「Intel x86 Atom System Image」をチェックするだけです。「Platform tools」と「Build-tools」の横のチェックボックスもチェック入れたまま残しておきます。

Androidアプリケーションの開発にSencha Touchを利用しているので、他の製品をインストールする必要はありません。

インストールを完了させるための最後の手順です：

Androidのパッケージをダウンロードしてインストールするため、「Install 4 packages…」をクリックして下さい。
パッケージのヘッダーをクリックし、「Accept License」をクリックして下さい。
下のプログレスバーはインストールの進捗状況を表示しています。全てのパッケージがインストールされるのを待って下さい。

3. Androidエミュレータを設定し起動する

概要

エミュレータのダウンロードをテストするために、最初の実行時にエミュレータを構成して、それから正確に動作しているか確認し起動します。

ディスカッション

以前の手順で全てのパッケージがダウンロードされた後、「Tools → Manage AVDs…」のメニュー項目でAndroid SDKツールで選択して下さい。

android-touch-3

定義した仮想Androidマシンを全て表示するダイアログが現れます。初めてこのコマンドを実行したため、マシンは表示されていません。「New…」ボタンをクリックして、新しいマシンを定義して下さい。

android-touch-4

名前、デバイスの種類、APIレベル（私達のケースでは17）を入力して下さい。それと「Use Host GPU」がチェックされている事を確認して下さい。この設定をするためにOKをクリックして、サマリー画面でもOKをクリックして下さい。

android-touch-5

初めてAndroidエミュレータを構成しましたので、あなたの仮想Androidデバイスの横に緑のチェックマークが見えるはずです。エミュレータを起動するためにダイアログの右側に「Start…」をクリックして下さい。次の画面で「Launch」をクリックして下さい。

android-touch-6

全てを正しくインストールしていたら、Androidエミュレータは起動します。マシンの速さによっては、起動処理に数分間かかることもあります。エミュレータが起動したら、以下の画面が見えるはずです。

android-touch-7

既にこのエミュレータに設置されているアプリケーションを見るために丸い部分を直接クリックして下さい。もしこの画面を見ることが出来ましたら、Androidエミュレータを正確に構成し設置することができました。

Linux 64ビットに対する追加の手順

Androidエミュレータは32ビットバイナリです。あなたの64-bitLinuxシステムで32ビットバイナリを動作させるためにはLinuxの32ビットバージョンを設置する必要があります。多くのLinuxシステムでは、これはデフォルトで行われません。

もし「tools」ディレクトリでエミュレータファイルを見るのに、「emulator: file not found」というようなエラーメッセージが出る場合は、64ビットLinuxシステムに32ビットローダーを設置する必要があります。

Ubuntu/Debian: 「sudo apt-get install ia32-libs」を入力して下さい。

Red Hat/Fedora:docsを読んで下さい。

Linuxの他の種類: Googleなどの64ビットシステム用 <Linux flavor>32ビットローダー

4. Androidの証明書を生成

概要

Androidエミュレータにプログラムをダウンロードするとき、または実際のAndroidデバイスでテストする時に使用する証明書を生成します。

ディスカッション

Androidエミュレータと利用できる証明書を生成するために、Javaに付属している「keytool」を利用するので、マシンにはJava SE 1,6以上をインストールされている必要があります。もしMacをお使いでしたら、既にインストールされています。Windowsマシーンにもほとんどの場合、インストールされています。

Terminalまたはコマンドプロンプトから「keytool」を入力して下さい。もしコマンドが見つけられなかったら、java.comを訪ねてJava SE 1.6、またはそれより最新版をダウンロードする必要があるかもしれません。

単純化のため、Android SDKディレクトリでkeystoreを生成しますので、keystore、エイリアス、パスワードを全て「android1」にセットします。（本当の証明書はkeystoreとpasswordにはこのような単純な値をセットしませんが、今はデモの為に普通より単純にしています）。

ダイアログは次のようになっています：

$ pwd
/User/username/bin/android-sdk-macosx
$ keytool -genkey -v -keystore android1.keystore -alias android1 -keyalg RSA -keysize 2048 -validity 10000
Enter keystore password: (I entered "android1")
What is your first and last name?
  [Unknown]: Patrick Chu
What is the name of your organizational unit?
  [Unknown]: Training
What is the name of your organization?
  [Unknown]: Sencha
What is the name of your City or Locality?
  [Unknown]: Redwood City
What is the name of your State or Province?
  [Unknown]:  California
What is the two-letter country code for this unit?
  [Unknown]:  US
Is CN=Patrick Chu, OU=Training, O=Sencha, L=Redwood City, ST=California, C=US correct?
  [no]:  yes
 
Generating 2,048 bit RSA key pair and self-signed certificate (SHA1withRSA) with a validity of 10,000 days
    for: CN=Patrick Chu, OU=Training, O=Sencha, L=Redwood City, ST=California, C=US
Enter key password for &lt;android1&gt;
    (RETURN if same as keystore password):
[Storing android1.keystore]
$

この時点で、あなたの証明書が含まれている「android.keystore」というファイルがあります。Sencha Touchアプリケーションを「ネイティブ」なAndroidアプリケーションにパッケージするために、これが必要となります。

5. packager.jsonを編集する

概要

上記で生成した証明書のファイルとAndroidエミュレータの環境の内容を反影するために「packager.json」を編集して下さい。

ディスカッション

この手順でAndroidシミュレータにロードできる物があるために、デモのSencha Touchアプリケーションを作成します。これを実現できるために、あなたのSencha Touch環境について、いくつかのポイントを想定します：

ローカルホストのウェブサーバーのルーツは「htdocs」というフォルダです。もしXAMPPを利用して、Apacheを設置したらこれがデフォルトです。
Sencha Touchファイルは「htdocs/touch2」のディレクトリに入っています。
既にSencha Cmdを設置しました。テストするためには、Terminal、またはコマンドプロンプトで「sencha」を入力して下さい。もしSencha Cmdのヘルプ画面を見えたら、Sencha Cmdはインストールされています。もしコマンドが未検出であれば、Sencha Cmdをインストールして下さい。

ディレクトリを「htdocs/touch2」に変更して、次のコマンドを入力して下さい：

sencha generate app –name AndroidDemo –path ../demo
Windowsでは、ディレクトリは「..\demo」です

htdocs/demoは存在してなくても大丈夫です：Sencha Cmdはそれを生成します。コマンドが完成してから、単純でも完全なSencha Touchアプリケーションがあります。もしウェブサーバーが動作していると、http://localhost/demoで動作をご覧になれます。

私達のAndroid環境の内容をこのアプリケーションに言い伝えるためには、「htdocs/demo/packager.json」ファイルを編集する必要があります。全てのプラットフォームと同様の、編集が必要となるプロパティです：

“applicationId”: “com.demo.AndroidDemo”, /* (これはピリオドで分けられている、最低二つの部分が含まれてないといけません) */
“platform”: “AndroidEmulator”,
“certificateAlias”: “android1”,
“certificatePassword”: “android1”,
“androidAPILevel”: “17”,

Mac OS

Mac OS専用のプロパティ:

“certificatePath”: “/User/username/bin/android-sdk-macosx/android1.keystore”,
“sdkPath”: “/User/username/bin/android-sdk-macosx”,
「username」を自分のユーザー名と切り替えて下さい。

Linux

Linux専用のプロパティ:

“certificatePath”: “/home/username/bin/android-sdk-linux/android1.keystore”,
“sdkPath”: “/home/username/bin/android-sdk-linux”,
「username」を自分のユーザー名と切り替えて下さい。

Windows

WindowsWindows専用のプロパティ:

“certificatePath”: “C:/User/username/bin/android-sdk-windows/android1.keystore”,
“sdkPath”: “C:/User/username/bin/android-sdk-windows”,
「username」を自分のユーザー名と切り替えて下さい。
はい、Windowsのパスでは普通のスラッシュを利用するべきです。

ファイルに編集を保存して下さい。

後少しで終わります！残りの作業はただ私達のプログラムをAndroidエミュレータで実行することです。これが手順です：

Androidエミュレータを起動する。Sencha Cmdがそれにアプリケーションのファイルを送ろうとする時に動作してないといけません。
ディレクトリを「htdocs/demo」に変更する（アプリケーションのルーツは、packager.jsonファイルのある場所です）
sencha app package run packager.jsonを入力して下さい。

（注：Sencha Cmdが動作するためには、実行可能なJavaはパスのどこかにないといけません）

運が良ければ、あなたのAndroidエミュレータでサンプルのアプリケーションが起動することをご覧になれます！おめでとうございます！

下にあるタブをクリックして、サンプルアプリケーション内の画面の間を移動して下さい。

6. （オプション）AndroidエミュレータのためのIntelハードウェア加速設定ドライバーをインストールする

概要

Androidエミュレータがパフォーマンスを改善するためにハードウェア加速設定を設置して下さい。この手順は最もオススメです。

ディスカッション

Androidエミュレータ内でSencha Touchプログラムを実行しながら、少し「鈍い」感じで動作していることに気づくかもしれません。エミュレータは完全にソフトウェア内に実装されているので、いつも遅いのです。

しかし、もしIntelベースのMac、またはWindowsの機械で実行しているなら、VMWare、またはHyper-Vのバーチャルマシーンもハードウェアアシストされているように、Androidエミュレータにハードウェア加速化を提供するIntelドライバーを利用できます。ドライバーが動作できるようにするには、あなたのIntelプロセッサーをIntelのVirtualization Technology (VT)に対応させる必要があります。このパッケージについて、Intelの名前はHAXです。これは「Hardware Axceleration」の略です。

このページからソフトウェアをダウンロードできます。

このページは対応するプラットフォーム全てへのリンクも含まれています。ソフトウェアをインストールした後に、Androidエミュレータはより速く動作していることに気づきます。

注：Android Package SDKツールではHAXMは可能なインストールとして一覧されていることに気づくと思います。このようにHAXのインストールに問題がありました。その代わりに、上のリンクを通って、そのページからインストールして下さい。

注：もしPCでWindows 7にHyper-Vを動作しているなら、Intelのハードウェア加速度を実行できるためにはそれを無効にする必要があります。Hyper-Vはバーチャル化の機能を自分のためにロックするので、他のバーチャル化のプログラムが動作できなくなります。

7. 他のリソース

以下にこのブログ記事で紹介できなかった二つの役に立つAndroid開発機能の一覧表があります。

Chrome Mobile Emulation:Chrome Mobile Emulation: Chrome内でタッチイベント、スクリーン画像、デバイスユーザーエージェント、デバイスの向き、位置情報、全てシミュレーションできます。このため、ほとんどの開発とデバッグはホストのブラウザで行えますので、これはより速く、そのアプリケーションを一日一回シミュレーターでテストとサニティチェックを実行できます。
Androidのリモートデバッグ：Chromeをホストで利用して、Androidブラウザでウェブアプリケーションをデバッグして下さい。

詳しくは

Sencha Touchのアプリケーションに対する素晴らしいアイディアがあるけど、それを開発するための最適な方法がわかりませんか？ Senchaトレーニングは年中、世界中でSencha TouchとExt JSを扱う本格的な授業を提供しています。Senchaに認定された教師があなたのSencha Touchのアプリケーションができるだけ素早く動作するための最善の措置とショートカットを教え、AndroidとiOS両方のデプロイについても説明します。詳しくはこちらへ

Sencha Blog