Android WebView简单使用

最近app分享使用到了webview，闲暇时做个总结，以备以后需要

这个是xml代码，因为只需要展示webview，所以填充屏幕

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >


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

        <ProgressBar
            android:id="@+id/pb_loading"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:indeterminateDrawable="@drawable/shape_custom_prgressbar" />
    </FrameLayout>

</LinearLayout>

上文为了用户体验添加了一个进度条ProgressBar

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360" >

    <shape
        android:innerRadius="15dp"
        android:shape="ring"
        android:thickness="5dp"
        android:useLevel="false" >
        <gradient
            android:centerColor="#9f00"
            android:endColor="#f00"
            android:startColor="#fff"
            android:type="sweep" />
    </shape>

</rotate>

这里展示就借用百度网址啦，谢谢李彦宏，哈！

第一次做的时候发现按返回键就退出activity了，于是检测用户是否按下了返回键

public class WebViewActivity extends Activity {

    private WebView mWebView;
    private ProgressBar mProgressBar;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.webview_activity);
        mWebView = (WebView) findViewById(R.id.webView);
        mProgressBar = (ProgressBar) findViewById(R.id.pb_loading);
        WebSettings webSettings = mWebView.getSettings();
        //设置WebView属性，能够执行Javascript脚本
        webSettings.setJavaScriptEnabled(true);
        //设置可以访问文件
        webSettings.setAllowFileAccess(true);
        //设置支持缩放
        webSettings.setBuiltInZoomControls(true);
        //设置此属性，可任意比例缩放
        webSettings.setUseWideViewPort(true);
        //加载需要显示的网页
        mWebView.loadUrl("http://www.baidu.com");

        mWebView.setWebViewClient(new WebViewClient() {
            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                // 加载时
                mProgressBar.setVisibility(View.VISIBLE);
                super.onPageStarted(view, url, favicon);
            }

            @Override
            public void onPageFinished(WebView view, String url) {
                // 加载后
                mProgressBar.setVisibility(View.GONE);
                super.onPageFinished(view, url);
            }
        });
    }


    /**
     * 按下返回键推到上一层，而不是退出webview
     *
     * @param keyCode
     * @param event
     * @return
     */
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {
            mWebView.goBack();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
}

整体代码如上，为了以后方便这里记录下webview常用的一些属性，不要忘了需要添加网络权限。。。。

setJavaScriptEnabled(true);  //支持js
 setPluginsEnabled(true);  //支持插件
 setUseWideViewPort(false);  //将图片调整到适合webview的大小
 setSupportZoom(true);  //支持缩放
 setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); //支持内容重新布局
 supportMultipleWindows();  //多窗口
 setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);  //关闭webview中缓存
 setAllowFileAccess(true);  //设置可以访问文件
 setNeedInitialFocus(true); //当webview调用requestFocus时为webview设置节点
 webSettings.setBuiltInZoomControls(true); //设置支持缩放
 setJavaScriptCanOpenWindowsAutomatically(true); //支持通过JS打开新窗口
 setLoadWithOverviewMode(true); // 缩放至屏幕的大小
 setLoadsImagesAutomatically(true);  //支持自动加载图片

<p style="margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px; list-style: none; color: rgb(34, 34, 34); font-family: 微软雅黑; font-size: 14px; line-height: 24px;">　mWebView.getHeight()：当前mWebView显示的高度</p><p style="margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px; list-style: none; color: rgb(34, 34, 34); font-family: 微软雅黑; font-size: 14px; line-height: 24px;">　mWebView.getScrollY()：mWebView竖直方向上滚动的高度，若为0说明滚动条在顶部了</p>