zoukankan      html  css  js  c++  java

  • Android高手进阶教程(二十)之Android与JavaScript方法相互调用！

    在Android中通过WebView控件,可以实现要加载的页面与Android方法相互调用,我们要实现WebView中的addJavascriptInterface方法，这样html才能调用android方法，在这里我个人觉得有点和DWR相似。

    为了让大家容易理解，我写了一个简单的Demo，具体步骤如下:

    第一步:新建一个Android工程,命名为WebViewDemo(这里我在assets里定义了一个html页面)。

    第二步:修改main.xml布局文件，增加了一个WebView控件还有Button控件，代码如下:

    view plain
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    3.     android:orientation="vertical"  
    4.     android:layout_width="fill_parent"  
    5.     android:layout_height="fill_parent"  
    6.     >  
    7.     <TextView    
    8.         android:layout_width="fill_parent"   
    9.         android:layout_height="wrap_content"   
    10.         android:text="Welcome to Mr Wei's Blog."  
    11.         />  
    12.     <WebView  
    13.         android:id="@+id/webview"  
    14.         android:layout_width="fill_parent"   
    15.         android:layout_height="wrap_content"   
    16.     />  
    17.     <Button  
    18.         android:id="@+id/button"  
    19.         android:layout_width="fill_parent"  
    20.         android:layout_height="wrap_content"  
    21.         android:text="Change the webview content"  
    22.     />  
    23. </LinearLayout>  

    第三步:在assets目录下新建一个demo.html文件,代码如下(这里不知道为何多了mce:这几个东东,<script></script>这样是对的):

    view plain
    1. <html>  
    2.     <mce:script language="javascript"><!--  
    3.    
    4.         function fillContent(){  
    5.             document.getElementById("content").innerHTML =   
    6.                  "This Content is showed by Android invoke Javascript function.";  
    7.         }  
    8.       
    9. // --></mce:script>    
    10.   <body>  
    11.     <p><a onClick="window.demo.startMap()" href="">Start GoogleMap</a></p>  
    12.     <p id="content"></p>  
    13.     <p>A Demo ----Android and Javascript invoke each other.</p>  
    14.     <p>Author:Frankiewei</p>  
    15.   </body>  
    16. </html>   

    第四步:修改主核心程序WebViewDemo.java,代码如下:

    view plain
    1. package com.tutor.webwiewdemo;  
    2. import android.app.Activity;  
    3. import android.content.ComponentName;  
    4. import android.content.Intent;  
    5. import android.os.Bundle;  
    6. import android.view.View;  
    7. import android.webkit.WebSettings;  
    8. import android.webkit.WebView;  
    9. import android.widget.Button;  
    10. public class WebViewDemo extends Activity {  
    11.     private WebView mWebView;  
    12.     private Button mButton;  
    13.     public void onCreate(Bundle savedInstanceState) {  
    14.         super.onCreate(savedInstanceState);  
    15.         setContentView(R.layout.main);  
    16.         setupViews();  
    17.     }  
    18.     //初始化  
    19.     private void setupViews() {  
    20.         mWebView = (WebView) findViewById(R.id.webview);  
    21.         WebSettings mWebSettings = mWebView.getSettings();  
    22.         //加上这句话才能使用javascript方法  
    23.         mWebSettings.setJavaScriptEnabled(true);  
    24.         //增加接口方法,让html页面调用  
    25.         mWebView.addJavascriptInterface(new Object() {  
    26.             //这里我定义了一个打开地图应用的方法  
    27.             public void startMap() {  
    28.                 Intent mIntent = new Intent();  
    29.                 ComponentName component = new ComponentName(  
    30.                         "com.google.android.apps.maps",  
    31.                         "com.google.android.maps.MapsActivity");  
    32.                 mIntent.setComponent(component);  
    33.                 startActivity(mIntent);  
    34.             }  
    35.         }, "demo");  
    36.         //加载页面  
    37.         mWebView.loadUrl("file:///android_asset/demo.html");  
    38.         mButton = (Button) findViewById(R.id.button);  
    39.         //给button添加事件响应,执行JavaScript的fillContent()方法  
    40.         mButton.setOnClickListener(new Button.OnClickListener() {  
    41.             public void onClick(View v) {  
    42.                 mWebView.loadUrl("javascript:fillContent()");  
    43.             }  
    44.         });  
    45.     }  
    46. }  

    第五步:运行上述工程，查看效果。

        

                            首界面                                           点击按钮时,html内容改变

       点击html的startGoogleMap启动地图应用
  • 相关阅读:
    【算法学习笔记】76.DFS 回溯检测 SJTU OJ 1229 mine
    【算法学习笔记】75. 动态规划 棋盘型 期望计算 1390 畅畅的牙签盒（改）
    【算法学习笔记】74. 枚举 状态压缩 填充方案 SJTU OJ 1391 畅畅的牙签袋（改）
    【算法学习笔记】73.数学规律题 SJTU OJ 1058 小M的机器人
    【算法学习笔记】72.LCS 最大公公子序列 动态规划 SJTU OJ 1065 小M的生物实验1
    【算法学习笔记】71.动态规划 双重条件 SJTU OJ 1124 我把助教团的平均智商拉低了
    【算法学习笔记】70.回文序列 动态规划 SJTU OJ 1066 小M家的牛们
    【算法学习笔记】69. 枚举法 字典序处理 SJTU OJ 1047 The Clocks
    【算法学习笔记】68.枚举 SJTU OJ 1272 写数游戏
    【算法学习笔记】67.状态压缩 DP SJTU OJ 1383 畅畅的牙签袋
  • 原文地址：https://www.cnblogs.com/chinatefl/p/2219206.html
Copyright © 2011-2022 走看看