原生app的开发成本和网页相比相对较高,所以越来越多的app使用网页来作为界面,甚至完全将一个网站封装成app,可以提高开发速度,还能基本实现跨平台。

下面以Android为例,在ubuntu-14.04.4-desktop-amd64环境实现一个简单的WebView封装网站成app的过程。

环境准备

开发环境需要Java SDK(官网下载),Android SDK(官网下载)。

Java SDK安装

wget http://download.oracle.com/otn-pub/java/jdk/8u91-b14/jdk-8u91-linux-x64.tar.gz
tar -x -f jdk-8u91-linux-x64.tar.gz

然后配置PATH路径及JAVA_HOME

vi ~/.bashrc

在最后添加

export JAVA_HOME=JDK解压目录
export CLASSPATH=.:$CLASSPATH:$JAVA_HOME/lib
export PATH=$PATH:$JAVA_HOME/bin

保存退出vi,刷新配置

source ~/.bashrc

Android SDK安装

ps:安装过程中可能需要梯子,请自备。

wget https://dl.google.com/android/android-sdk_r24.4.1-linux.tgz
tar -x -f android-sdk_r24.4.1-linux.tgz
cd android-sdk-linux/tools

先看一下有哪些sdk版本可以安装

./android list sdk

然后安装需要的sdk版本

./android update sdk --no-ui --filter 用逗号分隔需要安装的序号

项目建立及代码编写

在任意地方新建一个目录,保存这个项目,然后新建一个src目录,用于存放源文件。因为Java有包的概念,所以进入src目录后,根据包名的层次,依次建立相应目录,然后新建Java源程序文件,比如:

 package test.android;

 import android.app.Activity;
import android.os.Bundle;
// import android.app.AlertDialog;
import android.view.Window;
// import android.view.WindowManager;
import android.view.KeyEvent;
import android.webkit.WebView;
import android.webkit.WebViewClient;
//import android.webkit.WebChromeClient;
// import android.webkit.JsResult;
// import android.content.DialogInterface;
// import android.content.DialogInterface.OnClickListener; public class Main extends Activity {
public static final String LOAD_URL = "http://www.baidu.com/"; private WebView webView = null; public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); //this.requestWindowFeature(Window.FEATURE_NO_TITLE);
//this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); webView = new WebView(this);
this.setContentView(webView);
webView.setWebViewClient(new WebViewClient() {
public void onPageFinished(WebView view, String url) {
//webView.evaluateJavascript("test();", null);
}
});
/*
webView.setWebChromeClient(new WebChromeClient() {
public boolean onJsAlert(WebView view, String url, String message, JsResult result) { new AlertDialog.Builder(_this)
.setMessage(message)
.setPositiveButton("OK", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int which) {}
}).show(); return true;
}
});
*/
webView.getSettings().setJavaScriptEnabled(true);
webView.addJavascriptInterface(this, "native");
webView.loadUrl(LOAD_URL);
} // overwrite back button
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (KeyEvent.KEYCODE_BACK == keyCode && webView.canGoBack()) {
webView.goBack();
return true;
} return super.onKeyDown(keyCode, event);
} }

将文件保存为Main.java

回到项目根目录,新建另一个文件,保存为AndroidManifest.xml,内容如下:

 <?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="test.android">
<application android:icon="@drawable/icon"
android:label="@string/app_name">
<activity android:name=".Main">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application> <uses-permission android:name="android.permission.INTERNET" /> </manifest>

在项目根目录新建res目录,在res内新建drawable和values目录。

在values内新建xml文件strings.xml,内容如下:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">网页打包</string>
<string name="web_url">http://www.baidu.com</string>
</resources>

然后将需要的程序图标拷入drawable目录,文件名为icon.png

演示示例可以从这里下载

编译

先切换到项目目录。

首先要编译资源,在项目根目录创建gen目录,保存生成的R.java资源编号,在控制台输入以下命令:

/opt/android-sdk-linux/build-tools/24.0./aapt package -f -m -J gen -S res -I /opt/android-sdk-linux/platforms/android-/android.jar -M AndroidManifest.xml

编译java源文件时,加入R.java源文件:

javac -encoding utf-8 -source 1.6 -target 1.6 -bootclasspath /opt/android-sdk-linux/platforms/android-24/android.jar -d bin/classes src/test/android/Main.java gen/test/android/R.java

将编译好的文件打包成dex格式

/opt/android-sdk-linux/build-tools/24.0.0/dx --dex --output=bin/classes.dex bin/classes

将资源文件打包

/opt/android-sdk-linux/build-tools/24.0.0/aapt package -f -M AndroidManifest.xml -S res -I /opt/android-sdk-linux/platforms/android-24/android.jar -F bin/main.ap_

将所有文件打包成apk

java -classpath /opt/android-sdk-linux/tools/lib/sdklib.jar com.android.sdklib.build.ApkBuilderMain main_unsigned.apk -v -u -z bin/main.ap_ -f bin/classes.dex -rf src

生成签名文件

1 keytool -genkey -alias my.keystore -keyalg RSA -validity 20000 -keypass 123456 -storepass 123456 -keystore my.keystore

生成签名文件时,提示输入姓名单位之类都可以直接回车忽略,最后输入y确认即可

对apk文件签名

jarsigner -verbose -keystore my.keystore -keypass 123456 -storepass 123456 -signedjar main.apk main_unsigned.apk my.keystore

接下来就可以安装测试了

 
 
 

Android使用WebView打包网页成app的更多相关文章

  1. Android中webView和网页的交互

     Android中webView和网页的交互 Android中webView跟网页的交互式通过JavaScript进行的.具体步骤: 1.创建JavaScript,在点击的时候调用JavaScript ...

  2. Android 使用WebView显示网页

    构建WebView就可以显示Web信息.因为我觉得这里会讲述很多方式来实现WebView,所以我决定为每一种方式创建一个对应的Activity,MainActivity通过Button可以点击进入对应 ...

  3. android通过webview调起支付宝app支付

    webview在加载网页的时候会默认调起手机自带的浏览器加载网页,用户体验不好.但当用户设置浏览器客户端(setWebViewClient)设置这样的监听事件之后,当请求url的时候就不会打开手机自带 ...

  4. android 通过webview调起支付宝app支付

    网站学习:http://blog.csdn.net/zhuyu19911016520/article/details/71763900

  5. Android应用安全开发之浅谈网页打开APP

    一.网页打开APP简介 Android有一个特性,可以通过点击网页内的某个链接打开APP,或者在其他APP中通过点击某个链接打开另外一个APP(AppLink),一些用户量比较大的APP,已经通过发布 ...

  6. Android的WebView控件载入网页显示速度慢的究极解决方案

    Android的WebView控件载入网页显示速度慢的究极解决方案 [转载来源自http://hi.baidu.com/goldchocobo/] 秒(甚至更多)时间才会显示出来.研究了很久,搜遍了国 ...

  7. 【转】Android的WebView控件载入网页显示速度慢的究极解决方案

    秒(甚至更多)时间才会显示出来.研究了很久,搜遍了国外很多网站,也看过PhoneGap的代码,一直无解. 一般人堆WebView的加速,都是建议先用webView.getSettings().setB ...

  8. HTML5学习总结-10 Android 控件WebView显示网页

    WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient 1)setWebClient: ...

  9. Android:控件WebView显示网页

    WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient setWebClient:主要 ...

随机推荐

  1. Windows安装zabbix-agent4.0

    1.在Windows系统中的C盘,新建一个zabbix目录C:/zabbix2.先下载zabbix-agent的安装包https://assets.zabbix.com/downloads/4.0.1 ...

  2. C语言递归之在每个树行中找最大值

    题目描述 您需要在二叉树的每一行中找到最大的值. 示例 输入: / \ / \ \ 输出: [, , ] 题目要求 /** * Definition for a binary tree node. * ...

  3. 解决element-ui按需引入不了Scrollbar的问题

    一.报错原因 在我想按需引入element-ui时,突然报错: 这个报错来的有点措不及防.明明在页面当中能够使用,为仕么在单独引入时却不能引用了,真是百思不得其解. 经过在百度上的查找才知道,原来Sc ...

  4. Linux磁盘文件系统与格式化实战(一)

    fdisk分区的实质: 用fdisk分区的实质,就是修改0磁头0磁道1扇区的前446字节之后的64字节的分区表信息. 问题:可以使用fdisk分区的磁盘大小必须小于2T,如果大于2T呢,分区就用par ...

  5. poj2486 Apple Tree (树形dp+分组背包)

    题目链接:https://vjudge.net/problem/POJ-2486 题意:一棵点权树,起点在1,求最多经过m条边的最大点权和. 思路: 树形dp经典题.用3维状态,dp[u][j][0/ ...

  6. IDEA下tomcat启动后 server乱码,Tomcat Catalina Log乱码问题的解决

    如果你初接触Idea,一定会遇到控制台乱码的问题,这里和eclipse有点不一样,看如下办法: 乱码的根本原因:Windows系统的cmd是GBK编码的,所以IDEA的下方log输出的部分的编码也是G ...

  7. Intellj IDEA快捷键入门 之 Ctrl+Space(空格)

    Intellj IDEA快捷键入门 之 Ctrl+Space(空格) 时间:2019/11/28 系统:Win10系统 背景: Win10系统下,想把ctrl+space(空格)切换输入法取消, 以防 ...

  8. XPath库详解

    目录 xpath入门 获取节点 获取所有节点 获取子节点 获取父节点 属性匹配 根据属性值匹配节点 属性多值匹配 多属性匹配 文本获取 按序选择 节点轴选择 补充 xpath的运算符介绍 xpath轴 ...

  9. 怎样理解document节点

    1. document是七种文档节点中的一种, 是最顶级的一种节点; 2. 其他六种节点都包在document节点之内; 3. document既是一种节点的名字, 也是这种节点在DOM中的实例对象; ...

  10. ArrayList插入1000w条数据的时间比较分析

    一分钟系列: 读懂GC日志 ArrayList插入1000w条数据之后,我怀疑了jvm... Java JIT性能调优 Java性能优化指南系列(三):理解JIT编译器 准备:调试程序加入VM Opt ...