Presentation is loading. Please wait.

Presentation is loading. Please wait.

How to make it work? Doncho Minkov Telerik Academy academy.telerik.com Technical Trainer

Similar presentations


Presentation on theme: "How to make it work? Doncho Minkov Telerik Academy academy.telerik.com Technical Trainer"— Presentation transcript:

1 How to make it work? Doncho Minkov Telerik Academy academy.telerik.com Technical Trainer http://www.minkov.it

2  The Android SDK  Installation of Android SDK  Eclipse  Android SDK  Android ADT  Installation of PhoneGap  "Hello PhoneGap" project

3

4  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

5 How to start Android development?

6 1. Installing Eclipse IDE 2. Install Android SDK 3. Install the ADT plugin for eclipse 4. Add components needed for development

7  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 http://bit.ly/EclipseClassic

8  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 http://developer.android.com/sdk/index.html

9  * 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

10  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

11  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://dl- ssl.google.com/android/eclipse/ https://dl- ssl.google.com/android/eclipse/https://dl- ssl.google.com/android/eclipse/

12  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

13 Live Demo

14 How to Create a AVD?

15  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

16  Create new AVD

17  Give it some name  Better add the OS version  Add SD card sieze  Select OS version  You are done!

18 Two ways of creating

19  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

20  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

21  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

22  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 http://phonegap.com/assets/guide/manifest.jpg

23  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/mobile- web-development-with-phonegap/tags/r1.2/download https://svn.codespot.com/a/eclipselabs.org/mobile- web-development-with-phonegap/tags/r1.2/download https://svn.codespot.com/a/eclipselabs.org/mobile- web-development-with-phonegap/tags/r1.2/download

24  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

25 Live Demo

26

27  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

28  Hello World, PhoneGap!  Open the index.html and copy the following <html><head> First PhoneGap Application First PhoneGap Application <head><body> Hello PhoneGap Hello PhoneGap </body></html>  Go to Build -> Run as Android Application  The emulator should start  And the app run!

29 Live Demo

30 Questions?


Download ppt "How to make it work? Doncho Minkov Telerik Academy academy.telerik.com Technical Trainer"

Similar presentations


Ads by Google