HTML5应用 转 Android、Windows Phone 应用

一、HTML5 转 Android

目标SDK：API 20

1、新建一个 Blank Activity 的应用

2、在 AndroidManifest.xml 文件中添加联网权限

 <uses-permission android:name="android.permission.INTERNET" />

3、把生成的 HTML 应用中 index.html 所在目录的所有文件拷贝到 Android 项目的src/main/assets文件夹下（ 可以在 XXX.iml 文件中更改 assets 的存放路径，XXX 为项目名）。

4、在 Activity 中 的 onCreate 方法中添加如下代码：

WebView webview; 

//实例化WebView对象
webview = new WebView(this); 

//设置WebView属性，能够执行Javascript脚本
webview.getSettings().setJavaScriptEnabled(true); 

//加载需要显示的网页
webview.loadUrl("file:///android_asset/index.html"); 

//设置Web视图
setContentView(webview);

5、编译运行，成功！

参考链接：

将 HTML5 封装成 Android 应用 APK 文件若干方法

Android Studio 下添加assets目录

二、HTML5 转 Windows Phone

目标SDK：Windows Phone 8.0

1、创建一个 Windows Phone HTML5 App 项目

2、把生成的 HTML 应用中 index.html 所在目录的所有文件（除 images 文件夹）拷贝到 WP8 项目的 Html 文件夹下。添加到项目索引中。（可以在 MainPage.xaml.cs 文件中修改 HTML 应用的入口）

3、将 images 文件夹拷贝到 WP8 项目的 Assets 目录下。添加到项目索引。

4、在 HTML 应用中的 c2runtime.js 文件中的所有资源路径 images/XXX.png 添加前缀 ../Assets/ 。

其他

1、设置屏幕朝向

可以在 MainPage.xaml 设置屏幕朝向

2、固定网页大小

在 index.html 文件中加入如下语句

<meta name="viewport" content="width=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />

参考链接

1、HTML5 Games On Windows Phone 8

2、Hello World Windows Phone 8 App

3、Windows Phone Platform Guide

4、WP8 应用开发