---恢复内容开始---
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