---恢復內容開始---
1.通過WebView加載Html界面。在android studio中html放在assets中。
但是默認的並不存在這個文件夾,創建過程是
2.創建后簡單實現下,js調用android中的方法。通過onclick="window.android.startFunction()" window.android.方法名 調用android方法
<1>創建html文件 橘黃色為適配手機屏幕代碼
<!doctype html> <html> <head> <!-- 設置當前HTML文件的字符編碼 --> <meta charset="utf-8"> <!-- 設置瀏覽器的兼容模式版本 (讓IE使用最新的渲染引擎工作) --> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 聲明當前網頁在移動端瀏覽器中展示的相關設置 --> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <!-- 上述3個meta標簽*必須*放在最前面,任何其他內容都*必須*跟隨其后! --> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head> <body> 這里是HTML <br/> <h1><div id="content">HTML內容顯示</div></h1> <br/> <input type="button" value="調用android代碼" onclick="window.android.startFunction()" /> <br/> <input type="button" value="調用android代碼並傳遞參數" onclick="window.android.startFunction('這里是js調用Android方法')" /> </body> </html>
<2> Main布局只有一個webview
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="myapplication.com.myhtml.MainActivity"> <WebView android:id="@+id/webview" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout>
<3>Main代碼
public class MainActivity extends AppCompatActivity { private WebView contentWebView = null; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); contentWebView = (WebView) findViewById(R.id.webview); // 啟用javascript contentWebView.getSettings().setJavaScriptEnabled(true); // 從assets目錄下面的加載html contentWebView.loadUrl("file:///android_asset/b.html"); contentWebView.addJavascriptInterface(MainActivity.this,"android"); } //由於安全原因 需要加 @JavascriptInterface @JavascriptInterface public void startFunction(){ runOnUiThread(new Runnable() { @Override public void run() { Toast.makeText(MainActivity.this,"Toast",Toast.LENGTH_SHORT).show(); } }); } @JavascriptInterface public void startFunction(final String text){ runOnUiThread(new Runnable() { @Override public void run() { new AlertDialog.Builder(MainActivity.this).setMessage(text).show(); } }); } }
其實現效果圖:
3 android 調用html js方法
<1> Html文件如下,script中有二個方法,共android中調用。
<html> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312"> <script type="text/javascript"> function javacalljs(){ document.getElementById("content").innerHTML = "<br\>JAVA調用了JS的無參函數"; } function javacalljswith(arg){ document.getElementById("content").innerHTML = ("<br\>"+arg); } </script> </head> <body> 這里是HTML <br/> <h1><div id="content">內容顯示</div></h1> <br/> <input type="button" value="點擊調用java代碼" onclick="window.android.startFunction()" /> <br/> <input type="button" value="點擊調用java代碼並傳遞參數" onclick="window.android.startFunction('http://blog.csdn.net/Leejizhou')" /> </body> </html>
<2>通過webView.loadUrl("javascript:方法名"); 來調用js中的方法。
public class MainActivity extends AppCompatActivity { private WebView contentWebView = null; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); contentWebView = (WebView) findViewById(R.id.webview); // 啟用javascript contentWebView.getSettings().setJavaScriptEnabled(true); // 從assets目錄下面的加載html contentWebView.loadUrl("file:///android_asset/b.html"); contentWebView.addJavascriptInterface(MainActivity.this,"android"); //無參調用Js點擊 findViewById(R.id.button).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // 無參數調用 contentWebView.loadUrl("javascript:javacalljs()"); } }); //有參調用Js點擊 findViewById(R.id.button2).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // 傳遞參數調用 contentWebView.loadUrl("javascript:javacalljswith(" + "'這里是調用js方法'" + ")"); } }); }
實現圖如下:
http://pan.baidu.com/s/1pK9u7MV 工作--新文件--myhtml