Android webview加載H5方法詳細(xì)介紹
這篇文章主要闡述3個(gè)知識(shí)點(diǎn)
- 安卓APP 怎么用webview加載H5
- H5怎么調(diào)用安卓定義的方法
- 安卓怎么調(diào)用H5定義的方法
1,安卓APP 怎么用webview加載H5
安卓端定義個(gè)webview xml 頁面,代碼如下所示:
<?xml version="1.0" encoding="utf-8"?> <WebView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/web_view_id" android:layout_width="match_parent" android:layout_height="match_parent"> </WebView>
之后再對(duì)webview 實(shí)例進(jìn)行設(shè)置,用loadUrl 方法加載H5 路徑即可。代碼如下:
webView = (WebView) view.findViewById(R.id.web_view_id); WebSettings settings = webView.getSettings(); settings.setJavaScriptEnabled(true); WebChromeClient webChromeClient = new WebChromeClient(); webView.setWebChromeClient(webChromeClient); settings.setUseWideViewPort(true); settings.setLoadWithOverviewMode(true); settings.setBuiltInZoomControls(true); settings.setSupportZoom(true); settings.setDefaultTextEncodingName("UTF-8"); settings.setJavaScriptCanOpenWindowsAutomatically(true); //String _url = "http://xxx.xxx.xxx/link/index.html#/home/index"; //服務(wù)器地址 String _url = "file:android_asset/dist/index.html#/home/index"; //本地地址 webView.loadUrl(_url);
不出意外的話會(huì)看到加載的H5頁面了。
2,H5怎么調(diào)用安卓定義的方法
首先定義一個(gè)類,寫上供H5調(diào)用的方法,注意這個(gè)方法要用@JavascriptInterface修飾,代碼如下所示:
public class Mine { private Context context; public Mine(Context _context){ this.context = _context; } @JavascriptInterface public void loginOut(){ ((MainActivity) context).loginOut(); } }
然后注冊(cè)這個(gè)類,如下所示:
webView.addJavascriptInterface(new Mine(this.getActivity()), "mineInterface");
這樣安卓端就寫好了。接下來就是H5端調(diào)用了。
window.mineInterface.loginOut();
H5端直接這么調(diào)用就可以了。
如果js想傳遞json對(duì)象參數(shù)給安卓端怎么辦,不要直接寫json對(duì)象,要轉(zhuǎn)換為json字符串,代碼如下:
window.mineInterface.loginOutTest(JSON.stringify({ title: "iot", name: "iot" }));
安卓端接收如下:
@JavascriptInterface public void loginOutTest(String params){ Log.d(AppYunlanLink.TAG, "test: " + params); }
3,安卓怎么調(diào)用H5定義的方法
H5 我是用的vue 框架,方法寫在了頁面內(nèi),如下所示:
created() { window.setUserInfo = this.setUserInfo; //android app 會(huì)調(diào)用此方法 }, methods: { setUserInfo(userInfo) { const _userInfo = JSON.parse(userInfo); this.userName = _userInfo.username; this.avatar = _userInfo.avatar; } },
注意方法一定要掛載到window對(duì)象上。安卓端怎么調(diào)用呢?
//調(diào)用html5 頁面中的方法,帶JSONObject類型參數(shù) public void loadWebViewFuncWithJSON(String funcName, JSONObject value) { webView.post(new Runnable() { @Override public void run() { String _url = "javascript:" + funcName + "('" + value + "')"; Log.d(AppYunlanLink.TAG, "value is: " + value); webView.loadUrl(_url); } }); } fg4.loadWebViewFuncWithJSON("setUserInfo", info);
這是帶有參數(shù)的調(diào)用,安卓端是JSONObject類型的,H5端接收的是json字符串。不帶參數(shù)的調(diào)用更簡(jiǎn)單了,如下:
//調(diào)用html5 頁面中的方法 public void loadWebViewFunc(String funcName) { String _url = "javascript:" + funcName + "()"; webView.loadUrl(_url); }
到此這篇關(guān)于Android webview加載H5方法詳細(xì)介紹的文章就介紹到這了,更多相關(guān)Android加載H5內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Flutter Http分塊下載與斷點(diǎn)續(xù)傳的實(shí)現(xiàn)
這篇文章主要介紹了Flutter Http分塊下載與斷點(diǎn)續(xù)傳的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03Android利用Fragment實(shí)現(xiàn)Tab選項(xiàng)卡效果
這篇文章主要為大家詳細(xì)介紹了Android利用Fragment實(shí)現(xiàn)Tab選項(xiàng)卡效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-08-08Android小掛件(APP Widgets)設(shè)計(jì)指導(dǎo)
這篇文章主要為大家詳細(xì)介紹了Android小掛件APP Widgets設(shè)計(jì)指導(dǎo),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12Android巧用ActionBar實(shí)現(xiàn)下拉式導(dǎo)航
這篇文章主要為大家詳細(xì)介紹了Android巧用ActionBar實(shí)現(xiàn)下拉式導(dǎo)航的相關(guān)資料,具有一定的實(shí)用性和參考價(jià)值,感興趣的小伙伴們可以參考一下2016-05-05Android中fragment嵌套fragment問題解決方法
這篇文章主要介紹了Android中fragment嵌套fragment問題解決方法,本文給出兩個(gè)解決方法,需要的朋友可以參考下2015-06-06android時(shí)間選擇控件之TimePickerView使用方法詳解
這篇文章主要為大家詳細(xì)介紹了android時(shí)間選擇控件之TimePickerView的使用方法,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-09-09android自定義控件ImageView實(shí)現(xiàn)圓形圖片
這篇文章主要為大家詳細(xì)介紹了android自定義控件ImageView實(shí)現(xiàn)圓形圖片,適用于用戶頭像,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-12-12