Android Webview使用攻略
加载url的方式:
//方式1. 加载一个网页:
webView.loadUrl("https://www.baidu.com/");
//方式2:加载apk包中的html页面
webView.loadUrl("file:///android_asset/test.html");
//方式3:加载手机本地的html页面
webView.loadUrl("content://com.android.htmlfileprovider/sdcard/test.html");
webView前进后退:
//是否可以后退
Webview.canGoBack();
//后退网页
Webview.goBack();
//是否可以前进
Webview.canGoForward();
//前进网页
Webview.goForward();
//以当前的index为起始点前进或者后退到历史记录中指定的steps
//如果steps为负数则为后退,正数则为前进
Webview.goBackOrForward(intsteps);
常见的处理网页后退:
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KEYCODE_BACK) && webView.canGoBack()) {
webView.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
@Override
public void onBackPressed() {
if (webView.canGoBack()) {
webView.goBack();
return;
}
super.onBackPressed();
}
清除缓存:
//清除网页访问留下的缓存
//由于内核缓存是全局的因此这个方法不仅仅针对webview而是针对整个应用程序.
Webview.clearCache(true);
//清除当前webview访问的历史记录
//只会webview访问历史记录里的所有记录除了当前访问记录
Webview.clearHistory();
//这个api仅仅清除自动完成填充的表单数据,并不会清除WebView存储到本地的数据
Webview.clearFormData();
WebView的配置:
WebSettings webSettings = webView.getSettings();
//支持javascript
webSettings.setJavaScriptEnabled(true);
//持插件
webSettings.setPluginState(WebSettings.PluginState.ON);
//设置自适应屏幕
webSettings.setUseWideViewPort(true);
//缩放至屏幕的大小
webSettings.setLoadWithOverviewMode(true);
//缩放操作 是否支持
webSettings.setSupportZoom(false);
//设置内置的缩放控件。若为false,则该WebView不可缩放
webSettings.setBuiltInZoomControls(false);
//隐藏原生的缩放控件
webSettings.setDisplayZoomControls(true);
// 用WebView显示图片自适应屏幕,可使用这个参数 设置网页布局类型:1、 LayoutAlgorithm.NARROW_COLUMNS适应内容大小
// 2、LayoutAlgorithm.SINGLE_COLUMN : 适应屏幕,内容将自动缩放
webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
//设置WebView是否支持多窗口
webSettings.setNeedInitialFocus(true);
//设置DOM Storage缓存
webSettings.setDomStorageEnabled(true);
//设置缓存策略
webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE);
//设置可以访问文件
webSettings.setAllowFileAccess(true);
//支持通过JS打开新窗口
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
//支持通过JS打开新窗口
webSettings.setLoadsImagesAutomatically(true);
//设置编码格式
webSettings.setDefaultTextEncodingName("utf-8");
//请求焦点
webView.requestFocusFromTouch();
// 禁止即在网页顶出现一个空白,又自动回去
webView.setOverScrollMode(View.OVER_SCROLL_NEVER);
WebViewClient:
webView.setWebViewClient(new WebViewClient() {
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
//当网页开始加载
}
@Override
public void onPageFinished(WebView view, String url) {
//当网页加载完
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
return super.shouldOverrideUrlLoading(view, url);
//跳转过程中的url 是否需要拦截
}
@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
super.onReceivedError(view, errorCode, description, failingUrl);
//当加载错误
}
});
WebChromeClient
webView.setWebChromeClient(new WebChromeClient() {
@Override
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
//网页加载进度
}
@Override
public void onReceivedTitle(WebView view, String title) {
super.onReceivedTitle(view, title);
//获取到web标题
}
@Override
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
return super.onJsAlert(view, url, message, result);
//js弹出提示框
}
});
android调用js方法:
1、通过loadUrl();
String token = getToken();
//调用getToken方法
webView.loadUrl("javascript:getToken('" + token + "')");
2、通过evaluateJavascript();
该方法比第一种方法效率更高,因为该方法的执行不会使页面刷新,而第一种方法(loadUrl )的执行则会。该方法在Android 4.4 后才可使用。
webView.evaluateJavascript("javascript:getToken('" + token + "')",
new ValueCallback<String>() {
@Override
public void onReceiveValue(String value) {
//此处为 js 返回的结果
}
});
}
完整的代码
public class WebViewActivity extends AppCompatActivity {
private ImageView ivBack;
private TextView tvClose;
private TextView tvTitle;
private WebView webView;
private ProgressBar progress;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//去标题栏
if (getSupportActionBar() != null) {
getSupportActionBar().hide();
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
}
setContentView(R.layout.activity_webview);
init();
}
private void init() {
initView();
initWebView();
loadUrl();
setWebViewClient();
setWebChromeClient();
}
private void initView() {
ivBack = (ImageView) findViewById(R.id.iv_web_head_back);
tvClose = (TextView) findViewById(R.id.tv_web_head_close);
tvTitle = (TextView) findViewById(R.id.tv_web_head_title);
progress = (ProgressBar) findViewById(R.id.pb_web_progress);
webView = (WebView) findViewById(R.id.ev_web);
tvClose.setVisibility(View.INVISIBLE);
}
@SuppressLint("SetJavaScriptEnabled")
private void initWebView() {
WebSettings webSettings = webView.getSettings();
//支持javascript
webSettings.setJavaScriptEnabled(true);
//持插件
webSettings.setPluginState(WebSettings.PluginState.ON);
//设置自适应屏幕
webSettings.setUseWideViewPort(true);
//缩放至屏幕的大小
webSettings.setLoadWithOverviewMode(true);
//缩放操作 是否支持
webSettings.setSupportZoom(false);
//设置内置的缩放控件。若为false,则该WebView不可缩放
webSettings.setBuiltInZoomControls(false);
//隐藏原生的缩放控件
webSettings.setDisplayZoomControls(true);
// 用WebView显示图片自适应屏幕,可使用这个参数 设置网页布局类型:1、LayoutAlgorithm.NARROW_COLUMNS适应内容大小
// 2、LayoutAlgorithm.SINGLE_COLUMN : 适应屏幕,内容将自动缩放
webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
//设置WebView是否支持多窗口
webSettings.setNeedInitialFocus(true);
//设置DOM Storage缓存
webSettings.setDomStorageEnabled(true);
//设置缓存策略
webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE);
//设置可以访问文件
webSettings.setAllowFileAccess(true);
//支持通过JS打开新窗口
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
//支持通过JS打开新窗口
webSettings.setLoadsImagesAutomatically(true);
//设置编码格式
webSettings.setDefaultTextEncodingName("utf-8");
//请求焦点
webView.requestFocusFromTouch();
// 禁止即在网页顶出现一个空白,又自动回去
webView.setOverScrollMode(View.OVER_SCROLL_NEVER);
}
private void setWebViewClient() {
webView.setWebViewClient(new WebViewClient() {
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
//当网页开始加载
}
@Override
public void onPageFinished(WebView view, String url) {
//当网页加载完
if (webView.canGoBack()) {
//当前可以返回,显示关闭
tvClose.setVisibility(View.VISIBLE);
} else {
tvClose.setVisibility(View.GONE);
}
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
//跳转过程中的url 是否需要拦截
return super.shouldOverrideUrlLoading(view, url);
}
@Override
public void onReceivedError(WebView view, int errorCode, String description, String
failingUrl) {
super.onReceivedError(view, errorCode, description, failingUrl);
//当加载错误
}
});
}
private void setWebChromeClient() {
webView.setWebChromeClient(new WebChromeClient() {
@Override
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
//网页加载进度
if (progress == null) {
return;
}
if (newProgress == 100) {
progress.setVisibility(View.GONE);//加载完网页进度条消失
} else {
progress.setVisibility(View.VISIBLE);//开始加载网页时显示进度条
progress.setProgress(newProgress);//设置进度值
}
}
@Override
public void onReceivedTitle(WebView view, String title) {
super.onReceivedTitle(view, title);
//获取到web标题
if (!TextUtils.isEmpty(title)) {
tvTitle.setText(title);
}
}
@Override
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
return super.onJsAlert(view, url, message, result);
//js弹出提示框
}
});
}
protected void loadUrl() {
String url = "https://www.baidu.com/";
webView.loadUrl(url);
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KEYCODE_BACK)) {
handleBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
@Override
public void onBackPressed() {
handleBack();
}
/**
* 处理返回键
*/
private void handleBack() {
if (webView != null && webView.canGoBack()) {
webView.goBack();
} else {
finish();
}
}
@Override
protected void onDestroy() {
super.onDestroy();
if (webView != null) {
webView.destroy();
}
}
}
关于原生与js的交互:
最近项目里用到了很多h5模块,与原生的的交互很频繁。查阅了一些资料找了一些三方的库。
WebViewJavascriptBridge(推荐使用)
资料:
AgentWeb , 一个简洁易用的 Android Web 库
WebView深度学习(一)之WebView的基本使用以及Android和js的交互