PhoneGap and jquery Mobile portfolio to develop Android app configuration

PhoneGap and jquery Mobile combine to develop Android app configuration

For work, use PHONEGAP with jquery Moblie to develop Android apps.

These technologies themselves have not touched before, can be said to have not heard of, is really feeling, in the field of development, technology is changing rapidly, the knowledge will never learn. Even if it is to do Java development, but subdivided down, professional direction is still a lot of, I do not involve the technology or too much, from a need for a single field of professional points, knowledge-rich points. Can not do all-rounder, then we do a professional, in today's society is still necessary.

OK, let's go to the following:

PhoneGap is an open-source development framework that uses HTML,CSS and JavaScript to build cross-platform mobile applications. It enables developers to take advantage of the core features of iphone,android,palm,symbian,blackberry,windows phone and Beda smartphones-including geolocation, accelerators, contacts, sounds and vibrations.

Jquery Mobile is a front-end development framework for website and on-line applications for touch-screen smartphones and tablets, co-sponsored by the (MT) Media temple and a number of mobile device vendors and software companies. Built on jquery and the JQuery UI class library, jquery Mobile provides front-end developers with a unified UI interface system that is compatible with all major mobile device platforms. With excellent elasticity, lightweight and progressive enhancement features and accessibility.

1. First need to download PhoneGap, you can go to the following website download: http://phonegap.com/in the top right corner of the homepage has a download icon, click to download its compressed version, Now the latest version is PhoneGap1.5.0, after downloading the file name is: Phonegap-phonegap-1[1].5.0-0-gde1960d.zip.

2. After the download is complete, unzip it, it will have its introduction documents and sample files (including Android,ios,blackberry, etc.), here we only need to use Android, in the extracted files, in the Lib folder under the Android folder, We found Cordova-1.5.0.jar (which is actually the Phonegap.jar of the other site), Cordova-1.5.0.js, and an XML folder

3. Create a new Android project

4. Create a new four directory under the project's root directory.
/libs
/assets/www

/assets/css

/assets/js

5. Copy the cordova-1.5.0.js to the/assets/js directory.
6. Copy the Cordova-1.5.0.jar to the/libs directory.
7. Copy the XML folder to the/res directory.
8. Make some changes in the main Java source code file in the SRC source code file.
Changes the class from inheriting activity to inheriting droidgap.
Setcontentview () line with Super.loadurl ("file:///android_asset/www/index.html");
Add: Import com.phonegap.*;
Delete Import android.app.Activity

Import Org.apache.cordova.droidgap;import Android.os.bundle;public class App extends Droidgap {    /** called when the A Ctivity is first created. *    /@Override public    void OnCreate (Bundle savedinstancestate) {        super.oncreate (savedinstancestate);        Setcontentview (r.layout.main);        Super.loadurl ("file:///android_asset/www/index.html");}    }

The planned projects are intercepted as follows:

You don't have the jquery mobile connection at this point. Let's configure the PhoneGap first, then:

1. Add the following XML code to the Androidmanifest.xml, where you can refer to the above:

<supports-screens android:largescreens= "true" android:normalscreens= "true" android:smallscreens= "true" Android: Resizeable= "true" android:anydensity= "true"/> <uses-permission android:name= "Android.permission.CAMERA"/ > <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 "   />

2. The followingandroid:configChanges="orientation|keyboardHidden"添加到默认的activity标签中。

3. Then create a index.html document in the/assets/www/directory with the following contents:

<! DOCTYPE html>  
4. Join jquery mobile support to download: http://jquerymobile.com/blog/2012/01/26/jquery-mobile-1-0-1-released/#download,
Now the latest stable version is 1.0.1, you can download the ZIP format containing the required files compressed package, Name: Jquery.mobile-1.0.1.zip (JavaScript, CSS, and images), also download jquery-1.6.4.min.js
Download it down and unzip it. Put the jquery.mobile-1.0.1.min.css in the Assets/css directory and put Jquery.mobile-1.0.1.min.js and jquery-1.6.4.min.js in the Assets/js directory.
5. Modify Index.html
Press CTRL + C to copy the code<textarea></textarea>Press CTRL + C to copy the code
The results of the operation are as follows:
PhoneGap and jquery Mobile portfolio to develop Android app configuration