Android WebView的使用方法及与JS 相互调用
程序员文章站
2022-10-10 12:58:34
android webview的使用方法及与js 相互调用
1、添加网络权限
android webview的使用方法及与js 相互调用
1、添加网络权限
<uses-permission android:name="android.permission.internet" />
2、websettings 对访问页面进行设置。
webview mwebview = new webview(this); websettings websettings = mwebview .getsettings();//支持获取手势焦点,输入用户名、密码或其他 mwebview.requestfocusfromtouch(); websettings.setjavascriptenabled(true); //支持js websettings.setusewideviewport(true); //将图片调整到适合webview的大小 websettings.setloadwithoverviewmode(true); // 缩放至屏幕的大小 websettings.setsupportzoom(true); //支持缩放,默认为true。是下面那个的前提。 websettings.setbuiltinzoomcontrols(true); //设置内置的缩放控件。 websettings.setdisplayzoomcontrols(false); //隐藏原生的缩放控件 websettings.setlayoutalgorithm(layoutalgorithm.single_column); //支持内容重新布局 websettings.supportmultiplewindows(); //多窗口 websettings.setcachemode(websettings.load_cache_else_network); //关闭webview中缓存 websettings.setallowfileaccess(true); //设置可以访问文件 websettings.setneedinitialfocus(true); //当webview调用requestfocus时为webview设置节点 websettings.setjavascriptcanopenwindowsautomatically(true); //支持通过js打开新窗口 websettings.setloadsimagesautomatically(true); //支持自动加载图片 websettings.setdefaulttextencodingname("utf-8");//设置编码格式
3、页面加载方式
//加载一个网页: mwebview.loadurl(); //加载apk包中的一个html页面 mwebview.loadurl(); //加载手机本地的一个html页面的方法: mwebview.loadurl("content://com.android.htmlfileprovider/sdcard/test.html");
4、webview 的两个重要方法 webviewclient 和 webchromeclient
webviewclient就是帮助webview处理各种通知、请求事件的。
//打开网页时不调用系统浏览器, 而是在本webview中显示: mwebview.setwebviewclient(new webviewclient(){ @override public boolean shouldoverrideurlloading(webview view, string url) { view.loadurl(url); return true; } }); //将上面定义的webviewclinet设置给webview mwebview.setwebviewclient(webviewclient);
下面介绍 webview 的一些事件:
webviewclient mwebviewclient = new webviewclient() { shouldoverrideurlloading(webview view, string url); //在网页上的所有加载都经过这个方法,这个函数我们可以做很多操作。 //比如获取url,查看url.contains(“add”),进行添加操作 shouldoverridekeyevent(webview view, keyevent event); //重写此方法才能够处理在浏览器中的按键事件。 onpagestarted(webview view, string url, bitmap favicon) ; //这个事件就是开始载入页面调用的,我们可以设定一个loading的页面,告诉用户程序在等待网络响应。 onpagefinished(webview view, string url); //在页面加载结束时调用。同样道理,我们可以关闭loading 条,切换程序动作。 onloadresource(webview view, string url) ; // 在加载页面资源时会调用,每一个资源(比如图片)的加载都会调用一次。 onreceivederror(webview view, int errorcode, string description, string failingurl); // (报告错误信息) doupdatevisitedhistory(webview view, string url, boolean isreload); //(更新历史记录) onformresubmission(webview view, message dontresend, message resend); //(应用程序重新请求网页数据) onreceivedhttpauthrequest(webview view, httpauthhandler handler, string host,string realm); //(获取返回信息授权请求) onreceivedsslerror(webview view, sslerrorhandler handler, sslerror error); //重写此方法可以让webview处理https请求。 onscalechanged(webview view, float oldscale, float newscale); // (webview发生改变时调用) onunhandledkeyevent(webview view, keyevent event); //(key事件未被加载时调用) }
webchromeclient是辅助webview处理javascript的对话框,网站图标,网站title,加载进度等。
webchromeclient mwebchromeclient = new webchromeclient() { //获得网页的加载进度,显示在右上角的textview控件中 @override public void onprogresschanged(webview view, int newprogress) { if (newprogress < 100) { string progress = newprogress + "%"; } else { } } //获取web页中的title用来设置自己界面中的title //当加载出错的时候,比如无网络,这时onreceivetitle中获取的标题为 找不到该网页, //因此建议当触发onreceiveerror时,不要使用获取到的title @override public void onreceivedtitle(webview view, string title) { mainactivity.this.settitle(title); } @override public void onreceivedicon(webview view, bitmap icon) { // } @override public boolean oncreatewindow(webview view, boolean isdialog, boolean isusergesture, message resultmsg) { // return true; } @override public void onclosewindow(webview window) { } //处理alert弹出框,html 弹框的一种方式 @override public boolean onjsalert(webview view, string url, string message, jsresult result) { // return true; } //处理confirm弹出框 @override public boolean onjsprompt(webview view, string url, string message, string defaultvalue, jspromptresult result) { // return true; } //处理prompt弹出框 @override public boolean onjsconfirm(webview view, string url, string message, jsresult result) { // return true; } }; //同样,将上面定义的webchromeclient设置给webview: webview.setwebchromeclient(mwebchromeclient);
5、调用 js 代码
websettings websettings = mwebview .getsettings(); websettings.setjavascriptenabled(true);//这里必须设置 mwebview.addjavascriptinterface(new insertobj(), "jsobj");
以下方法是 android 和 js 的交互
public class insertobj extends object { private static activity mactivity; private static webview mwebview; public insertobj(activity activity, webview webview) { mactivity = activity; mwebview = webview; } //给html提供的方法,js中可以通过:var str = window.jsobj.htmlcalljava(); 获取到 @javascriptinterface public string htmlcalljava() { return "html call java"; } //给html提供的有参函数 : window.jsobj.htmlcalljava2("it-homer blog"); @javascriptinterface public string htmlcalljava2(final string result) { return "html call java : " + result; } //html给我们提供的函数 @javascriptinterface public static void javacallhtml() { mactivity.runonuithread(new runnable() { @override public void run() { //这里是调用方法 mwebview.loadurl("javascript: showfromhtml()"); toast.maketext(mactivity, "clickbtn", toast.length_short).show(); } }); } //html给我们提供的有参函数 @javascriptinterface public static void javacallhtml2(final string param) { mactivity.runonuithread(new runnable() { @override public void run() { mwebview.loadurl("javascript: showfromhtml2('"+param+"')"); toast.maketext(mactivity, "clickbtn2", toast.length_short).show(); } }); } }
<!doctype html> <html> <head> <meta content="text/html; charset=utf-8" http-equiv="content-type"> <title>无标题 1</title> <script type="text/javascript"> function htmlcalljava(){ var str = window.jsobj.htmlcalljava(); alert(str); } function htmlcalljava2(){ var str = window.jsobj.htmlcalljava2("html"); alert(str); } function showfromhtml() { alert("我是js方法,我被android后台调用"); } function showfromhtml2(result) { alert("我是js方法,我被android后台调用 "+result); } </script> </head> <body> <button onclick="htmlcalljava()">htmlcalljava</button> <button onclick="htmlcalljava2()">htmlcalljava2</button> </body> </html>
6、webview 返回键
public boolean onkeydown(int keycode, keyevent event) { if ((keycode == keyevent.keycode_back) && mwebview.cangoback()) { mwebview.goback(); return true; } return super.onkeydown(keycode, event); }
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持,如有疑问请留言或者到本站社区交流讨论,大家共同进步!
推荐阅读
-
Android WebView的使用方法及与JS 相互调用
-
Android的WebView与H5前端JS代码交互的实例代码
-
Android Webview与ScrollView的滚动兼容及留白处理的方法
-
JS验证全角与半角及相互转化的介绍
-
Android Naive与WebView的互相调用详解
-
Android webview与js的数据交互
-
Android的WebView与H5前端JS代码交互的实例代码
-
Android WebView的使用方法及与JS 相互调用
-
iOS用WKWebView与JS交互获取系统图片及WKWebView的Alert,Confirm,TextInput的监听代理方法使用,屏蔽WebView的可选
-
Android中 webView调用JS出错的解决办法