×
Namespaces

Variants
Actions
(Redirected from 开发Series 40 web app)

开发Nokia Asha web app

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata

兼容于
平台:
Series 40

文章
max.chen 在 08 Apr 2011 创建
最后由 hamishwillee 在 09 May 2013 编辑

Nokia Web Tools是基于Eclipse的IDE,所以对大多数开发者来说并不陌生。这里我们利用Nokia Web Tools内置的News web app模板创建一个简单的Series 40 web app。

Contents

生成项目

首先,如下图所示,依次选择File-> New -> Series 40 web app (wgt)。


Howtos40webapp 1.PNG

在弹出的窗口中可以看到4个模板,在这里我们选择最后一个“News web app project”,然后点击“Next”。

Howtos40webapp 2.PNG

在接下来的窗口中填入项目名称,工程的位置,程序显示的名称、唯一标识和版本号。要注意到是,“Enable Home Screen”选项是针对Symbian WRT的,Series 40 web apps并不支持这个选项。

Howtos40webapp 3.PNG

最后,需要填入一些和项目相关的设置,包括主HTML文件名称、RSS种子的地址和一些其他相关信息。点击“Finish”后,项目就自动生成了。

Howtos40webapp 4.PNG

编辑文件

在“Project Explorer”中,我们可以看到模板已经为我们生成了一些目录和文件,

Howtos40webapp 5.PNG

其中:

  • css目录中存放web app中使用的CSS文件。
  • images目录中放web app中使用的图片文件。
  • js目录中放web app中使用的JavaScript文件。
  • config.xml是项目的配置文件。
  • index.html是web app的入口。

如果想进行编辑,只需在“Project Explorer”里双击那个文件,这里以index.html为例。

Howtos40webapp 6.PNG

从中可以看出在index.html中最主要的方法就是:

getRSS('verview', 'horview', 'http://feeds2.feedburner.com/time/topstories');

而getRSS()方法我们是在js/getRSS.js中定义的。这个方法通过AJAX获取网络上的RSS文件。

/**
* Use xmlhttpreq to get the raw rss xml
*/

function getRSS(vid, hid, url){
var xhr;
var rssfeed = url;
 
//call the right constructor for the browser being used
if (window.ActiveXObject)
xhr = new ActiveXObject("Microsoft.XMLHTTP");
else
if (window.XMLHttpRequest)
xhr = new XMLHttpRequest();
else
alert("AJAX request not supported");
 
//prepare the xmlhttprequest object
xhr.open("GET", rssfeed, true);
xhr.setRequestHeader("Cache-Control", "no-cache");
xhr.setRequestHeader("Pragma", "no-cache");
xhr.onreadystatechange = function(){
if (xhr.readyState == 4) {
if (xhr.status == 200) {
if (xhr.responseText != null) {
processRSS(xhr.responseXML, vid, hid);
}
else {
alert("Failed to receive RSS file from the server - file not found.");
return false;
}
}
else {
alert("Error code " + xhr.status + " received: " + xhr.statusText);
}
}
}
 
//send the request
xhr.send(null);
 
}

预览web app

在WDE中已经集成了Web App Simulator (WAS)模拟器,用来在PC上模拟web app的运行。预览一个web app只需在项目上点击鼠标右键,然后在弹出菜单上选择“Preview web app”

Howtos40webapp 7.PNG

模拟器运行后,web app就会显示在屏幕上。需要注意到是,在运行web app时必须保证网络的连接通畅。

Howtos40webapp 8.PNG


相关链接

This page was last modified on 9 May 2013, at 13:54.
218 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×