Native与html5交互

目前主流的移动端开发是混合开发Hybrid
先说一下什么是Hybrid APP，它指的是半原半Web的混合类App，需要下载安装，看上去类似Native App，但只有很少的UI Web View，它极力打造类似原生的App。
学习Native和html5交互，我们要学两点：
1、怎么把一个html5界面当作控件一样显示在界面中。
2、怎么和html5进行数据交互。

Hybrid App简单的说就是一个WebView+HTML
先了解一下Android与HTML的交互
两种情况：
1. Android调用HTMl代码（Android调用HTML的脚本语言javascript）；
2. HTML调用Android

Android调用HTML代码，无非是用到webView，其中注意webView加载html文件的加载url地址填写：
打开本包内asset目录下的index.html文件
webView.loadUrl(“file:///android_asset/index.html”);
打开本地sd卡内的index.html文件
webView.loadUrl(“content://com.android.htmlfileprovider/sdcard/index.html”)
打开指定URL的html文件
webView.loadUrl(“http://www.baidu.com“)
具体的内容步骤如下：
1、设置允许执行JS脚本：
getSettings().setJavaScriptEnabled(true);
2、添加通信接口
webView.addJavascriptInterface(Interface,”InterfaceName”)
第一个参数就是我们需要自己建的一个类，里面添加一些方法，第二个参数 是我们在html中需要调用Android中方法的名字
3、JS调用Android
InterfaceName.MethodName
4、Android调用JS
webView.loadUrl(“javascript:functionName(“这里可以添加参数拼接”)”)
上代码实践操作

WebSettings settings = mWebView_ware_detal.getSettings();        settings.setJavaScriptEnabled(true);        //这个参数要改为false，不然加载图文的时候会发生阻塞的        settings.setBlockNetworkImage(false);        //允许有缓存，可以查询api文档了解里面的参数        settings.setAppCacheEnabled(true);        mWebView_ware_detal.loadUrl("http://内容自己填写.html");        webappinterface = new WebAppInterface(this);        //appInterface这里一定要和前端人员保持一致，这个是一个规范，协商一份文档和接口        mWebView_ware_detal.addJavascriptInterface(webappinterface, "appInterface");        //设置监听        mWebView_ware_detal.setWebViewClient(new WC());     /**     * **一个Android和html通讯的接口**     */    class WebAppInterface {        private Context context;        public WebAppInterface(Context context) {            this.context = context;        }        //javascript调用Android本地的方法还有很多很多需要我们去理解,        //比如调用我们手机的相机，调用本地相册，打电话，位置信息，存储数据等等        /**         *    javascript调用本地的         */        @JavascriptInterface        public void buy(long id) {            Toast.makeText(context, "选择购买商品", Toast.LENGTH_LONG).show();        }        /**         *    javascript调用本地的         */        @JavascriptInterface        public void addFavorites(long id) {            Toast.makeText(context, "添加喜爱", Toast.LENGTH_LONG).show();        }        /**         * Android调用javascript代码要在主线程里面         */        @JavascriptInterface        private void showDetail() {            runOnUiThread(new Runnable() {                @Override                public void run() {                    mWebView_ware_detal.loadUrl("javascript:showDetail(" + ware.getId() + ")");                }            });        }    }    /**     *设置监听器     * 监听器监听页面加载完，使用Android调用javascript中的方法     * ,要注意的是一定要先刷新完页面在调用javascript的方法传递数据     */    class WC extends WebViewClient {        //WebViewClient        @Override        public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {            return super.shouldOverrideUrlLoading(view, request);            //可以根据协议进行判断执行某些事件,            //if (request.equals("gang://"))        }        //页面加载完触发的方法，进行界面的时候有一个load效果        @Override        public void onPageFinished(WebView view, String url) {            super.onPageFinished(view, url);            if (mDialog != null && mDialog.isShowing()) {                mDialog.cancel();                webappinterface.showDetail();            }        }    }