Android webview实战

今天来使用webview进行一个实例演练，可以基本用到任何地方，目的在于熟悉一下webview的使用，基本算是入门的吧。

先看一下效果图，

接下来我们看看如何实现

第一步：
首先加载网页的时候有个对话框，我们看看怎么实现的，

public class CustomDialog extends Dialog {
    private LayoutInflater inflater;
    public CustomDialog(Context context) {
        super(context);
        inflater = LayoutInflater.from(context);
        initView();
    }
    /**
     * 给对话框填充布局
     */
    private void initView() {
        View view = inflater.inflate(R.layout.dialog_layout, null);
        setContentView(view);
    }

    /**
     * 显示对话框
     */
    public void showDialog(){
        show();
    }
}

然后在页面加载失败的时候，我们需要去显示一个自定义的错误页面

布局文件如下

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/online_error_btn_retry"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#E6E6E6"
    android:clickable="true"
    android:gravity="center" >


    <TextView
        android:id="@+id/img_error"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:text="加载数据失败，请检查你的网络"
        android:textColor="#9e9e9e"
        android:textSize="16.0sp" />

    <Button
        android:id="@+id/error_btn_refresh"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/img_error"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="15dp"
        android:gravity="center"
        android:singleLine="true"
        android:text="重新加载"
        android:textColor="#9e9e9e" />

</RelativeLayout>

最后给出java代码，由于注释比较详细，就不慢慢讲了

public class WebViewActivity extends AppCompatActivity {
    private WebView webView;
    private boolean isErrorPage = false;
    private View mErrorView;
    private CustomDialog dialog;
    private String curretnUrl = "";
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_web_view);
        webView = (WebView) findViewById(R.id.webview);
        curretnUrl = getIntent().getStringExtra("curretnUrl");//获取跳转过来的url
        initView();
    }
    private void initView() {
        dialog = new CustomDialog(this);
        webView.setWebViewClient(new WebViewClient(){
            //重写此方法，自定义错误页面
            @Override
            public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
                isErrorPage = true;
                showErrorPage();
            }
            /**
             *
             * @param view 初始化回调的webview
             * @param url 需要加载的url
             * @return true表示url是根据程序执行的，false表示url是在webview内部执行的
             */
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                //此处如果返回true，只有在点击重新加载按钮时才会加载url
                //如果返回false，第一次进来加载时就会加载此url
                webView.loadUrl(url);
                return true;
            }
            @Override
            public void onPageFinished(WebView view, String url) {
                if(mErrorView!=null){
                    if(isErrorPage){
                        mErrorView.setVisibility(View.VISIBLE);
                    }
                }
            }
        });
        webView.loadUrl(curretnUrl);
        webView.setWebChromeClient(new WebChromeClient(){
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                if(newProgress>=90){
                    if(dialog!=null&&dialog.isShowing()){
                        dialog.dismiss();
                        if(mErrorView!=null){
                            if(isErrorPage){
                                mErrorView.setVisibility(View.VISIBLE);
                            }else{
                                mErrorView.setVisibility(View.GONE);
                            }
                        }
                    }
                }
            }
        });
        dialog.showDialog();
    }

    /**
     * 显示自定义的错误页面
     */
    private void showErrorPage() {
        initErrorPage();
        LinearLayout webParent  = (LinearLayout) webView.getParent();
         //移除LinearLayout上面的其他页面，只剩一个webview用于添加错误页面
        while(webParent.getChildCount() >1){
            webParent.removeViewAt(0);
        }
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.MATCH_PARENT);
        //将错误页面添加到webview中
        webParent.addView(mErrorView,0,params);
    }
    private void initErrorPage() {
        if(mErrorView == null){
            //初始化错误页面
            mErrorView = View.inflate(this,R.layout.activity_url_error,null);
            Button btn_reload = (Button) mErrorView.findViewById(R.id.error_btn_refresh);
            //点击按钮重新加载
            btn_reload.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    //重新加载
                    webView.reload();
                    if(dialog!=null){
                        dialog.showDialog();
                        isErrorPage = false;
                    }
                }
            });
        }
    }
}