Download Android SDK and PhoneGap - mobile

Android SDK
How to make it work?
Doncho Minkov
Technical Trainer
http://www.minkov.it
Telerik Academy
academy.telerik.com
Table of Contents
 The Android SDK
 Installation
of Android SDK
 Eclipse
 Android SDK
 Android ADT
 Installation
of PhoneGap
 "Hello PhoneGap" project
The Android SDK
The Android SDK
 Android is
a software stack for mobile devices
that includes
 An operating system
 Middleware
 Key applications
 The Android SDK provides
necessary tools and
APIs to develop applications
 Using Java programming language
Installation of Android SDK
How to start Android development?
Steps for Installing Android SDK
1.
Installing Eclipse IDE
2.
Install Android SDK
3.
Install the ADT plugin for eclipse
4.
Add components needed for development
Eclipse
 What is Eclipse?
 A multi-language software development
environment comprising
 An integrated development environment (IDE)
 Mostly written in Java
 Eclipse is used to develop applications
 In Java, C, C++, Perl, PHP, Python, R, etc.
 For Android (using Java)
 Download at http://bit.ly/EclipseClassic
Android SDK
 For the Android SDK to be installed
 The machine should have at least jdk 1.6
 Version 1.7 is also ok
 Then download the installer file from
 http://developer.android.com/sdk/index.html
Android SDK (2)
 * There is a known bug during installation
of
the SDK
 The installer cannot locate the jdk
 Just click the "Back" button and then "Next"
 It should work
The Android SDK Manager
 After the installation
of Android SDK
 Some components should be installed
 Packages for Android versions: 2.1, 2.2, 3.2, etc.
 Some other tools like a couple of Google APIs
 Start
the Android SDK Manager and wait for
fetching of packages
 This may take a while
 Took me two / thirds of a day for all packages
Installation of ADT Plugin
 Use the Update Manager feature of Eclipse
 To install the latest revision of ADT on your
development computer
 How to download it?
 Start Eclipse, then select Help > Install New
Software -> Add, in the top-right corner
 In the Add Repository
 Enter "ADT Plugin" for the Name
 Copy for location https://dlssl.google.com/android/eclipse/
Installation of ADT Plugin
 In the Available Software dialog
 Select the checkbox next to Developer Tools
and click Next
 In the next window, you'll see a list of the tools
to be downloaded
 Click Next
 Read and accept the license agreements
 Then click Finish
 Restart Eclipse
Installation of Android SDK
Live Demo
Android Virtual Device
How to Create a AVD?
Android Virtual Device
 To create virtual
device
 Open Eclipse -> Window -> ADV Manager
 Open the Android Virtual Device manager
 Add new device
 With the Android OS version needed
 Why need AVD?
 To test your app before deployment to a phone
 To test on different versions of Android OS
 To find and correct simple mistakes
AVD Manager - Example
 Create new AVD
AVD Manager - Example
 Give it some name
 Better add the OS version
 Add SD card sieze
 Select OS version
 You are done!
New PhoneGap Project
Two ways of creating
PhoneGap Project
 How to create a PhoneGap Project?
 Create an android project
 File -> New -> Android Project
 In the root directory of the project, create two
new directories
 /libs and /assets/www
 Copy phonegap.js from your PhoneGap
download earlier to /assets/www
 Create an index.html file in /assets/www
 Copy phonegap.jar from your PhoneGap
download earlier to /libs
New PhoneGap Project
 Copy xml folder from your PhoneGap
download to /res
 Set the build path of the phonegap.jar
 Right click on the /libs folder
 Go to Build Paths/ -> Configure Build Paths.
 In the Libraries tab, add phonegap-1.0.0.jar to
the Project
New PhoneGap Project (2)
 Make a few adjustments to the project's main
Java file
 Change the class's extend from Activity to
DroidGap
 Replace the setContentView() line with
super.loadUrl("file:///android_asset/www/index.
html");

Add import com.phonegap.*

Remove import android.app.Activity
New PhoneGap Project (3)
 Right click
on AndroidManifest.xml and select
Open With > Text Editor
 You should edit the xml
 By adding new elements
 By editing existing elements
 You can see how the final AndroidManifest.xml
file should look like
 http://phonegap.com/assets/guide/manifest.jpg
New PhoneGap Project Alternative Way
 This is
not so pleasing, right?
 Hopefully there is an easier way
 Using MDS AppLaud PhoneGap Eclipse Plugin
 How to install
it?
 Open Eclipse
 Go to Help -> Install New Software -> Click Add
 Like with the ADT plugin
 For location type: https://svn.codespot.com/a/eclipselabs.org/mobileweb-development-with-phonegap/tags/r1.2/download
New PhoneGap Project –
Alternative Way (2)
 After the plugin is installed
and ready to go
 A PhoneGap icon should be displayed in the
toolbar
 After than the creation of new project is
straight-forward
 With AppLaud plugin you can select to include
jQuery or Sencha
New PhoneGap Project
Live Demo
Hello World PhoneGap
Hello World PhoneGap
 Lets make our "Hello World, PhoneGap!"
application
 Till now we have an empty PhoneGap project
 All we need to do is to edit the index.html file
 Created by us
 Located in /assets/www
 This is the Entry point of our Application
Hello World PhoneGap –
Example

Hello World, PhoneGap!
 Open the index.html and copy the following
<!Doctype html>
<html>
<head>
<title> First PhoneGap Application </title>
<head>
<body>
<h1>Hello PhoneGap</h1>
</body>
</html>

Go to Build -> Run as Android Application
 The emulator should start
 And the app run!
Hello World PhoneGap
Live Demo
Android SDK and PhoneGap
Questions?