最近在工作当中,需要实现在APP里面打开网页,于是仿照微信的浏览网页的页面,写出了这个Webview控件,有以下功能:
1、在加载网页的时候,顶部有一个进度条,显示当前加载进度;
2、设置了所有的页面都在该控件中显示,不调用其他的浏览器;
3、支持手势放大缩小;
4、支持双击屏幕放大缩小;
5、按后退按钮,回到上一个网页;
现在开始代码:
1、自定义一个webview,并在里面做好相关的设置:
public class MyWebView extends WebView {
private ProgressBar progressbar;
private Context mContext;
public MyWebView(Context context, AttributeSet attrs) {
super(context, attrs);
mContext = context;
// progressbar = new ProgressBar(context, null, android.R.attr.progressBarStyleHorizontal);
progressbar = (ProgressBar) LayoutInflater.from(context).inflate(R.layout.progressbar, null);
progressbar.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, 6, 0, 0));
addView(progressbar);
// setWebViewClient(new WebViewClient(){});
setWebChromeClient(new WebChromeClient());
setWebViewClient(new WebViewClient(){
@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
Toast.makeText(mContext, "Oh no! " + description, Toast.LENGTH_SHORT).show();
}
});
this.getSettings().setBuiltInZoomControls(true);
this.getSettings().setUseWideViewPort(true);
}
public class WebChromeClient extends android.webkit.WebChromeClient {
@Override
public void onProgressChanged(WebView view, int newProgress) {
if (newProgress == 100) {
progressbar.setVisibility(GONE);
} else {
if (progressbar.getVisibility() == GONE)
progressbar.setVisibility(VISIBLE);
progressbar.setProgress(newProgress);
}
super.onProgressChanged(view, newProgress);
}
}
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
LayoutParams lp = (LayoutParams) progressbar.getLayoutParams();
lp.x = l;
lp.y = t;
progressbar.setLayoutParams(lp);
super.onScrollChanged(l, t, oldl, oldt);
}
}
2、期中的progressBar的xml文件如下:
<?xml version="1.0" encoding="utf-8"?>
<ProgressBar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ProgressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:indeterminate="false"
android:maxHeight="10dip"
android:minHeight="10dip"
android:progress="50"
android:progressDrawable="@drawable/greenprogress" />
3、在activity中引用MyWebView控件:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MyActivity"
tools:ignore="MergeRootFrame" >
<com.weidongjian.weigan.webviewdemo.MyWebView
android:id="@+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent"></com.weidongjian.weigan.webviewdemo.MyWebView>
</FrameLayout>
4、activity的设置:
private MyWebView webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_my);
webView = (MyWebView) findViewById(R.id.webView);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadUrl("http://www.baidu.com/");
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_BACK && webView.canGoBack()) {
webView.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
其中的onKeyDown的目的就是为了实现按后退按钮,返回到之前的页面
最后,附上源代码,欢迎参阅(源代码用android studio写的,请注意)。