码迷，mamicode.com
首页 > 移动开发 > 详细

Android WebView JavaScript交互

时间：2015-03-04 12:26:16      阅读：187      评论：0      收藏：0      [点我收藏+]

标签：

 今天介绍一下，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 WebView JavaScript交互

标签：

原文地址：http://www.cnblogs.com/xiaorenwu702/p/4312860.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！