6章-1 Cordovaでハイブリッドアプリ開発環境を整える【Android】 - 【連載】ハイブリッドアプリの最新情報とその動向【Corodva】
【連載】ハイブリッドアプリの最新情報とその動向【Corodva】
6章-1 Cordovaでハイブリッドアプリ開発環境を整える【Android】
CordovaではAndroid、Blackberry10、iOS、OS X、Windowsなどに向けてのアプリ開発できるが、今回はAndroid版とiOS版に限っている。
AndroidやiOS向けに開発を行うには、それぞれ独自の設定が必要で、かつ共通の設定もある。それを一つの記事にすると少し長くなってしまうので、Android版の設定とiOS版の設定と共通の設定の3つに分けて解説をしていく。また今回はMacOS上での環境構築。Windowsについては時間があれば後日。
今回はAndroid独自の設定。ちょっと複雑で、時間もかかるので1時間〜1時間半程度、集中できる時間にやった方がいい。iOSは簡単なのに・・・
Android版 事前準備
1.JDKのインストール
2.Android SDKのインストール
3.Android SDKパッケージの追加
4.環境設定変更
1.JDKのインストール
以下のサイトからJDK7、もしくはそれ以降をインストール。現状、JDK8は推奨されていないので、JDK7の方を(画像はJDK8でやっているが手順は同じなので気にせず)
→JDK7のインストール
上記リンクに飛ぶと、以下の画面が表示される。
矢印で示した部分「Accept License Agreement」にチェックを入れて、Mac OS X用をダウンロード。
ダウンロードしたものを開くと以下の画像のようになるので、ダブルクリック。するとインストーラが立ち上げるので、特に変更を加えることなく「続ける」を押してインストールを進める。
インストールが終わったら、正しくインストールされているかバージョンの確認。
コマンドラインから
java -version
上記のコマンドを実行すると、「java version "1.8.x_xx"」のように表示される。
されない場合は正しくインストールされていない。
2.Android SDKのインストール
Android用プラグインを作成しない場合は Android Stand-alone SDK Toolsからのインストールで十分だけど、今回は開発に幅を持たせるという意味からAndroid Studioをインストール。
詳細なインストール手順は以下の通り。
Android Studio と SDK Tools のダウンロード | Android Developers
上記リンクから。
まずはダウンロード
左下にある「DOWNLOAD ANDROID STUDIO FOR MAC」という緑色の部分をクリック(赤い矢印)
そうすると同意を求める文章が出てくるので、該当箇所にチェックを入れてダウンロードを開始。
次にアプリケーションフォルダへの移動
ダウンロードしたもの(.dmg)を立ち上げると、以下の画面が立ち上がるのでAndroid StudioをApplicationsへドラッグ&ドロップ。
続いて、AndroidStudioの起動
Android Studioが正常に起動すれば完了。 その他設定については次の「Android SDKパッケージの追加」で行う。
※Android Studioの日本語化について。
Android Studioを開発で利用することはあまりないので、不要かと思うが実施する方は以下のページを参照。
3.Android SDKパッケージの追加
Android SDK をセットアップする場合、少なくとも最新の SDK Tools と Android プラットフォームのダウンロードが必要。今回は必要最低限のものだけダウンロード。
まず、AndroidStudio SDK Managerの起動
Android Studioを起動すると画像の左側の画面が表示される。ここで「Configure」を選択し、「SDK Manager」をクリック。
SDK Tools、Platformの入手
画像のように、「Android SDK」を選択し、ページ下部の「launch Standalone SDK Manager」をクリック。 すると以下の画面が立ち上がる。
Toolsディレクトリ直下にある以下のものにチェックをつける(最後にまとめてインストールするので今はチェックをつけるだけ)
・Android SDK Tools
・Android SDK Platform-tools
・Android SDK Build-tools(最新バージョン)
また、少し下に移動するとAndroid x.x.x のようにバージョンごとのディレクトリがあるので、開発対象バージョンのディレクトリを開く。例ではAndroid 6.0。
ディレクトリのなかの、SDK Platformにチェックをいれる。また以下の画像で「Installed」となっているものはチェックをつけておく。自分の画面で既に「Installed」と表記されているものはそのままで大丈夫。 「Update」という表記されているものはチェックをつける必要がある。
追加API用のサポートライブラリを取得する
続いて、追加API用のサポートライブラリやその他のAPI用の「Google Play」サービスを入手する。
画面の下の方に「Extras」ディレクトリがあるので、そこで以下のものを選択。
・Local Maven repository for Support Libraries
・Android Support Library
・Google Repository
・Google Play Service
・Intel x86 Emulator Accelerator (HAXM installer)
パッケージをインストールする
必要なパッケージをすべて選択したら、インストール。
右下の[Install ? packages] をクリック。
次のウィンドウで、左側のパッケージ名を1つずつダブルクリックし、各パッケージの使用許諾契約に同意する。最後に[Install] をクリック。
SDK Manager のウィンドウの1番下に、ダウンロードの進捗状況が表示されるので、ダウンロードが終わるまでSDK Managerを終了しないこと。SDK Managerを終了すると、ダウンロードはキャンセルされてしまう。
4.antのインストール
Androidのビルド用にantが必要なのでインストール。
コマンドラインから以下のコマンドを実行する。
$ brew install ant
成功すれば、以下のような表示がでる。
==> Downloading https://archive.apache.org/dist/ant/binaries/apache-ant-1.9.4-bi
######################################################################## 100.0%
以上で必要なものは揃ったので、用意したものを使えるように環境変数の設定を行う。
5.環境設定変更
CordovaCLIツールを正しく機能させるために環境変数の設定する必要がある。 ダウンロードした、Android SDKの「tools」と「platform-tools」にパスを通す。
まずは現状のPATHを確認
$ echo $PATH
現在の状態が表示されます。
/usr/local/sbin:/usr/local/sbin:/Library/Frameworks/Python.framework/Versions/2.7/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
ここは人によって違うので、上記と同じでなくても気にしない。
以下のコマンドでPATHを通す。
「**USER名**」の部分は環境に合わせて変える。
$ export PATH=/Users/**USER名**/Library/Android/sdk/tools:$PATH
$ export PATH=/Users/**USER名**/Library/Android/sdk/platform-tools:$PATH
変更を適用。
$ source ~/.bash_profile
変更が適応されたかの確認。
$ echo $PATH
以下のように太青文字部分が追加されていれば完了。
/Users/USER名/Library/Android/sdk/platform-tools:/Users/USER名/Library/Android/sdk/tools:/usr/local/sbin:/usr/local/sbin:/Library/Frameworks/Python.framework/Versions/2.7/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
以上でAndroid開発の事前準備は終了。
その他にも設定が必要だけど、共通の設定なので続きは以下の記事を。
上記の記事に入る前にiOSの設定が必要なので、次回はiOSの環境を整える。Androidは結構複雑だけど、iOSは簡単なので!
6章-2 Cordovaでハイブリッドアプリ開発環境を整える【iOS】 - 【連載】ハイブリッドアプリの最新情報とその動向【Corodva】