JQuery Mobile + cordova build an Android project, jquerycordova

JQuery Mobile + cordova build an Android project, jquerycordova
1. install Android Development Environment installation, now mainly because of the lack of access to Google site, in windows in the host file to add a corresponding 74.125.195.190 dl-ssl.google.com, dl-ssl.google.com corresponding ip may change. Search for the latest IP address. Use eclipse or myeclipse to update the website information: https://dl-ssl.google.com/android/eclipse. I like a lot of tutorials on the Internet. javascordova is a framework for implementing JavaScript and background Communication (Android Java). Through the corresponding cordova plug-ins, provides the Web Front-end with the ability to call the underlying function API of the mobile platform. Cordova uses WebChromeClient to intercept the prompt content of js to call the functions of backend programs in front-end js. At the very beginning, I just downloaded the cordova source code and added the relevant java classes (I like to add only the source java class, but not the jar package for modification) and js to the android project, however, some system plug-ins are difficult to handle, so you have to reinstall cordova. 1 ). install node. js, go to the official website to download and install, and add the installation path to path 2 ). install npm, if it is the latest node. js has npm installed. You do not need to install it. Otherwise, you need to install it. 3) install cordova. Pay attention to your android sdk version and check the version. The latest version should be installed by default, the latest version requires a very high sdk version, and the classes required by the added cordova java source code are very different. A ). installing cordova npm install-g cordova@3.6.0-0.2 B ). create a cordova project cordova create hello com. example. hello HelloWorld c ). add the android platform to the hello project directory cordova platform add android d ). add the relevant content to the java source class of myeclipse hello \ platforms \ android \ CordovaLib and add the content of hello \ platforms \ android \ assets \ www to assets/www. \ res \ xml \ config. add the content in xml to res/xml e ). compile MainActivity public class MainActivity extends CordovaActivity {

@ Override

Public void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); super. loadUrl ("file: // android_asset/www/index.html") ;}} f ). authorization <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. INTERNET "/> <uses-permission android: name =" android. permission. RECEIVE_SMS "/> <uses-permission android: name =" android. permission. RECORD_AUDIO "/> <uses-permission android: name =" android. permission. RECORD_VIDEO "/> <uses-permission android: nam E = "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 "/> <uses-permission android: name =" android. permission. SEND_SMS "/> g ). start the program and you will be able to see the cordova homepage 3. JQuery Mobile is dedicated to creating a set of UI frameworks for Mobile platforms. In particular, JQuery Mobile loads all the DIV elements marked with data-role = "page" in HTML Using Ajax. The first HTML page is usually fully loaded, including the HEAD and BODY will be loaded into the DOM, and after the completion, it is the loading of other page content linked. On the second HTML page, only the content in the BODY is loaded to the first html dom in Ajax mode. In addition, not all content in the BODY of the second HTML page is loaded, but only the first DIV with the data-role = "page" attribute is loaded, other things do not have access to page rendering ). download JQuery Mobile B ). mount css, js, and images to the android Project 4. the first demonstration project 5. under the custom plug-in, this plug-in uses a button to end the application. 1 ). the plug-in defines public class ExitPlugin extends CordovaPlugin {private static final String EXIT = "exit"; @ Override public boolean execute (String action, JSONArray args, CallbackContext callbackContext) {if (EXIT. equals (action) {System. exit (0) ;}return true ;}} 2 ). xml configuration <feature name = "Exit"> <param name = "android-package" value = "com. tomsnail. webtest. exitPlugin "/> </feature> 3 ). js defines var Exit = {exitSystem: function () {cordova.exe c (function (data) {}, function (e) {}, "Exit", "exit ", [""]) ;}}; 4 ). js calls function exitSystem () {Exit. exitSystem () ;}< a href = "javascript: exitSystem ();" class = "ui-btn"> exit </a>