正文  高级教程 > Web应用开发平台 >

PhoneGap, JQuery 的第一个例子

上周用PhoneGap和JQuery做了一个Android的例子。 这个例子用来说明如何读取一个应用的配置文件。 开发环境的搭建就不在这里描述了。 先看一下代码布局: 所有的工作都在assets/www/目录下面。js目录......

上周用PhoneGap和JQuery做了一个Android的例子。 这个例子用来说明如何读取一个应用的配置文件。

    开发环境的搭建就不在这里描述了。

    先看一下代码布局:

    

    所有的工作都在assets/www/目录下面。js目录包含了三个js文件:phonegap.js , jquery.js  , property.js.

    property目录下面有一个app.properties文件。这个文件里面有我们这个app要用到一些配置项。property.js的作用就是把这个配置文件的内容读出来。file.html是我们的应用的入口。

    App.java就是把file.html load进来。

   

import com.phonegap.DroidGap;
import android.os.Bundle;

public class App extends DroidGap {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        super.loadUrl("file:///android_asset/www/file.html");
    }
}

 

file.html:

 

 

<!DOCTYPE html>
<html>
  <head>
    <title>Property Files</title>

    <script type="text/javascript" charset="utf-8" src="js/phonegap.1.4.1.js"></script>
    <script type="text/javascript" charset="utf=8" src="js/jquery-1.7.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/property.js"></script>

    <script type="text/javascript" charset="utf-8">
        function init(){ 
            document.addEventListener("deviceready", onDeviceReady, false);
        }
        function onDeviceReady() {
            var prop = new PropertyObj();
            prop.loadPropertyFile();
            navigator.notification.alert("app name:" + prop.name);
        }
        
    </script>
  </head>
  <body onload="init();">
    <h1>Example</h1>
    <p>Property File</p>
  </body>
</html>

 

property.js : 

function PropertyObj(){

    this.name = "";
};

PropertyObj.prototype.getName = function() {
    return this.name;
};

PropertyObj.prototype.loadPropertyFile = function() {
	var name = "";
	$.ajax({
	    url: 'property/app.properties',
	    async: false,
            success: function(data){
              console.log("load success.");
              var propArray = data.split("\n");
              var length = propArray.length;
              for(var i=0;i<length;i++){
                  console.log(propArray[i]);   
              }
              //for example
              name = propArray[0];
	    },
	    error: function(){
	      //should use default property.
              console.log("load failed.");
            }
	});
	this.name = name;
};

 

app.properties

 

 

app=NewAPP

 

 

PhoneGap支持File类型,可以直接读取Android系统里的文件。在这里,并没有用这种方式。而是用Ajax调用的方式来读取www目录下的配置文件。这样做的好处就是配置文件和我们的程序在一个包里面,不依赖具体手机或者平台的文件目录结构。