如何创建webview,先看Activity方法:
public class Hello extends Activity {
/** Called when the activity is first created. */
private WebView webview;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
webview= new WebView(this);
setContentView(webview);
webview.loadUrl("http://www.imf7.com/webapp/");
//设置支持JavaScript脚本
WebSettings webSettings = webview.getSettings();
webSettings.setJavaScriptEnabled(true);
//设置可以访问文件
webSettings.setAllowFileAccess(true);
//设置不支持缩放
webSettings.setBuiltInZoomControls(false);
//设置滚动条样式,去掉滚动条白边
webview.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
//设置WebViewClient
// 在WebView中而不是默认浏览器中显示页面 取消地址栏
webview.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
}
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
}
});
}
//设置回退
//覆盖Activity类的onKeyDown(int keyCoder,KeyEvent event)方法
@Override
public void onBackPressed() {
if (webview.canGoBack()) {
webview.goBack();
} else {
super.onBackPressed();
}
}
}
另外,AndroidManifest.xml中必须添加<uses-permission android:name="android.permission.INTERNET" />进行许可,放在<uses-sdk android:minSdkVersion="8" />下面就行。
Webview创建成功后我们来说一下开发过程中遇到的知识点:
1、取消APP标题:this.requestWindowFeature(Window.FEATURE_NO_TITLE);
2、让APP全屏:搜索一下,网上有方法,我这里因为项目不需要全屏就不贴了;
3、启用JS:【我们开发的是web项目,JS是必须的】
WebSettings webSettings = webview.getSettings();
webSettings.setJavaScriptEnabled(true);
4、滚动条白边问题:设置滚动条样式可解决
webview.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
5、禁止缩放功能:有些手机本身webview带有缩放
webSettings.setBuiltInZoomControls(false);
6、禁止横评:
AndroidManifest.xml里面的activity标签配置这样的参数:android:screenOrientation="portrait" //(landscape是横向,portrait是纵向)
7、取消链接点击后的黄圈圈:
本地程序办法:【不推荐】
利用是聚焦点来取消webview中链接点击后的黄圈圈:webview.setFocusable(false);
理由:如果页面中有表单输入框请不要使用此方法,webview失去焦点后软键盘将无法唤出,因此建议新打开一个webview来展现输入框。
CSS办法:【推荐】
a,div,p,ul,li,dl,dt,dd,input,span,em,strong,img { -webkit-tap-highlight-color:rgba(0,0,0,0);}
8、设置WebViewClient,让链接在WebView中而不是默认浏览器中显示,并取消链接跳转时的地址栏【顶部代码中的setWebViewClient方法】
9、覆盖Activity类的onKeyDown(int keyCoder,KeyEvent event)方法,让webview中的网页间支持返回功能【顶部代码有示例】
10、手指点击链接变换背景的方法:
ontouchstart和onmousedown时设置className
ontouchmove和onmouseup时移除添加的className
11、页面中的焦点图和图集展示采用Iscroll4来实现
12、webview中的字体加粗问题:
采用阴影来模拟加粗:text-shadow:0px 0px 1px #000;
13、表单为了漂亮用背景图片模拟
14、loading动画问题:
用CSS3写的loading会严重影响页面其他图片渲染的清晰度『但对内存和CPU没有太多影响』
使用GIF图片超级损耗CPU,尽可能不的要用,我的手机从0一下蹦到33%,直接红色报警了
最终的图片选择无动画的提示图片【等性能好的时候再加动画吧】
15、显示过多大图时内存持续升高,暂时没找到解决办法【不知道webview能不能清除不显示图片所占用的内存,可能我太弱了。。。】
16、所有图片利用初始显示no_default来实现惰性加载,以避免占用太多流量:<img data-url="file/253top_1628_1340242333.jpg" src="img/no_default.png" />
17、所有的列表采用滚动到最底部自动加载3次,之后点击更多加载【下拉滚动Iscroll4有案例,但不想整个列表都用这家伙,据说性能没保障,自己再研究研究怎么实现下拉刷新吧】
18、图集浏览:
通过更改URL锚点来解决当前图片刷新、分享、收藏等问题;
通过检测window.hashchange来修正无刷新浏览图片的后退功能;
19、CSS3帮了大忙,例如图片居中、自适应盒模型、阴影、圆角、简单的动画效果等等,但动画效果不宜过多,低配置的手机没那么强大。
最后:有记录会随时更新的!