欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

WP7 Mango HTML5开发体验(二)PhoneGap运行机制

程序员文章站 2022-04-12 09:22:44
  一、前言 phonegap是一个开源的开发框架,用来构建跨平台的使用html,css和javascript的移动应用程序 二、前期准备 下载phonegap: &n...

 

一、前言

phonegap是一个开源的开发框架,用来构建跨平台的使用html,cssjavascript的移动应用程序

二、前期准备

下载phonegap:  点击右上角的

WP7 Mango HTML5开发体验(二)PhoneGap运行机制获得压缩包,解压到任意目录。

WP7 Mango HTML5开发体验(二)PhoneGap运行机制

三、运行example和tests

1.打开WP7 Mango HTML5开发体验(二)PhoneGap运行机制,选择gapexample.sln用vs2010打开。

2.观察目录结构如下图所示:

WP7 Mango HTML5开发体验(二)PhoneGap运行机制

3.编译并在模拟器中运行,运行结果如下所示:

WP7 Mango HTML5开发体验(二)PhoneGap运行机制

我们可以看到phonegap当前版本有很多基础特色功能,包括js api去使用wp7 mango特性,例如:报警或提醒框(alert,confirm)媒体捕获(图片和视频)等。

4.打开WP7 Mango HTML5开发体验(二)PhoneGap运行机制,选择mobilespecunittests.sln用vs2010打开。

5.编译并在模拟器中运行,运行结果如下所示:

WP7 Mango HTML5开发体验(二)PhoneGap运行机制

我们可以在phonegap单元测试中看到phonegap使开发者能够利用windows phone智能手机的核心功能——包括地理定位,加速器,联系人等。

四、运行机制

在www文件夹下的html / js / css包括图片等所有的资源都将被打包成xap部署到手机上,但不能在运行时直接访问,因为需要一个额外的unpackaging步骤。 
当应用程序首次运行时,www文件夹下的所有资源都从xap isolatedstorage转化成二进制数据。(isolatedstorage是每个应用程序存储数据的位置。 isolatedstorage由应用程序管理,不同的应用程序的isolatedstorage彼此隔离。)

unpackaging www文件夹的内容之后,www / index.html文件加载到嵌入式无头的ie9中。由ie9执行html和js代码。

1.在gapexample项目中双击打开

WP7 Mango HTML5开发体验(二)PhoneGap运行机制可以清楚的看到phonegap添加了一个无头的ie9浏览器:

WP7 Mango HTML5开发体验(二)PhoneGap运行机制

2.phonegap如何得知资源信息

xml文件gapsourcedictionary.xml存储了所有资源的位置和名称。下面的代码负责读取gapsourcedictionary.xml的内容

 

 

view sourceprint?

streamresourceinfo streaminfo = application.getresourcestream(new uri("gapsourcedictionary.xml", urikind.relative));

 

               if (streaminfo != null)

               {

                   streamreader sr = new streamreader(streaminfo.stream);

                   //this will read keys collection for the xml file

 

                   xdocument document = xdocument.parse(sr.readtoend());

 

                   var files = from results in document.descendants("filepath")

                                select new

                                {

                                    path = (string)results.attribute("value")

                                };

                   streamresourceinfo fileresourcestreaminfo;

 

 

 

                   using (isolatedstoragefile appstorage = isolatedstoragefile.getuserstoreforapplication())

                   {

 

                       foreach (var file in files)

                       {

                           fileresourcestreaminfo = application.getresourcestream(new uri(file.path, urikind.relative));

 

                           if (fileresourcestreaminfo != null)

                           {

                               using (binaryreader br = new binaryreader(fileresourcestreaminfo.stream))

                               {

                                   byte[] data = br.readbytes((int)fileresourcestreaminfo.stream.length);

 

                                   string strbasedir = file.path.substring(0, file.path.lastindexof(system.io.path.directoryseparatorchar));

                                   appstorage.createdirectory(strbasedir);

 

                                   // this will truncate/overwrite an existing file, or

                                   using (isolatedstoragefilestream outfile = appstorage.openfile(file.path, filemode.create))

                                   {

                                       debug.writeline("writing data for " + file.path + " and length = " + data.length);

                                       using (var writer = new binarywriter(outfile))

                                       {

                                           writer.write(data);

                                       }

                                   }

 

                               }

                           }

                           else

                           {

                               debug.writeline("failed to write file :: " + file.path + " did you forget to add it to the project?");

                           }

                       }

                   }

               }

3.为什么启动页面必须是www/index.html

 

通过

	uri indexuri = new uri("www/index.html", urikind.relative);
                this.gapbrowser.navigate(indexuri);


得知phonegap采用硬编码的方式将启动页面写死了,相信以后的版本会通过配置文件更改吧,现在大家还是按它写的来吧!

版权所有WP7 Mango HTML5开发体验(二)PhoneGap运行机制欢迎转载