Android WebView JavaScript交互

浏览数：27 / 时间：2015年06月11日

 今天介绍一下，Android中Webview与JavaScript的交互，首先是在布局文件里添加webview控件：

[html] view plaincopy
 
  1. <WebView  
  2.         android:id="@+id/webview"  
  3.         android:layout_width="fill_parent"  
  4.         android:layout_height="fill_parent" />  

  然后是在manifest里添加权限：

[html] view plaincopy
 
  1. <uses-permission android:name="and  

  要是webview能够与JavaScript交互，首先需要webview要启用JavaScript：

[html] view plaincopy
 
  1. WebSettings webSettings = myWebView.getSettings();  
  2.         webSettings.setJavaScriptEnabled(true);  

  然后创建JavaScript的接口：

[java] view plaincopy
 
  1. public class WebAppInterface {  
  2.         Context mContext;  
  3.   
  4.         /** Instantiate the interface and set the context */  
  5.         WebAppInterface(Context c) {  
  6.             mContext = c;  
  7.         }  
  8.   
  9.         /** Show a toast from the web page */  
  10.         @JavascriptInterface  
  11.         public void showToast(String toast) {  
  12.             Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();  
  13.         }  
  14.     }  

  给webview添加JavaScript接口：

[html] view plaincopy
 
  1. myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");  

  本地JavaScript文件：

[javascript] view plaincopy
 
  1. <input type="button" value="Say hello" onClick="showAndroidToast(‘Hello Android!‘)" />  
  2.   
  3. <script type="text/javascript">  
  4.     function showAndroidToast(toast) {  
  5.         Android.showToast(toast);  
  6.     }  
  7. </script>  

  整个代码如下：

[java] view plaincopy
 
  1. public class MainActivity extends Activity {  
  2.     private WebView myWebView;  
  3.   
  4.     @Override  
  5.     protected void onCreate(Bundle savedInstanceState) {  
  6.         super.onCreate(savedInstanceState);  
  7.         setContentView(R.layout.activity_main);  
  8.         myWebView = (WebView) findViewById(R.id.webview);  
  9.         WebSettings webSettings = myWebView.getSettings();  
  10.         webSettings.setJavaScriptEnabled(true);  
  11.         myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");  
  12.         ProcessWebString();  
  13.   
  14.     }  
  15.   
  16.     public class WebAppInterface {  
  17.         Context mContext;  
  18.   
  19.         /** Instantiate the interface and set the context */  
  20.         WebAppInterface(Context c) {  
  21.             mContext = c;  
  22.         }  
  23.   
  24.         /** Show a toast from the web page */  
  25.         @JavascriptInterface  
  26.         public void showToast(String toast) {  
  27.             Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();  
  28.         }  
  29.     }  
  30.   
  31.     private void ProcessWebString() {  
  32.         // 加载 asset 文件  
  33.         String tpl = getFromAssets("web_tpl.html");  
  34.         myWebView.loadDataWithBaseURL(null, tpl, "text/html", "utf-8", null);  
  35.     }  
  36.   
  37.     /* 
  38.      * 获取html文件 
  39.      */  
  40.     public String getFromAssets(String fileName) {  
  41.         try {  
  42.             InputStreamReader inputReader = new InputStreamReader(  
  43.                     getResources().getAssets().open(fileName));  
  44.             BufferedReader bufReader = new BufferedReader(inputReader);  
  45.             String line = "";  
  46.             String Result = "";  
  47.             while ((line = bufReader.readLine()) != null)  
  48.                 Result += line;  
  49.             return Result;  
  50.         } catch (Exception e) {  
  51.             e.printStackTrace();  
  52.         }  
  53.         return "";  
  54.     }  
  55.   
  56. }  

  运行效果：

技术分享

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： Android iOS 移动互联 终端开发

相关文章

随机文章

您可能还喜欢

您可能还喜欢