android、IOS 基於webview 與 HTML 的整合
阿新 • • 發佈：2018-12-21
知識點：
1）android 和 html 的整合
2）html 如何通過javascript 判斷 客戶端是 android 還是 IOS
3）IOS 和android 的整合 （我不懂IOS 的oc 開發，所以這部分我省略。。。。我是和我的一個IOS同事一同測試過的，html 是我寫的）<html> <head> <metahttp-equiv="Content-Type"content="text/html; charset=UTF-8"> <title>商城紅包模擬頁面</title> </head> <body> <formmethod="post"> <P>商品列表</P> <tablestyle="BORDER-RIGHT:#ff6600 1px dashed;BORDER-TOP:#ff6600 1px dashed; BORDER-LEFT:#ff6600 1px dashed; BORDER-BOTTOM:#ff6600 1px dashed; BORDER-COLLAPSE:collapse";borderColor=#000000;height=40;cellPadding=1;width=350px; border=1> <tr> <td>神州膝上型電腦</td> <td>3000.00 元</td> <td><buttononclick="javascript:sendOrderXml('神州膝上型電腦');">點我下單</button></td> </tr> <tr> <td>聯想膝上型電腦</td> <td>5000.00 元</td> <td><buttononclick="javascript:sendOrderXml('聯想膝上型電腦');">點我下單</button></td> </tr> </table> </form> </body> </html> <script> var ua = navigator.userAgent.toLowerCase(); var webType; if (/iphone|ipad|ipod/.test(ua)){ webViewType = 'iphone'; } else if (/android/.test(ua)){ webViewType = 'android'; }else{ webViewType='pc'; } <!-- 下面的orderXml 是商城下單的詳細內容資訊 --> function sendOrderXml(orderXml){ if('iphone'==webViewType){ var f = document.forms[0]; f.action="ios://orderxml="+encodeURI(orderXml); f.submit(); }else if('android'==webViewType){ window.myObj.dopay(encodeURI(orderXml)); }else if('pc' == webViewType){ window.myObj.dopay(encodeURI(orderXml)); } } </script>
Android 程式碼
package com.htjc.baseframe; import java.io.UnsupportedEncodingException; import java.net.URLDecoder; import android.annotation.SuppressLint; import android.os.Bundle; import android.util.Log; import android.webkit.JavascriptInterface; import android.webkit.WebSettings; import android.webkit.WebView; import android.widget.LinearLayout; public class WebViewActivityextends BaseActivtiy{ private WebView webview; private LinearLayout ll_rootView; @SuppressLint({"SetJavaScriptEnabled", "JavascriptInterface" }) @Override protected void onCreate(BundlesavedInstanceState) { super.onCreate(savedInstanceState); ll_rootView = new LinearLayout(this); ll_rootView.setOrientation(LinearLayout.VERTICAL); webview = new WebView(this); WebSettings settings =webview.getSettings(); settings.setJavaScriptEnabled(true); // webview.loadUrl("http://192.168.1.117:8080/webview/test.html"); webview.loadUrl("file:///android_asset/test.html"); webview.addJavascriptInterface(new JavaScriptObject(),"myObj"); ll_rootView.addView(webview); setContentView(ll_rootView); } public class JavaScriptObject { @JavascriptInterface /** * 此方法用於下單操作 * @param name */ public void dopay(Stringname){ Log.i("xiexie",name+"----"); String result=""; try { result = URLDecoder.decode(name,"UTF-8"); } catch (UnsupportedEncodingExceptione) { e.printStackTrace(); } System.out.println(result); Log.i("xiexie11",result+"----"); } } }