WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用。

  webview有两个方法:setWebChromeClient 和 setWebClient

1)setWebClient:主要处理解析,渲染网页等浏览器做的事情

  WebViewClient就是帮助WebView处理各种通知、请求事件的。

2)setWebChromeClient:辅助WebView处理Javascript的对话框,网站图标,网站title,加载进度等 。

1 在Activity_main.xml

添加一个WebView组件

<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/webView"
/>

2 在AndroidManifest.xml设置访问网络权限

<uses-permission android:name="android.permission.INTERNET" />

3 在MainActivity中设置可以与JS可交互性

package com.example.helloworld;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView; public class MainActivity extends Activity {
private WebView webView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); webView = (WebView) findViewById(R.id.webView); WebSettings webSetting = webView.getSettings();
webSetting.setJavaScriptEnabled(true);
webView.setWebChromeClient(new WebChromeClient()); } @Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
return true;
} }

3.1)加载外部资源:

package com.example.helloworld;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView; public class MainActivity extends Activity {
private WebView webView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); webView = (WebView) findViewById(R.id.webView); WebSettings webSetting = webView.getSettings();
webSetting.setJavaScriptEnabled(true);
webView.setWebChromeClient(new WebChromeClient()); webView.loadUrl("http://baidu.com");
} @Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
} }

显示效果如下图所示:

3.2)加载本地资源

  把oldForm.html页面放在assets目录下

package com.example.helloworld;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView; public class MainActivity extends Activity {
private WebView webView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); webView = (WebView) findViewById(R.id.webView); WebSettings webSetting = webView.getSettings();
webSetting.setJavaScriptEnabled(true);
webView.setWebChromeClient(new WebChromeClient()); webView.loadUrl("file:///android_asset/oldForm.html");
} @Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}

oldForm.html

<!DOCTYPE html>
<html>
<head>
<title>oldForm.html</title>
<meta charset="utf-8" /> <script type="text/javascript" languate="javascript"> function showRangeValue1(){
var inputRanage= document.getElementById("inputRanage").value;
document.getElementById("showRange").innerHTML= inputRanage;
} function SayHello(){
alert("Hello guangzhou.");
} function testJS(){
document.getElementById("testDiv").innerHTML="Hello guangzhou! It is "+new Date();
} function formReset()
{
document.getElementById("register").reset();
document.getElementById("inputName").value ="";
}
</script>
</head>
<body>
<form action="/Html5Studio/action/GetHtml5Form" method="post" id="register" >
</form> username: <input type="text" id="inputName" name="inputName" form="register" value=""/> <br/>
year: <select name="inputYear" form="register" >
<option value=""></option>
<option value=""></option>
</select> <br/>
description: <textarea name="inputDescription" form="register" value="" ></textarea> <br/>
<hr/>
Email: <input type="email" name="inputEmail" form="register" value="" required placeholder="请输入合法的Email."/> <br/>
Url: <input type="url" name="inputUrl" form="register" value="" /><br/>
Date: <input type="date" name="inputDate" form="register"><br/>
Time: <input type="time" name="inputTime" form="register"><br/>
Month: <input type="month" name="inputMonth" form="register"><br/>
Week: <input type="week" name="inputWeek" form="register"><br/>
Number: <input type="number" min="" max="" step="" value="" id="inputNumber" name="inputNumber"/><br/>
Range: <input type="range" min="" max="" step="" value="" id="inputRanage" name="inputRanage" onClick="showRangeValue1()" />
<div id="showRange"></div> <br/>
Search: <input type="search" value="" name="inputSearch" results="n"/> <br/>
Color: <input type="color" name="inputColor"/> <br/>
Tel: <input type="tel" name="inputTel" value="" /> <br/> <input type="submit" value="Submit" form="register" />
<input type="reset" onclick="formReset()" value="Reset" form="register"/>
<input type="button" onclick="formReset()" value="Reset form">
<input type="button" value="SayHello" onclick="SayHello()">
<input type="button" value="testJS" onclick="testJS()">
<div id="testDiv"></div>
</body>
</html>

参考资料:

http://pixy.iteye.com/blog/1044890

http://www.cnblogs.com/shawn-xie/archive/2012/08/15/2638480.html

HTML5学习总结-10 Android 控件WebView显示网页的更多相关文章

  1. HTML5学习总结-11 IOS 控件WebView显示网页

    一 加载外部网页 1.使用UIWebView加载网页 运行XCode  新建一个Single View Application . 2 添加安全消息 添加以下消息到项目的  Info.plist &l ...

  2. Android:控件WebView显示网页

    WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient setWebClient:主要 ...

  3. Android:控件WebView显示网页 -摘自网络

    WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient setWebClient:主要 ...

  4. 安卓,网页控件,显示网页 Android, web controls, display web pages

    安卓,网页控件,显示网页Android, web controls, display web pages 作者:韩梦飞沙 Author:han_meng_fei_sha 邮箱:313134555@qq ...

  5. Android 控件的显示隐藏上下左右移动动画

    一.利用Android提供的左右移动工具类:AnimationUtils 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 LinearLayout ll_fi ...

  6. Android控件_TextView(显示文本框控件)

    一.TextView控件的常用属性  1.android:id——控件的id   2.android:layout_width——设置控件的宽度 wrap_content(包裹实际文本内容) fill ...

  7. Android控件重叠显示小记

    方案一 利用布局控件显示优先级 在xml中RelativeLayout,FrameLayout,靠后的控件显示在上层. 利用margin属性 margin属性可以控制控件间的距离,属性值为正值时,越大 ...

  8. Android 之 用WebView显示网页

    WebView可以使得网页轻松的内嵌到 app 里,还可以直接跟js相互调用. WebView有两个方法:setWebChromeClient 和 setWebClient (1) setWebCli ...

  9. 通过js给android控件WebView设padding

    项目中有个界面是用来显示一个网页的,很简单,放个WebView就ok了,可是返回按钮放在哪 ,ui的设计是在底部显示一个半透明的条,左边有一个返回按钮.这个条显示在内容上面.我有一个担心,就是要是最下 ...

随机推荐

  1. HashSet<T>类 用法

    HashSet<T>类主要是设计用来做高性能集运算的,例如对两个集合求交集.并集.差集等.集合中包含一组不重复出现且无特性顺序的元素 改变集的值的方法: HashSet<T>的 ...

  2. NHibernate无法将类型“System.Collections.Generic.IList<T>”隐式转换为“System.Collections.Generic.IList<IT>

    API有一个需要实现的抽象方法: public IList<IPermission> GetPermissions(); 需要注意的是IList<IPermission>这个泛 ...

  3. [【codechefCHSEQ22】Chef and Favourite Sequence(并查集)

    题目:http://hzwer.com/3419.html 题意:给你一个全是0的数列,有m种操作[Li,Ri],每次操作就将下标处于[Li,Ri]的元素取反.你可以选若干个操作来使这个数列最后变成别 ...

  4. webpack入坑之旅(四)扬帆起航

    这是一系列文章,此系列所有的练习都存在了我的github仓库中vue-webpack,在本人有了新的理解与认识之后,会对文章有不定时的更正与更新.下面是目前完成的列表: webpack入坑之旅(一)不 ...

  5. Linux内核参数配置

    Linux在系统运行时修改内核参数(/proc/sys与/etc/sysctl.conf),而不需要重新引导系统,这个功能是通过/proc虚拟文件系统实现的. 在/proc/sys目录下存放着大多数的 ...

  6. git 保存用户名和密码

    打开TortoiseGit控制面板 点击 Edit global .gitconfig文件 添加 [credential] helper = store OK了 你再登录一次之后密码就被记住了

  7. 51nod 1163贪心

    用优先队列来贪心,是一个很好地想法.优先队列在很多时候可以维护最值,同时可以考虑到一些其他情况. http://www.51nod.com/onlineJudge/questionCode.html# ...

  8. Jquery.min.js 下载

    Jquery 下载:http://www.jq22.com/jquery-info122

  9. python3.x + selenium 3.x 遇到的问题:Exception ignored in: <bound method Service.__del__ of <selenium.webdriver.firefox.service.Service object at 0x0045E450>>

    我解决了!!!from selenium import webdriverimport timedr = webdriver.Firefox(executable_path = '/Users/jin ...

  10. 美化select下拉框

    直接上干货: 需要的材料: change_select.js (文末会给出下载地址) 使用方法: 1.调用方法:<script type="text/javascript" ...