如何两步完成网页到Android App转换

Posted 2021-04-27 JiandaoStudio

我们可以利用Ant和Cordova将网页转换成android App

一.安装步骤
Cordova除了要安装node.js，还要安装 
1.Java 的JDK 
2.android的sdk 
3.Apache ant

jdk和sdk我这就不说如何安装，我们来说如何安装ant

1.1.安装Ant

下载地址： http://ant.apache.org/bindown1oad.cgi。进入网页之后,单击 apache ant-1 .9.4-bin.zip链接就可以下载文件 

下载之后解压缩会得到 apache-ant-l.9.4文件夹, Apache Ant不需要安装,只要将 ant.bat 所在的路径加入到系统的 Path变量中,让程序在运行时能够找到所需的文件即可。为了方便管理,我将 apache-ant-1.9.4文件夹与 android SDK放在同一个文件夹下,也就是 C\Program Files\Android、

接着,设置ApacheAnt的环境变量。如图 
然后在path后面添加%ANT_HOME%\bin\就行

1.2.安装node.js

下载地址：http://nodejs.org/ 下载好了后直接安装

1.3.通过npm安装Covdova

我们用管理员打开控制台，输入一下命令：npm install -g cordova

如： 

二. 如何发布安卓APP

步骤
1.创建项目 
2添加安卓平台 
3导入网页程序

我的网页程序是这样的：如

转换成APP的安装包是这样的

安装以后是这样的：

2.1.创建项目

   
     
     
   
 
    
cordova create he11o com.example.he11o He1loWorld 
 
    
上述命令用于创建名为 Heuoworld的项目 。请在“命令提示符”窗口中切换到要放置项目的文件夹, 例如 D:, 再执行上述命令, 就会创建 He11oWorld项目, D盘会生成 He11oWorld 文件夹。
 
   

cordova create后面添加3个参数,分别是文件夹名称(he11o) , APP id(com.example.he11o)以及 APP名称(He11oWorld) 。除了文件夹名称之外,其他两个参数可以省略,其中第二个参数 App id名称是自定义的,其格式类似于 Java的 package name,最少两层。 由于 APP id在同一个手机中或 Google Play商店都不能重复,因此大多数会用到3层,例如范例中的com.example.he11o就是定义了3层的 id名称

创建好的项目下共有6个文件夹,分别是.hooks、 merges，platforms、 plugins以及 www文件夹。其中www就是网页程序放置的文件夹。

2.2.添加 Android平台

创建了项目之后, 必须指定使用的平台, 例如 Android或 ios。

首先必须在 cMD窗口中切换到项目所在文件夹(切换文件夹的命令为 cd文件夹名称) , 输入下列语法即可创建 Android平台

cordova platform add android

2.3.导入网页程序

接着,就可以将我们制作好的网页文件,包含 html文件、图形文件等所有相关文件, 复制到 www文件夹中,首页文件名默认为 index.htm1。用户可以使用记事本之类的文本编辑器打开项目文件夹中的 config.xm1文件, 找到以下语句,将 index.htm1改为首页文件名。 
content src-“index.htm1”

2.4.创建APP

在 cMD窗口中先切换到项目所在文件夹(切換文件夹命令为 cd文件夹名称) ,执行下 
cordova run android 
这是创建APP和打开android模拟器,可以分开的

如果只想创建app安装包可以用下面的语句

cordova build

运行好后就可以在platforms/android/ant_build文件建下“APP名称+debug.apk”文件。这个就是平时的安装包，就可以放在真机上安装了。