android基础---->WebView的使用
webView的使用
我们通过一个小的测试程序来体会webView的简单使用,项目结构如下:
一、 webView加载页面,重写shouldOverrideUrlLoading方法,不使用系统默认的浏览器:
private WebView webView; private EditText editText; private String htmlUrl = "file:///android_asset/index.html"; private void initComponent() { webView = (WebView) findViewById(R.id.webView); editText = (EditText) findViewById(R.id.editText); } @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initComponent(); webView.getSettings().setJavaScriptEnabled(true); // 支持javascript webView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); // 根据传入的参数再去加载新的网页 return true; // 表示当前WebView可以处理打开新网页的请求,不用借助系统浏览器 } }); }
二、 用webView加载url资源:
// 请求url资源: public void searchURL(View view) { String urlStr = editText.getText().toString(); webView.loadUrl(htmlUrl); }
三、 用webView加载数据:
// 加载html代码片断 public void loadDataMethod(View view) { String summary = "<html><body>You scored <b>192</b> points.</body></html>"; webView.loadData(summary, "text/html", "utf-8"); }
四、 我们还可心在请求的html资源中,加入带有andoroid支持的JS代码。例如在js中使用toast,首先我们定义一个类,供在js中调用:
public class AppUseJSInterface { Context mContext; AppUseJSInterface(Context c) { mContext = c; } @JavascriptInterface public void showToast(String toast) { Toast.makeText(mContext, toast, Toast.LENGTH_LONG).show(); } }
接着我们在android代码中使用addJavascriptInterface方法,关联js与android:
// 请求html资源,在js中使用android public void searchHTML(View view) { // 给这个对象起的别名叫“huhxJS” webView.addJavascriptInterface(new AppUseJSInterface(this), "huhxJS"); webView.loadUrl(htmlUrl); }
最后我们在js中使用android定义的接口:
<script type="text/javascript"> function androidJS() { var username = document.getElementById("username").value; var password = document.getElementById("password").value; huhxJS.showToast("username: " + username + ", password: " + password); } </script>
五、 我们还可以在andoird中调用js代码,如下:
在android调用js中的javascriptJS函数:
// 在android中调用js public void useJSInAndroid(View view) { String name = "I love you"; webView.loadUrl("javascript:javascriptJS('" + name + "')"); }
在js中定义javascriptJS()函数:
function javascriptJS(some) { huhxJS.showToast(some); }
六、 实现webView的回退功能:
@Override public boolean onKeyDown(int keyCode, KeyEvent event) { // Check if the key event was the Back button and if there's history if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) { webView.goBack(); return true; } else if (keyCode == KeyEvent.KEYCODE_FORWARD && webView.canGoForward()) { webView.goForward(); return true; } return super.onKeyDown(keyCode, event); }
七、 测试加载用的页面:index.html
<html> <head> <script type="text/javascript"> function androidJS() { var username = document.getElementById("username").value; var password = document.getElementById("password").value; huhxJS.showToast("username: " + username + ", password: " + password); } function javascriptJS(some) { huhxJS.showToast(some); } </script> </head> <body> <form action="#" method="get"> <font color="red">username:</font> <input type="text" id="username" name="username"><br> <font color="red">password:</font> <input type="password" id="password" name="password"><br> <input type="submit" value="submit"> </form> <Button onclick="androidJS()">ClickOnMe</Button> </body> </html>
友情链接
作者:
huhx
出处: www.cnblogs.com/huhx
格言:你尽力了,才有资格说自己的运气不好。
版权:本文版权归作者huhx和博客园共有,欢迎转载。未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则保留追究法律责任的权利。
出处: www.cnblogs.com/huhx
格言:你尽力了,才有资格说自己的运气不好。
版权:本文版权归作者huhx和博客园共有,欢迎转载。未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则保留追究法律责任的权利。