Android应用之Hybird混合开发，集成web页面的方法尝试

总结下要点：

１.在Android项目代码目录的app/src/main目录下面创建个assets文件夹。

再在里面创建个web目录。把web的代码放进去。如：

２.Android应用中，activity布局界面上放置一个webview。

并做相关的配置：

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_second);

        WebView webView = (WebView) findViewById(R.id.webview);
        WebSettings webSettings = webView.getSettings();
//如果访问的页面中要与Javascript交互，则webview必须设置支持Javascript
        webSettings.setJavaScriptEnabled(true);
// 若加载的 html 里有JS 在执行动画等操作，会造成资源浪费（CPU、电量）
// 在 onStop 和 onResume 里分别把 setJavaScriptEnabled() 给设置成 false 和 true 即可
//支持插件
        //webSettings.setPluginsEnabled(true);
//设置自适应屏幕，两者合用
        webSettings.setUseWideViewPort(true); //将图片调整到适合webview的大小
        webSettings.setLoadWithOverviewMode(true); // 缩放至屏幕的大小

//缩放操作
        webSettings.setSupportZoom(true); //支持缩放，默认为true。是下面那个的前提。
        webSettings.setBuiltInZoomControls(true); //设置内置的缩放控件。若为false，则该WebView不可缩放
        webSettings.setDisplayZoomControls(false); //隐藏原生的缩放控件

//其他细节操作
        webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); //关闭webview中缓存
        webSettings.setAllowFileAccess(true); //设置可以访问文件
        webSettings.setJavaScriptCanOpenWindowsAutomatically(true); //支持通过JS打开新窗口
        webSettings.setLoadsImagesAutomatically(true); //支持自动加载图片
        webSettings.setDefaultTextEncodingName("utf-8");//设置编码格式

        // 设置可以访问文件
        webSettings.setAllowFileAccess(true);
        webSettings.setAllowFileAccessFromFileURLs(true);
        webSettings.setAllowContentAccess(true);
        webSettings.setDomStorageEnabled(true);
        webView.getSettings().setAllowFileAccessFromFileURLs(true);

        webView.setWebViewClient(new WebViewClient() {
            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                super.onPageStarted(view, url, favicon);
                Log.d("webapp","开始加载");
            }

            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                Log.d("webapp","加载结束");
            }

            // 链接跳转都会走这个方法
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                Log.d("webapp","Url："+ url );
                view.loadUrl(url);// 强制在当前 WebView 中加载 url
                return true;
            }
        });

        //核心方法, 用于处理JavaScript被执行后的回调
        webView.addJavascriptInterface(new JSInterface(), "justTest");
        //webView.loadUrl("http://192.168.156.87:10644");
        webView.loadUrl("file:///android_asset/web/index.html");
    }

核心调用：

webView.loadUrl("file:///android_asset/web/index.html");

注意本地文件路径的写法，必须是file:///android_asset/web/...

当然，也可以直接把webapp部署到网上，这个loadUrl传后台服务地址。但是这里用文件方式是考虑到终端４Ｇ网络访问慢，导致加载慢的问题。若是手机ａｐｐ或有线，无线网络，部署到后台最好。但是有利有弊吧，若每个项目各不相同，得打包部署多少个才够。放到本地的一个好处是终端可以在各个项目上用，而不用考虑服务端部署webapp的问题。

JS调用Android原生接口的方法：

//定义回调接口
    private final class JSInterface{
        @SuppressLint("JavascriptInterface")
        @JavascriptInterface
        public void testAndroid(String userInfo){
            System.out.println("JavaScript调用Android啦");
            Toast.makeText(SecondActivity.this, userInfo, Toast.LENGTH_LONG).show();
        }
    }

注意@JavascriptInterface这个注解不可少。因为Adnroid从１７ａｐｉ之后为了安全起见，只有这个注解的方法，才能被js调用。