Einrichtung von Phonegap

Download und Installation der benötigten Software (falls noch nicht geschehen)

Android Packages installieren

Im entpackten "ADT Bundle"-Ordner den 'SDK Manager' starten und folgende Pakete (falls noch nicht geschehen) auswählen und installieren:

Android Projekt erstellen

Im entpackten "ADT Bundle"-Ordner Eclipse (eigentlich 'Android Developer Tools') starten und ein neues "Android Application Project" unter dem Menüpunkt "File->New->Android Application Project" anlegen. Gib deiner Anwendung einen Namen und klicke dich nun mit "Next" durch den Wizard. Belasse dabei alle Einstellungen so, wie sie sind. Klicke im letzten Fenster auf "Finish".

Android Projekt für PhoneGap konfigurieren (Teil 1)

In Eclipse wird dir links im Package Explorer dein Projekt angezeigt. Darin befinden sich unter anderem die Ordner assets, libs und res. Erstelle unter assets einen weiteren Ordner namens www (durch Rechtsklick auf den Projektnamen und New->Folder). Kopiere nun aus dem PhoneGap-Verzeichnis

<PhoneGap-Verzeichnis>\lib\android
die Datei ''cordova.js'' in den Ordner assets/www. Als nächstes die Datei ''cordova.jar'' (kann Versionsangabe im Namen enthalten) in den Ordner libs kopieren. Nun den kompletten Ordner xml in den Projektordner res kopieren. Den Ordner libs im Android-Projekt rechtsklicken und unter dem Menüpunkt Build Path den Unterpunkt Configure Build Path... auswählen. Unter dem Reiter Libraries den Button Add JARs... klicken und im neuen Fenster aus dem lib Ordner die Datei cordova.jar (kann Versionsangabe im Namen enthalten) auswählen. Mit "OK" bestätigen.

Android Projekt für PhoneGap konfigurieren (Teil 2)

Unterordner solange, bis du auf eine Datei mit der Endung ".java" stößt (z.B. MainActivity.java). Öffne diese Datei durch einen Doppelklick. Klappe mit dem kleinen Plus den import Bereich aus und ergänze import org.apache.cordova.*;, ersetze anschließend in der Zeile, die mit "public class" beginnt hinter extends das Wort Activity durch DroidGap sowie bei der Methode protected void onCreate(Bundle savedInstanceState) das Schlüsselwort protected durch public. Außerdem noch ein paar Zeilen weiter unten setContentView() durch

super.loadUrl("file:///android_asset/www/index.html");
ersetzen. Die Datei sollte nun so ähnlich aussehen, wie unten dargestellt.
package de.test;

import org.apache.cordova.*;
import android.os.Bundle;

public class MainActivity extends DroidGap
{
 @Override
 public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		super.loadUrl("file:///android_asset/www/index.html");
	}
}
Anschließend kann die Datei gespeichert und geschlossen werden. Nun die Datei AndroidManifest.xml öffnen, am unteren Rand die XML-Ansicht (ganz rechts) wählen und folgenden Text zwischen die Tags <uses-sdk.../> und <application.../>kopieren:
<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" />
Außerdem ist noch die folgende Zeile als Attribut in den Tag <activity> zu kopieren:
android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale"
Die AndroidManifest.xml sollte nun ungefähr so aussehen:
<?xml version="1.0" encoding="utf-8"?>
	<manifest xmlns:android="http://schemas.android.com/apk/res/android"
	    package="de.test"
	    android:versionCode="1"
	    android:versionName="1.0" />

	    <uses-sdk
	        android:minSdkVersion="8"
	        android:targetSdkVersion="18" />

	    <supports-screens
	        android:anyDensity="true"
	        android:largeScreens="true"
	        android:normalScreens="true"
	        android:resizeable="true"
	        android:smallScreens="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" />

	    <application
	        android:allowBackup="true"
	        android:icon="@drawable/ic_launcher"
	        android:label="@string/app_name"
	        android:theme="@style/AppTheme">
	        <activity
	            android:name="de.test.MainActivity"
	            android:label="@string/app_name"
	            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" >
	            <intent-filter>
	                <action android:name="android.intent.action.MAIN" />

	                <category android:name="android.intent.category.LAUNCHER" />
	            </intent-filter>
	        </activity>
	    </application>
	</manifest>
Anschließend die Datei speichern und schließen. Abschließend im Projektverzeichnis unter assets/www eine HTML-Datei mit dem Namen index.html anlegen. In dieser Datei kann nun die Android-Anwendung entwickelt werden.

App starten

In die index.html folgenden Inhalt eintragen und speichern:

<!DOCTYPE HTML>
<html>
	<head>
		<title>My First App</title>
		<script src="cordova.js"</script>
		<script>
			function onLoad()
			{
				document.addEventListener("deviceready", onDeviceReady, true);
			}
			function onDeviceReady()
			{
				navigator.notification.alert("PhoneGap is working!");
			}
		</script>
	</head>
		<body onload="onLoad();">
		<h1>Welcome to PhoneGap</h1>
		<h2>edit assets/www/index.html</h2>
	</body>
</html>
Im Package Explorer Rechtsklick auf den Projektnamen und im Menüpunkt "Run As" das Untermenü "Android Application" wählen. Eventuell ist noch ein Android Virtual Device (AVD) einzurichten. Für die Nutzung eines "echten" Smartphones ist der entsprechende Treiber für das Gerät zu installieren. Der Standard-Google-Treiber ist auch im Anhang dieses Blockeintrages zu finden. Der Package Explorer sollte nun ungefähr so aussehen: