android webview demo
WebView 包含了浏览网页功能空间
WebViewClient WebView 网页加载的处理器,例如加载开始,加载结束
WebChromeClient:侧重于WebView 处理界面部分的功能,例如显示进度条,对话框,标题
WebSettings,WebView的设置
JS的支持,类和注解
PS: 如果需要设置缩放比例:webview.setInitialScale(150);
webView 设置缩放比例
首先自定义一个接口,
package com.example.administrator.webviewdemo;
/**
* Created by Administrator on 2016/8/18.
*/
public interface WebSupport {
void updateProgress(int progress);
void updateTitle(String title);
}
自定义一个MyWebChromeClient,
package com.example.administrator.webviewdemo;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
/**
* Created by Administrator on 2016/8/18.
*/
public class MyWebChromeClient extends WebChromeClient {
WebSupport webSupport;
public MyWebChromeClient(WebSupport webSupport) {
this.webSupport = webSupport;
}
@Override
public void onProgressChanged(WebView view, int newProgress) {
//super.onProgressChanged(view, newProgress);
webSupport.updateProgress(newProgress);
}
@Override
public void onReceivedTitle(WebView view, String title) {
// super.onReceivedTitle(view, title);
webSupport.updateTitle(title);
}
}
拦截特定的url
自定义WebViewClient,
package com.example.administrator.webviewdemo;
import android.content.Context;
import android.content.Intent;
import android.graphics.Bitmap;
import android.net.Uri;
import android.util.Log;
import android.webkit.WebResourceRequest;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;
import java.net.MalformedURLException;
import java.net.URL;
/**
* Created by Administrator on 2016/8/18.
*/
public class MyWebViewClient extends WebViewClient {
Context context;
public MyWebViewClient(Context context) {
this.context = context;
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
return super.shouldOverrideUrlLoading(view, request);
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
boolean ret = super.shouldOverrideUrlLoading(view, url);
if(url.indexOf("58.com")>0) {
ret = true;
try {
URL u = new URL(url);
Log.d("kodulf", "login");
view.loadUrl("http://www.ganji.com");
} catch (MalformedURLException e) {
e.printStackTrace();
}
}else if(url.startsWith("tel:")){
Intent intent = new Intent(Intent.ACTION_CALL);
intent.setData(Uri.parse(url));
context.startActivity(intent);
ret = true;
}else if(url.startsWith("smsto://")){
Intent intent = new Intent(Intent.ACTION_SENDTO);
intent.setData(Uri.parse(url));
context.startActivity(intent);
ret = true;
}
return ret;
}
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
}
}
与javaScipt的交互:
在我们的main的文件夹下面,创建一个assets的文件夹,然后创建一个index.html的文件
<html>
<head>
<script type="application/javascript">
//1.创建方法,有一个js 要调用必须要有JavaScriptInterface
function callAndroid(msg){
//调用Android 代码
//window内部的对象都是有WebView(WebKit)来创建的
//如果使用WebView addJavaScriptInterface(Object,String)
//调用的这个方法,就能够将Object 对象,添加到JS的window中
//引用的时候,使用String 参数的内容作为对象名
//如果string=“hello” 那么就可以调用window.hello
//本例,使用Android
window.Android.showToast(msg);
}
function exitApp(){
window.Android.exitApp();
}
//获取Java内部的数据,只要Java 方法,返回字符串就可以了
//获取当前的手机的类型
function getDevice(){
//var device = window.Android.getDevice();
//document.write("phone type="+device);
document.write("phone type="+"hello");
}
</script>
</head>
<body>
<a href="http://m.58.com">跳到58</a>
<a href="tel://13391531070">打电话</a>
<a href="smsto://13391531070">发短息</a>
<button title="js 吐司" value="js 吐司" οnclick="callAndroid('toast')">click me and Toast</button>
<button title="退出" value="退出" οnclick="exitApp()">点击退出</button>
<button title="获取手机类型" value="获取手机类型" οnclick="getDevice()">获取手机类型,通过Android来获取,然后设置到js中</button>
</body>
</html>
创建一个接口:
package com.example.administrator.webviewdemo;
import android.content.Context;
import android.os.Build;
import android.webkit.JavascriptInterface;
import android.widget.Toast;
/**
* Created by Administrator on 2016/8/18.
*/
public class JsSupport {
public Context context;
public JsSupport(Context context) {
this.context = context;
}
//TODO 一定一定要记住了,方法要是注解,并且是public 的不然是不能够被调用到的,而且会报错:Uncaught TypeError: window
@JavascriptInterface
public void showToast(String msg){
if(msg!=null){
Toast.makeText(context,msg,Toast.LENGTH_LONG).show();
}
}
//TODO 一定一定要记住了,方法要是注解,并且是public 的不然是不能够被调用到的,而且会报错:Uncaught TypeError: window
@JavascriptInterface
public void exitApp(){
System.exit(0);
}
//TODO 一定一定要记住了,方法要是注解,并且是public 的不然是不能够被调用到的,而且会报错:Uncaught TypeError: window
@JavascriptInterface
public String getDevice(){
return Build.DEVICE;
}
}
MainActivity:
package com.example.administrator.webviewdemo;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.KeyEvent;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
import java.net.MalformedURLException;
import java.net.URL;
//
//public class MainActivity extends AppCompatActivity {
//
// @Override
// protected void onCreate(Bundle savedInstanceState) {
// super.onCreate(savedInstanceState);
// setContentView(R.layout.activity_main);
// WebView webView = (WebView)findViewById(R.id.webView);
// //必须要设置loadUrl里面的是http 开头的
// //webView.setWebViewClient(new WebViewClient());
// //webView.loadUrl("http://www.baidu.com");
// //
// //String data ="<html><body>我是网页</br><img width=800 src=\"http://www.pptbz.com/pptpic/UploadFiles_6909/201204/2012041411433867.jpg\"/></body></html>";
// String data ="<html><head><style>img{width:50% height =50%}</style></head><body>我是网页</br><img src=\"http://www.pptbz.com/pptpic/UploadFiles_6909/201204/2012041411433867.jpg\"/></body></html>";
// webView.loadData(
// data,
// "text/html;charset=UTF-8",
// null
// );
//
// //webView图片显示的问题,需要进行适配,需要客户端和服务器人员一起开发,服务器中的网页,不允许有尺寸。客户端需要使用css 控制图片的尺寸
// //通用规则,服务器返回的html 只是片段,没有《html》《body》《/body》</html> 只有内容,客户端需要手动的添加图片屏幕适配的内容
// //使用css来控制所有图片的适配;使用style 标签来定义图片的样式
// }
//}
public class MainActivity extends AppCompatActivity implements WebSupport {
/**
WebView 包含了浏览网页功能空间
WebViewClient WebView 网页加载的处理器,例如加载开始,加载结束
WebChromeClient:侧重于WebView 处理界面部分的功能,例如显示进度条,对话框,标题
WebSettings,WebView的设置
JS的支持,类和注解
*/
private WebView webView;
private ProgressBar progressbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = (WebView) findViewById(R.id.webView);
progressbar=(ProgressBar)findViewById(R.id.progressbar);
progressbar.setMax(100);
//如果是上面的直接loadUrl的话,会调用我们系统的浏览器去打开上面的网址,有了下面的webviewclient的设置,会在我们的应用中打开
// webView.setWebViewClient(new WebViewClient(){
// @Override
// public boolean shouldOverrideUrlLoading(WebView view, String url) {
// view.loadUrl(url);
// //return super.shouldOverrideUrlLoading(view, url);
// return true;
// }
// });
webView.setWebViewClient(new MyWebViewClient(this));
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);
settings.setDomStorageEnabled(true);
//settings.setTextZoom(150);
settings.setDisplayZoomControls(true);
settings.setDefaultFontSize(32);
// webView.setWebChromeClient(new WebChromeClient(){
// @Override
// public void onProgressChanged(WebView view, int newProgress) {
// super.onProgressChanged(view, newProgress);
// Log.d("kodulf","当前的进度"+newProgress);
//
// }
// });
webView.setWebChromeClient(new MyWebChromeClient(this));
//开启Js调用java代码的功能
//参数2,就是添加JS 中的window内部的对象
//
webView.addJavascriptInterface(new JsSupport(this),"Android");
//有两种方法,一种是直接的loadUrl,另一种是加载源码
//webView.loadUrl("http://m.58.com");//注意了,这里如果输入www.baidu.com的话有可能就打不开了
//我们将网页放在assets的目录下面,记住了
//TODO 记住了file .后面是三个/// 然后路径名是android_asset
webView.loadUrl("file:///android_asset/index.html");
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
//return super.onKeyDown(keyCode, event);
if(keyCode== KeyEvent.KEYCODE_BACK){
if(webView.canGoBack()){
webView.goBack();
return true;
}else{
System.exit(0);//推出程序
}
}
return super.onKeyDown(keyCode, event);
}
@Override
public void updateProgress(int progress) {
progressbar.setProgress(progress);
}
@Override
public void updateTitle(String title) {
setTitle(title);
}
}