Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> Android開發 >> 關於android開發 >> Android—android與js交互以及相互傳參,androidjs交互

Android—android與js交互以及相互傳參,androidjs交互

編輯:關於android開發

Android—android與js交互以及相互傳參,androidjs交互


Android中可以通過WebView來實現與js的交互,讓用戶可以在android客戶端看到js寫的頁面,接下來為大家介紹的就是怎樣實現此功能:

首先android項目目錄下有“assets”文件夾,開發者需要將html文件拷貝到此文件夾下。

html代碼:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0032)http://localhost:8080/jsandroid/ -->
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Expires" content="0">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-store,no-cache"> 
<meta name="Handheldfriendly" content="true">
<meta name="viewport" content="width=100%; initial-scale=1.0; user-scalable=yes">
<meta name="robots" content="all">
<meta name="keywords" contect="doodle, mobile, doodlemobile, game, games">
<meta name="description" content="Make People&#39;s Mobile Life More Connected Through Games.">
<title>jsandroid_test</title>
<script type="text/javascript" language="javascript"> 
//此方法是調用了android的方法HtmlcallJava2(); function showHtmlcallJava2(){ var str = document.getElementById("id_input").value var str1 = document.getElementById("id_input2").value
//調用android中的方法 window.jsObj.HtmlcallJava2(str+","+str1); } </script> </head> <body> hello IT-homer <br> <br> <br> <br> <input id="id_input" type="text" value="null" /> <br> <br> <input id="id_input2" type="text" value="null" /> <br> </body> </html>

xml布局文件,很簡單:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    tools:context=".JSAndroidActivity" >

    <WebView
        android:id="@+id/mWebView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="clickView"
        android:text="獲取" />

</LinearLayout>
mainActivity中的核心代碼是:
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
mWebView.addJavascriptInterface(jsInterface, "jsObj"); mWebView.loadUrl("file:///android_asset/index.html");
請理解核心代碼的詳細注釋

mainActivity代碼:
package com.homer.jsandroid;

import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.StringTokenizer;

import android.R.anim;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.pm.ActivityInfo;
import android.os.Bundle;
import android.os.Handler;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.widget.TextView;
import android.widget.Toast;

public class JSAndroidActivity extends Activity {
    private Activity mActivity = null;
    private WebView mWebView = null;
    private String message;
    private JsInterface jsInterface;
    private String[] params = null;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mActivity = this;
        // 鎖定橫屏
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
        setContentView(R.layout.main);
        params = new String[2];
        jsInterface = new JsInterface();
        showWebView();
    }

    @SuppressLint("SetJavaScriptEnabled")
    private void showWebView() {
        try {
            mWebView = (WebView) findViewById(R.id.mWebView);

            mWebView.requestFocus();

            mWebView.setWebChromeClient(new WebChromeClient() {
                @Override
                public void onProgressChanged(WebView view, int progress) {
                    JSAndroidActivity.this.setTitle("Loading...");
                    JSAndroidActivity.this.setProgress(progress);
                    if (progress >= 80) {
                        JSAndroidActivity.this.setTitle("JsAndroid Test");
                    }
                }
            });

            mWebView.setOnKeyListener(new View.OnKeyListener() {
                @Override
                public boolean onKey(View v, int keyCode, KeyEvent event) {
                    if (keyCode == KeyEvent.KEYCODE_BACK
                            && mWebView.canGoBack()) {
                        mWebView.goBack();
                        return true;
                    }
                    return false;
                }
            });
            // WebView的管理設置狀態
            WebSettings webSettings = mWebView.getSettings();
            // 設置android下容許執行js的腳本
            webSettings.setJavaScriptEnabled(true);
            // 編碼方式
            webSettings.setDefaultTextEncodingName("utf-8");
            /*
             * 使用這個函數將一個對象綁定到Javascript,因此可以從Javascript訪問的方法,
             * Android(Java)與js(HTML)交互的接口函數, jsObj 為橋連對象可隨意設值
             */
            mWebView.addJavascriptInterface(jsInterface, "jsObj");
            /*
             * Android(Java)訪問js(HTML)端代碼是通過loadUrl函數實現的,訪問格式如:
             * mWebView.loadUrl("javascript: showFromHtml()");
             */
            mWebView.loadUrl("file:///android_asset/index.html");
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    private class JsInterface {
        /**
         * js中通過window.jsObj.HtmlcallJava2("參數") 可以調用此方法並且把js中input中的值作為參數傳入,
         * 但這是在點擊js中的按鈕得到的,若實現點擊java中的按鈕得到,需要方法 clickView(View v)
         * 
         * @param param
         */
        public void HtmlcallJava2(final String param) {
            message = param;
            String str = message;
            StringTokenizer st = new StringTokenizer(str, ",;");
            while (st.hasMoreTokens()) {
                for (int i = 0; i < params.length; i++) {
                    params[i] = st.nextToken();
                    System.out.println(params[i]);
                }
            }
            Toast.makeText(JSAndroidActivity.this, param, Toast.LENGTH_SHORT)
                    .show();
        }
    }

    /**
     * button的點擊事件
     * 
     * @param v
     */
    public void clickView(View v) {
        runOnUiThread(new Runnable() {
            @Override
            public void run() {
                /**
                 * 調用js中的方法實現點擊java中的按鈕得到js中input的值
                 */
                mWebView.loadUrl("javascript: showHtmlcallJava2()");
            }
        });
    }
}
希望給大家帶來幫助,謝謝!

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved