一般来说,可能第一时间想到的是自定义一个html来替代webview内置的异常页面。 但是实际操作时,这种方法比较困难。
这里介绍一个简单的替代方案,希望能有所帮助。
可以采用嵌套layout的方式,然后在webview的错WebViewClient的onReceivedError方法中控制异视图的显示和隐藏,具体代码如下:
public class DefaultWebViewClient extends WebViewClient {
boolean isInErrorState = false;
@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
//这里可以将异常信息也显示出来
isInErrorState = true;
mEmptyView.setVisibility(View.VISIBLE);
webView.setVisibility(View.GONE);
mEmptyViewIndicator.setImageResource(R.drawable.no_service);
mEmptyView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
isInErrorState = false;
webView.reload();
}
});
// super.onReceivedError(view, errorCode, description, failingUrl);
} @Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
if(!isInErrorState) {
mEmptyView.setVisibility(View.GONE);
webView.setVisibility(View.VISIBLE);
}else {
mEmptyView.setVisibility(View.VISIBLE);
webView.setVisibility(View.GONE);
}
super.onPageStarted(view, url, favicon);
}
}
对应的layout如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
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"
android:layout_gravity="center_horizontal" />
<LinearLayout
android:orientation="vertical" android:layout_width="match_parent"
android:id="@+id/empty_view_root"
android:layout_height="match_parent"
android:gravity="center"
android:paddingTop="50dp"
android:paddingBottom="50dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/empty_view_indicator"
android:layout_gravity="center"
android:src="@drawable/pic_nothing" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/empty_view_text"
android:textColor="#999999"
android:singleLine="false" />
</LinearLayout>
</RelativeLayout>