Android_html5互動 彈框localstorage 存值 整體案例

標籤：

經曆2周多的時間 終於是完成了還算可以的android 整體案例了，分享下給大家  也希望自己有時間回過頭來看看當初研究android的糾結心情。痛苦的經曆是開發android 大部分都是在網上找解決方式 各種 錯誤 再接著找 解決方案  這個時候真的很蛋疼  現在終於能應用於項目了。

PS：我們的項目時 套殼 首頁用android 的 其他都是html5 完成  這就需要 學習 互動的問題了  廢話不多說了 也沒別的  想發牢騷下   O(∩_∩)O~

匯入 ksoap2-android-assembly-3.3.0-jar-with-dependencies.jar 

package com.example.user.testwap;

import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.os.Handler;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.KeyEvent;
import android.view.Menu;
import android.view.MenuItem;
import android.webkit.JavascriptInterface;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

import org.json.JSONArray;
import org.json.JSONObject;

import java.util.List;
import java.util.Timer;
import java.util.TimerTask;

import static android.net.Uri.*;

public class MainActivity extends AppCompatActivity {
    WebView webview;
    private PersonService service;
    private Handler mHandler = new Handler();
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //執行個體化WebView對象
        webview = new WebView(this);
        service =new PersonService();
        //設定WebView屬性，能夠執行Javascript指令碼   啟用javascript支援
        webview.getSettings().setJavaScriptEnabled(true);

        //啟用 LocalStorage 支援
        webview.getSettings().setDomStorageEnabled(true);
        String appCachePath = getApplicationContext().getCacheDir().getAbsolutePath();
        webview.getSettings().setAppCachePath(appCachePath);
        webview.getSettings().setAllowFileAccess(true);
        webview.getSettings().setAppCacheEnabled(true);

        //new類名，互動訪問時使用的別名
        webview.addJavascriptInterface(new JavaScriptInterface(), "demo");
        //js彈出
        webview.setWebChromeClient(new WebChromeClient());
        try {
            //設定開啟的頁面地址
            webview.loadUrl("http://192.168.16.39:8901/");

            webview.setWebViewClient(new WebViewClient() {
                public boolean shouldOverrideUrlLoading(WebView view, String url) {
                    //  重寫此方法表明點擊網頁裡面的連結還是在當前的webview裡跳轉，不跳到瀏覽器那邊
                    view.loadUrl(url);
                    return true;
                }

            });


        }
        catch(Exception ex)
        {
            ex.printStackTrace();
        }
        setContentView(webview);
    }

public final  class JavaScriptInterface {
    @JavascriptInterface
    public void getPersonList(){
        mHandler.post(new Runnable() {
            public void run() {

            webview.loadUrl("javascript:wave()");//執行html布局檔案中的javascript函數代碼--

        } catch (Exception e) {
            // TODO: handle exception
        }
            }
        });
    }
    @JavascriptInterface
    public void postPay(String data) {
        String dd = data;

    }
    @JavascriptInterface
    public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
        if (message.length() != 0) {
            AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
            builder.setTitle("From JavaScript").setMessage(message).show();
            result.cancel();
            return true;
        }
        return false;
    }
    //打電話的方法
    @JavascriptInterface
    public void call(String mobile){
        Toast.makeText(MainActivity.this, mobile, Toast.LENGTH_LONG).show();
        //Intent intent = new Intent(Intent.ACTION_CALL, Uri.parse("tel:"+ mobile));
        //startActivity(intent);
    }
}

@JavascriptInterface  //必須加入這個註解  否則可能app 與 html 5 不能互動

html 頁面
<input type=‘button‘ onclick=‘window.demo.call("335623365")‘ value=‘app存值‘　/>  // 可以調用到app  的 call 方法  
<script type="text/javascript">

function wave() {
alert(123456);

}

</script>

html5 頁面的js 放在哪自己安排 只要是html頁面就行了 別放app裡就好

最後加入許可權在AndroidManifest.xml 頁面

<!-- 連網許可權 -->
<uses-permission android:name="android.permission.CALL_PHONE" />
<uses-permission android:name="android.permission.INTERNET" />
<!-- 讀寫權限 -->
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

這個整體案例 集合了 localstorage 本機存放區  app與html5 互動 彈窗 

Android_html5互動 彈框localstorage 存值 整體案例