android之phonegap入門

時間 2019-12-01

標籤 android phonegap 入門欄目 Android 简体版

原文原文鏈接

利用phoneGap能夠利用HTML開發安卓應用，是web app的一種，能夠有效的提升開發效率，下降開發成本。

第一步：

開發環境配置以及基本操做請參考其它文檔.

新增一個名爲 phoneGap 的android項目,將主activity命名爲:PhoneGapActivity.java

從下載好的 phonegap 找到 lib\android,(下載地址記不太清了,google callback-phonegap-0d1f305)

按照如下目錄分別複製到android 項目

assets\www\phonegap-1.4.1.js

res\xml\phonegap.xml

res\xml\plugins.xml

libs\phonegap-1.4.1.jar

以上路徑除了www外,其它都是必須路徑,不能更更名字,沒有文件夾就建立一個

第二步：建立完成後複製如下代碼到AndroidManifest.xml ,這些代碼爲程序提供權限,固然咱們如今用不了這麼多權限,可是加進去總沒錯.

<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" />

修改MainActivity

添加完成後,找到咱們的主activity PhoneGapActivity.java 找到onCreate方法,

替換setContentView(R.layout.main);super.loadUrl(「http://baidu.com「);或者super.loadUrl(「file:///android_asset/www/index.html」);

第四步：寫index.html文件

其中包括要調用的方法，和調用成功以後返回的方法，分爲成功方法與失敗方法

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-type" name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
    <title></title>

         <script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"> </script>
         <script type="text/javascript" charset="utf-8" src="test.js"> </script>
         <script type="text/javascript"> function test1() { alert("HelloWorld"); navigator.hmCommen.test(successCallback,errorCallback,{}); } function testlogin(name,age) { //navigator.hmCommen.testLogin(successCallback,errorCallback,{}); navigator.hmCommen.testLogin(successCallback,errorCallback,{"name":name,"age":age}); } function successCallback() { alert("Success"); } function errorCallback() { alert("failed"); } function test2() { alert("hello world"); } </script>
     </head>
     <body>
         <h1>Hello World</h1>
         <button type="button" onclick="test2()">Hello Worold</button>
         <button type="button" onclick="test1()">call me</button>
         <button type="button" onclick="testlogin('abc',12)">login test</button>
     </body>
 </html>

第五步：寫js文件

/* * PhoneGap is available under *either* the terms of the modified BSD license *or* the * MIT License (2008). See http://opensource.org/licenses/alphabetical for full text. * * Copyright (c) 2005-2010, Nitobi Software Inc. * Copyright (c) 2010-2011, IBM Corporation */

if (!PhoneGap.hasResource("hmCommen")) {
PhoneGap.addResource("hmCommen");

/** * This class contains information about the current network Connection. * @constructor */
var HmCommen = function() {

};



/** * Get connection info * * @param {Function} successCallback The function to call when the Connection data is available * @param {Function} errorCallback The function to call when there is an error getting the Connection data. (OPTIONAL) */
HmCommen.prototype.test = function(successCallback, errorCallback,options) {
    // Get info
    PhoneGap.exec(successCallback, errorCallback, "HM_service", "test", [options]);
};

HmCommen.prototype.testLogin = function(successCallback, errorCallback,options) {
    // Get info
    PhoneGap.exec(successCallback, errorCallback, "HM_service", "testLogin", [options]);
};


PhoneGap.addConstructor(function() {
    if (typeof navigator.hmCommen === "undefined") {
        navigator.hmCommen = new HmCommen();
    }

});
}

第六步：配置XML文件

在plungs.xml中添加

<plugin name="HM_service" value="com.zj.phonegaptest.HMTest"/>

注意，第五步中對象必須與XML中配置的相同，value即爲要調用的類，這樣才知道要調用哪個類

第七步：寫實現類

package com.zj.phonegaptest;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import android.widget.Toast;

import com.phonegap.api.*;


public class HMTest extends Plugin {

    @Override
    public PluginResult execute(String arg0, JSONArray arg1, String arg2) {
        // TODO Auto-generated method stub
        JSONObject arg=arg1.optJSONObject(0);
        if(arg0.equalsIgnoreCase("test"))
        {
            return doTest();
        }else if(arg0.equalsIgnoreCase("testLogin"))
        {
            try {
                return testLogin(arg);
            } catch (JSONException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
        }
        return null;
    }


    private String name=null;
    private int age=0;
    PluginResult pluginResult=null;

    private PluginResult testLogin(JSONObject arg) throws JSONException
    {
     name=(String)arg.get("name");
     age=arg.getInt("age");
     if("abc".equals(name))
    {
         pluginResult=new PluginResult(PluginResult.Status.OK);
    }else
    {
        pluginResult=new PluginResult(PluginResult.Status.OK);
    }

     return pluginResult;
    }

    private PluginResult doTest()
    {
        pluginResult=new PluginResult(PluginResult.Status.OK);
        return pluginResult;
    }

}