美文网首页android技术博客Android开发Android开发经验谈
android中webView 的基本使用与属性总汇

android中webView 的基本使用与属性总汇

作者: 五万年前走丢了 | 来源:发表于2017-12-25 17:27 被阅读47次

    为了使APP更加具有灵活性和可控制性,我们通常会在APP中内嵌运营人员可以自由切换的网页。这时候我们就要用到一个神奇的控件webView。本篇文章由浅入深的详细介绍webView 的使用与各项属性,从最常用属性到最不常用属性依次进行了充分讲解。(本文是由易到难,由常用属性到不常用属性对webView进行了全面讲解,如非小白基础内容可直接跳过)

    一,我们先从最基本的功能入手,实现网页的展示。

    1,首先在布局中添加webView控件,添加网络权限。

    控件:

    <WebView 
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webView"
        />
    

    权限:

    <uses-permission android:name="android.permission.INTERNET"/>
    

    2,为控件加载资源。

    webView = (WebView) findViewById(R.id.webView);
    //加载本地资源
    //webView.loadUrl("file:///android_asset/house.html");
    //加载网络资源
    webView.loadUrl("http://daiba.com");
    

    本地资源必须是.html格式。存放于assets文件夹内。


    webView.png

    注意assets的层级关系。

    3,重写webView的返回逻辑,如果不重写以下代码,网页跳转到多级页面后按返回键不会返回到上一级页面而会作用在APP的webView页上。

    @Override
        public boolean onKeyDown(int keyCode, KeyEvent event) {
            if (keyCode == KeyEvent.KEYCODE_BACK
                    && event.getRepeatCount() == 0) {
                if (keyCode == KeyEvent.KEYCODE_BACK && webViewency.canGoBack()) {
                    webViewency.goBack();//返回上个页面
                } else {
                    finish();
                }
            }
            return true;
        }
    
    

    二,webView常用功能。

    1,监听网页的跳转和资源的加载

    webView.setWebViewClient(new WebViewClient(){
               @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                // TODO Auto-generated method stub
                  if (url.contains("daiba")) {
                   //如果网址中有daiba字样,程序将走这里。可以做intent跳转
                   Intent in = new Intent(A.this,B.class);
                   startActivity(in);
                   return true;
                   }else{
                   //如果没有走这里,继续加载网页。
                   view.loadUrl(url);
                    //返回值为true的时用WebView打开,为false时调用系统浏览器或第三方浏览器打开网络资源,如果没有判断语句可在最下方更改返回值。
                    return true;
                   }
                 
               
                return super.shouldOverrideUrlLoading(view, url);
            }
           });
    

    2,查看网页的加载进度

     webView.setWebChromeClient(new WebChromeClient() {
                @Override
                public void onProgressChanged(WebView view, int newProgress) {
                    // TODO Auto-generated method stub
                    if (newProgress == 100) {
                        // newProgress代表网页加载进度,到达100完成加载
    
                    } else {
                        // 正在加载中
    
                    }
    
                }
            });
    

    3,完善网页缓存机制

    webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
    /*LOAD_CACHE_ELSE_NETWORK是默认的网络缓存机制这里不建议使用,建议使用LOAD_DEFAULT。
    前者在H5页面更新后容易出现页面错乱。
    如果网页的cache-control为no-cache,在模式LOAD_DEFAULT下,根据cache-control(网页是否更新过)
    决定是否从网络上取数据,如果更新过就重新获取没有更新过使用缓存,断网时会出现错误页面;
    在LOAD_CACHE_ELSE_NETWORK模式下,无论是否有网络,只要本地有缓存,都使用缓存。
    本地没有缓存时才从网络上获取。
    如果网页的的cache-control为max-age=60,在两种模式下都使用本地缓存数据
    为了建立完善的缓存机制,建议先判断是否网络情况正常,正常情况使用使用LOAD_DEFAULT,
    无网络时,使用LOAD_CACHE_ELSE_NETWORK。*/
    

    缓存模式(5种)
    LOAD_CACHE_ONLY:不使用网络,只读取本地缓存数据
    LOAD_DEFAULT:根据cache-control决定是否从网络上取数据。
    LOAD_CACHE_NORMAL: API level 17中已经废弃, 从API level 11开始作用同LOAD_DEFAULT模式
    LOAD_NO_CACHE:不使用缓存,只从网络获取数据.
    LOAD_CACHE_ELSE_NETWORK,只要本地有,无论是否过期,或者no-cache,都使用缓存中的数据。

    三,加载复杂网页时对webView的简单调试

    public class MainActivity extends BaseActivity {
    private WebView webView;
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.test);             
            init();
        }
        
    
        private void init(){
           mWebView = (WebView) findViewById(R.id.webView);
            //WebView加载web资源
           mWebView.loadUrl("http://daiba.com");
            /* 设置支持Js,必须设置的,基本大多数网页都涉及js */  
            mWebView.getSettings().setJavaScriptEnabled(true);  
            /* 设置为true时表示支持使用js打开新的窗口 */  
           mWebView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);  
            /* 当网页需要保存数时据,设置下面属性 */  
            mWebView.getSettings().setDomStorageEnabled(true);  
            /* 设置为使用webview推荐的窗口,主要是为了配合下一个属性 */  
            mWebView.getSettings().setUseWideViewPort(true);  
            /* 设置网页自适应屏幕大小,该属性必须和上一属性配合使用 */  
            mWebView.getSettings().setLoadWithOverviewMode(true);  
            /* 启用还H5的地理定位服务 */  
            mWebView.getSettings().setGeolocationEnabled(true);  
            /* 设置是否允许webview使用缩放的功能 */  
            mWebView.getSettings().setBuiltInZoomControls(false);  
            /* 提高网页渲染的优先级 */  
            mWebView.getSettings().setRenderPriority(RenderPriority.HIGH);  
            /* 设置是否显示水平滚动条 */  
            mWebView.setHorizontalScrollBarEnabled(false);  
            /* 设置垂直滚动条是否有叠加样式 */  
            mWebView.setVerticalScrollbarOverlay(true);  
            /* 设置滚动条的样式 */  
            mWebView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);  
    
            }
        
    }
    

    相关文章

      网友评论

        本文标题:android中webView 的基本使用与属性总汇

        本文链接:https://www.haomeiwen.com/subject/jlzlgxtx.html