<景品表示法に基づく表記 > 本サイトのコンテンツには、商品プロモーションが含まれている場合があります。

android

MacBookPro RetinaにEclipseをインストールしてPhoneGapを使えるようにする方法

スポンサードリンク

環境

Mac OX 10.8
Eclipse Classic 4.2
PhoneGap 2.0

Eclipseをダウンロード〜ADTプラグインのインストール

Eclipseをダウンロードする。
Eclipse Downloads

Eclipse Classic 4.2,Mac OS 64bitを選択。
ダウンロードしたら解凍する。

Eclipse1
Eclipse2

解凍したeclipseフォルダをアプリケーションフォルダへ移動させる。(場所はどこでも良い。)

起動時には、解凍したeclipseフォルダにある「Eclipse.app」をダブルクリックして起動する。

Eclipse3

Android SDKをダウンロードして設定する

Eclipse用ADTプラグインを設定する。
解凍したeclipseフォルダにある「Eclipse.app」をダブルクリックして起動する。

初回時はeclipseのworkspaceを決める。
変更する必要があれば、変更する。
「OK」をクリックする。

Help > Install New software

「Add」のボタンをクリック。

リポジトリを追加する。
名前:
自分で判別できるものにして
URL:

https://dl-ssl.google.com/android/eclipse/

にする。

すべてのtoolsにチェックを入れて、「Next」をクリック。

Install

「Next」をクリックして進むとライセンスの許諾があるので
「I accept the terms of the license agreements」を選び、「Finish」をクリックする。

Security Warningがでたら「OK」をクリックして進む。

Security WarningSoftware Updates がでたら「Yes」をクリックしEclipseを再起動する。

Software Updates
再起動後、Android SDKを新しくインストールするか聞かれる。
新しくインストールする場合にはチェックをつけて「Finish」をクリックする。

Welcome to Android Development

「Accept All」を選び、「Install」をクリックする。

Choose Packages to Install

PhoneGapをダウンロード〜Eclipseの設定

正規手順

Apache Cordova API Documentation
PhoneGap のサイトへ移動して
PhoneGapをダウンロードする。

PhoneGap | Download & Archives

PhoneGap1

Eclipseのメニューから
File > project でアンドロイドプロジェクトを作成する。

作成後はダウンロードしたPhoneGapのファイルから必要なものをEclipeのプロジェクトへコピーする。

[1]フォルダを作る
/libs
assets/www
res/xml

[2]
PhoneGapのファイルを開き、
lib/android/example/の下にサンプル用のファイルがあるのでこれをEclipseへコピーする。

assets/www にPhoneGapのファイルから example/assets/www/cordova-2.0.0.jsをコピーする。
/libsにPhoneGapのファイルからexample/assets/libs/cordova-2.0.0.jar をコピーする。
xmlフォルダにPhoneGapのファイル xml/config.xmlをコピーする。

[3]
EclipseのPackage Explorer(フォルダが階層表示されている部分)で
/libs/cordova-2.0.0.jarを選択して右クリック。
Build Path(ビルドパス)/Add To Build Path(ビルドパスに追加)を選択。

[4]
assets/wwwの下に下記htmlを入力したindex.htmlを作成。
もしくはサンプルよりコピー。
[code]
<!DOCTYPE HTML>
<html>
<head>
<title>PhoneGap</title>
<script type="text/javascript" charset="utf8" src="cordova-2.0.0.js"></script>
</head>
<body>
<h1>Hello PhoneGap</h1>
</body>
</html>
[/code]

[5]
src/com.*****/MainActivity.java
の中身を変更。

追加

import org.apache.cordova.*;

変更

classのextendをActivityからDroidGap
setContentView() からsuper.loadUrl("file:///android_asset/www/index.html");

Java

[6]
AndroidManifest.xml を右クリックし
Open With > Text Editorを選ぶ。

下記ソースを追加。
[code]
<supports-screens
android:largeScreens="true"
android:normalScreens="true"
android:smallScreens="true"
android:resizeable="true"
android:anyDensity="true" />
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.GET_ACCOUNTS" />
<uses-permission android:name="android.permission.BROADCAST_STICKY" />
[/code]

activityタグの下記ソースを変更

android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale"

AndroidManifest.xmlが下の画像のようになればいい。

Manifest

画像は
Apache Cordova API Documentationより

[6]テストビルド
パッケージを選択して、右クリック > Run As > Android application
を選択してテスト用シュミレーターもしくは実機をUSB接続して、テストビルドする。

テスト用シュミレーター機を作成していない場合は作成することになる。

[7]ページ追加等
assets/www/の下にWEBページを作る感覚でhtmlを作成することで
アプリのページを増やすことができる。

ダウンロードしたPhoneGapのサンプルindex.htmlをビルドした場合は
PhoneGapの機能を試すことができる。

細かい機能は本家の日本語docmentで確認できる。
Apache Cordova API Documentation

ちなみにxml/config.xmlを入れ忘れてアプリを起動させると

[ERROR]Error initializing Cordova: Class not found

とエラーがでます。

Device

参照URL

Eclipse×PhoneGapでAndroidアプリ開発! ~インストールからアプリ実行まで (1/3):CodeZine

スポンサードリンク

おすすめ記事一覧

今月のおすすめプラグインセール! 1

今月のおすすめプラグインセール! DTMで使えるVST/AU/AAX対応プラグインのセール情報ページです。※価格は為替レートで変動します。 DTMプラグイン購入サイト プラグインが購入できるサイトはいくつかありますが、その中でもpluginboutiqueを激推しします。 購入したプラグインのアップデート管理、購入後のポイント利用、毎月変わる購入時のおまけプラグインと特典がもりだくさんです。 pl ...

2

DTMで使えるVST/AU/AAX対応プラグインのセール情報ページです。 このページで紹介しているセール情報はほんの一部。 今すぐセール会場を見るにはこちら >> pluginboutique年末セール会場はこちら >> bestservice年末セール会場はこちら >> ※随時更新予定 ※表示価格は為替レートで変動します。 おすすめの年末DTMセール Solid State Logic SSL ...

3

Scaler2とは? Scaler2はコード進行を作るときに必要となる機能を網羅しているプラグインです。 作曲していてこんな悩みはありませんか? 例えば このコード良いな!と感じたときにどんな構成音かわからなくて鍵盤が押さえられない コード進行を考えているときに前後の順番を入れ替えたかったけど、入れ替えるのが面倒 コード進行を聞いてみて良いものを選びたい 同じコード進行だけどキーを変えて聞いてみた ...

4

「Instacomposer」はメロディ、ベース、パッド、コードのパターンを最大5トラック同時にMIDI作成できる作曲補助ツールです。 買っても大丈夫!? Instacomposer について Instacomposer サウンドチェック https://youtu.be/eXa1ix1xJdg https://youtu.be/ecOwMJxam9o Instacomposer で作曲の苦手意識 ...

-android
-, ,