Android开发：通过 webview 将网页打包成安卓应用
商业转载请联系作者获得授权，非商业转载请注明出处。
For commercial use, please contact the author for authorization. For non-commercial use, please indicate the source.
协议(License)：署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)
作者(Author)：
链接(URL)：https://www.35youth.cn/817.html
来源(Source)：搬砖少年
近期团队接到一个新的项目，企业内部的一个掌上超市项目，最初考虑通过公众号或者小程序来做，后面说是部署在企业内网，就考虑到做网站应用，由于需要通过运营商分配的apn连接企业内网，所以在打开应用之前需要检测一下网络，如果是web端的话，那就没法检测网络了，所以考虑使用安卓的 webview 封装一下H5的应用。
1、配置网络连接权限
在AndroidManifest.xml文件中加上以下配置信息
<uses-permission android:name="android.permission.INTERNET"/>
注： 从Android 9.0（API级别28）开始，默认情况下禁用明文支持。因此http的url均无法在webview中加载 ，所以只配置以上信息可能会导致net：：ERR_CLEARTEXT_NOT_PERMITTED报错，还需要在配置文件的 application中加入下面的配置。参照文章： net：：ERR_CLEARTEXT_NOT_PERMITTED
android:usesCleartextTraffic="true"
webview 网络配置异常
net：：ERR_CLEARTEXT_NOT_PERMITTED 配置
2、创建layout文件
使用idea的话，会自动创建MainActivity和对应的layout文件，直接在文件的基础上修改即可，使用Webview控件，如果需要使用进度条的话，可以将ProgressBar 的配置打开即可。
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.ctjsoft.jxf.shop.MainActivity">
<WebView android:id="@+id/webview" android:layout_width="match_parent" android:layout_height="match_parent"/>
<!--<ProgressBar android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/progressbar"
style="@android:style/Widget.ProgressBar.Horizontal" android:max="100" android:progress="0"
android:visibility="gone"/>-->
</androidx.constraintlayout.widget.ConstraintLayout>
3、修改 MainActivity 文件
重写onCreate方法：
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//progressBar = (ProgressBar) findViewById(R.id.progressbar);//进度条
webView = (WebView) findViewById(R.id.webview);
webView.getSettings().setAllowUniversalAccessFromFileURLs(true);
webView.getSettings().setAllowFileAccessFromFileURLs(true);
// webview的设置中添加如下代码
try {
if (Build.VERSION.SDK_INT >= 16) {
Class<?> clazz = webView.getSettings().getClass();
Method method = clazz.getMethod("setAllowUniversalAccessFromFileURLs", boolean.class);
if (method != null) {
method.invoke(webView.getSettings(), true);
}
}
} catch (IllegalArgumentException e) {
e.printStackTrace();
} catch (NoSuchMethodException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
//webView.loadUrl("http://172.17.1.176:8082/");//加载url
webView.loadUrl(API);
//使用webview显示html代码
// webView.loadDataWithBaseURL(null,"<html><head><title> 欢迎您 </title></head>" +
// "<body><h2>使用webview显示 html代码</h2></body></html>", "text/html" , "utf-8", null);
webView.addJavascriptInterface(this, "android");//添加js监听 这样html就能调用客户端
webView.setWebChromeClient(webChromeClient);
webView.setWebViewClient(webViewClient);
WebSettings webSettings = webView.getSettings();
/**
* LOAD_CACHE_ONLY: 不使用网络，只读取本地缓存数据
* LOAD_DEFAULT: （默认）根据cache-control决定是否从网络上取数据。
* LOAD_NO_CACHE: 不使用缓存，只从网络获取数据.
* LOAD_CACHE_ELSE_NETWORK，只要本地有，无论是否过期，或者no-cache，都使用缓存中的数据。
*/
webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);//不使用缓存，只从网络获取数据.
webView.getSettings().setTextZoom(100);
webView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);//设置js可以直接打开窗口，如window.open()，默认为false
webView.getSettings().setJavaScriptEnabled(true);//是否允许执行js，默认为false。设置true时，会提醒可能造成XSS漏洞
webView.getSettings().setSupportZoom(true);//是否可以缩放，默认
webView.getSettings().setBuiltInZoomControls(true);//是否显示缩放按钮，默认false
webView.getSettings().setUseWideViewPort(true);//设置此属性，可任意比例缩放。大视图模式
webView.getSettings().setLoadWithOverviewMode(true);//和setUseWideViewPort(true)一起解决网页自适应问题
webView.getSettings().setAppCacheEnabled(true);//是否使用缓存
webView.getSettings().setDomStorageEnabled(true);//DOM Storage
}
```
配置WebviewClient
//WebViewClient主要帮助WebView处理各种通知、请求事件
private WebViewClient webViewClient = new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {//页面加载完成
//progressBar.setVisibility(View.GONE);
}
public void onPageStarted(WebView view, String url, Bitmap favicon) {//页面开始加载
//progressBar.setVisibility(View.VISIBLE);
}
@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
@Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
Log.i("ansen", "拦截url:" + request.getUrl());
return super.shouldOverrideUrlLoading(view, request);
}
};
//WebChromeClient主要辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度等
private WebChromeClient webChromeClient = new WebChromeClient() {
//不支持js的alert弹窗，需要自己监听然后通过dialog弹窗
public boolean onJsAlert(WebView webView, String url, String message, JsResult result) {
AlertDialog.Builder localBuilder = new AlertDialog.Builder(webView.getContext());
localBuilder.setMessage(message).setPositiveButton("确定", null);
localBuilder.setCancelable(false);
localBuilder.create().show();
//注意:
//必须要这一句代码:result.confirm()表示:
//处理结果为确定状态同时唤醒WebCore线程
//否则不能继续点击按钮
result.confirm();
return true;
}
//获取网页标题
@Override
public void onReceivedTitle(WebView view, String title) {
super.onReceivedTitle(view, title);
Log.i("ansen", "网页标题:" + title);
}
//加载进度回调
@Override
public void onProgressChanged(WebView view, int newProgress) {
// progressBar.setProgress(newProgress);
}
};
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
Log.i("ansen", "是否有上一个页面:" + webView.canGoBack());
if (webView.canGoBack() && keyCode == KeyEvent.KEYCODE_BACK) {//点击返回按钮的时候判断有没有上一页
webView.goBack(); // goBack()表示返回webView的上一页面
return true;
}
return super.onKeyDown(keyCode, event);
}
/**
* JS调用android的方法
*
* @param str
* @return
*/
@JavascriptInterface //仍然必不可少
public void getClient(String str) {
Log.i("ansen", "html调用客户端:" + str);
}
@Override
protected void onDestroy() {
super.onDestroy();
//释放资源
webView.destroy();
webView = null;
}
```Android开发：通过 webview 将网页打包成安卓应用的更多相关文章
- android开发中WebView的使用(附完整程序)
原文地址:http://www.pocketdigi.com/20110216/176.html WebView是个好东西,作用相当于一个迷你的浏览器,采用Webkit内核,因此完美支持html,ja ...
- 将H5页面打包成安卓原生app
第一步:下载HBuilderX,新建项目选择5+App新建一个空项目如下图 新建后项目目录结构如下图 第二步,将你要打包成安卓app的文件打包,最后生成的文件目录如下图 1.打包完成后,将对应文件内容 ...
- HBuilderX打包成安卓或苹果app之后的调试问题，避免每次都要打包
一.使用VScode安装 Live Server插件 二.使用:安装成功后---->>新建一个index.html 写入内容如下图所示 注:href地址是你在电脑上启动该项目的访问地址(此 ...
- Android 之 用WebView显示网页
WebView可以使得网页轻松的内嵌到 app 里,还可以直接跟js相互调用. WebView有两个方法:setWebChromeClient 和 setWebClient (1) setWebCli ...
- Electron把网页打包成桌面应用并进行源码加密
前言 最近想把自己用html+css+js做的网页界面打包成桌面应用,网上一搜,发现Electron是一个不错的选择,试了试,发现效果真的不错.这里记录一下打包过程以作记录,便于自己以后查看学习. 一 ...
- HTML5学习总结-10 Android 控件WebView显示网页
WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient 1)setWebClient: ...
- 搭建ionic3-angular5 开发环境并打包成安卓apk包教程
安装node.js 搭建ionic3-angular5 开发环境,首先查看本地电脑是否安装node环境,打开终端,输入 命令: node -v 没有去安装nodejs 网址:http://nodej ...
- android中使用WebView请求网页
请求网页首先需要访问网络的权限,在AndroidManifest.xml添加如下内容: <uses-permission android:name="android.permissio ...
- 【iOS越狱开发】如何将应用打包成.ipa文件
在项目开发中,我们常常需要将工程文件打包成.ipa文件,提供给越狱的iphone安装. 下面是一种方法: 1.首先应该给工程安装好配置文件(这里不再敖述),在ios device的状态下,运行成功. ...
随机推荐
- 对这些工程师来说，Skype Translator是他们自己的事——Skype Translator项目研发团队的故事
Translator是他们自己的事--Skype Translator项目研发团队的故事" title="对这些工程师来说,Skype Translator是他们自己的事--Sky ...
- Memcached笔记——（四）应对高并发攻击
近半个月过得很痛苦,主要是产品上线后,引来无数机器用户恶意攻击,不停的刷新产品各个服务入口,制造垃圾数据,消耗资源.他们的最好成绩,1秒钟可以并发6次,赶在Database入库前,Cache进行Mis ...
- 吴裕雄--天生自然 python语言数据分析：开普勒系外行星搜索结果分析
import pandas as pd pd.DataFrame({'Yes': [50, 21], 'No': [131, 2]}) pd.DataFrame({'Bob': ['I liked i ...
- linux查看端口号占用命令-netstat
题记 经常会发现,很多时候我们在运行一些带有端口的程序时,程序经常会报端口被占用的问题,比如Tomcat 8080,端口起不来. 查看端口号 netstat 如果发现某个端口被占用后,可以用命令查看, ...
- HEXO进阶打赏
HEXO接近是最近有一些朋友提出的问题,然后我做了总结,如果你也在使用HEXO,不妨看看,应该会有些帮助. 1.博客部署样式出问题了怎么办? 2.电脑重装或者误删了本地博客怎么办? 3.想使用两台电脑 ...
- Python如何规避全局解释器锁(GIL)带来的限制
编程语言分类概念介绍(编译型语言.解释型语言.静态类型语言.动态类型语言概念与区别) https://www.cnblogs.com/zhoug2020/p/5972262.html Python解释 ...
- 月薪20k+的测试工程师都会这项技能！
一说到测试,很多人认为就是在一直"点点点"找bug的重复性工作,这是早期手工测试给人的刻板印象,随着测试行业的发展,"会代码"越来越成为测试工程师的一个标签. ...
- runR
Linux下使用R 运行linux下的R脚本 编写R文件 新建后缀名为R的文件 写入R程序 在脚本首行加入 1 运行R文件 这里有两种方式 大专栏 runR进入R的环境">进入R的环 ...
- 纯css3配合vue实现微信语音播放效果
前言 每次写点东西都扯两句-0-,这几天一半精力放在移动端,一半维护之前的项目.书也少看了,不过还好依旧保持一颗学习的心.对于css3我是之前有专门整理过的,因此对于原理之前也算了解.今天是项目中遇到 ...
- Reids(4)——神奇的HyperLoglog解决统计问题
一.HyperLogLog 简介 HyperLogLog 是最早由 Flajolet 及其同事在 2007 年提出的一种 估算基数的近似最优算法.但跟原版论文不同的是,好像很多书包括 Redis 作者 ...