Android WebView的坑总结

原创 2014年06月24日 14:13:20

       最近把做好的iPad HybridApp向Android迁移,碰到的坑太多了,让我这个折腾过Android接近4年的老鸟都头疼!现在把前人遇到的都列出来,再慢慢解决自己的,目前已经解决了android键盘覆盖问题,下面最棘手的问题就是屏幕高度的适配问题了!本文会不断更新

1、 Andrid4.1事件穿透BUG 原因不明



2、 Android2.X 中文不支持粗体


3、 目前发现的WEBVIEW尺寸宽度有320、 360、 400等多个尺寸 


该分辨率或许和屏幕尺寸有关
                                    目前测试结果
320-640分辨率-》320
720分辨率 –》360
800 分辨率 –》400

难道是手机宽度的一半?

屏幕密度的的问题啊 !!!



4、 原尺寸图片放到WEBVIEW里会显得很模糊,建议采用大图进行缩小 
比如 需要为300*100大小的图片,请使用600*200的来进行缩小


5、 ANDROID 2.X  TEXTAREA|INPUT等空间可能会出现移位的情况,原因也许与position:fix有关


6、 text-overflow:ellipsis;(字符串CSS截取)功能BUG:截取长度会把margin-left一起计算进去,导致含有margin-left的容器被截取内容过多。


7、 使用translate3d的位移会导致position:fixed的内置元素一起移动。此BUG更恶心的是,在IPHONE里会直接移掉,可在ANDROID里显示不会移动,但如果有事件的话,事件的可点击区域会位移。估计是ANDROID尝试修复没修复好。


8、 WEBVIEW内存限制12M(目前此问题尚未出现)


9、 ANDROID2.X不支持BOX-SHADOW


10、 不支持MASK


11、 支持CALC,使用时请注意防止被LESS预编译
  width:~"-webkit-calc(100% - 100px)";
margin: 0px 50px;

通过此方法可以很容易实现浮动元素居中,而不用去计算TOP LEFT 


12、android4.4 不支持target-densitydpi=device-dpi,Android4.3 以下版本支持,后面开发不能用这个target-densitydpi了

13、键盘弹出问题,Android软键盘会总是覆盖在Webview上,会遮挡输入框,让用户看不到输入的是什么,解决方法是键盘弹出时native层发出事件,javascript负责把页面上拉。IOS7.1键盘弹出的处理很好,页面会自动上拉

14、获取web页面的宽带和高度

。就是屏幕的宽度和高度。 

可以用screen.width和screen.height, 但实际测试发现有的设备会考虑屏幕密度,有的不考虑,比如有1280*720的手机用screen取得1280*720的分辨率,但实际对应的css分辨率只要640*360

 outerWidth谷歌官方不推荐用
var screenW = window.outerWidth ; 
var screenH = window.outerHeight; $("#msg").text("width:"+screenW+";height:"+screenH+";"); 
window.outerHeight在android上获取的还不是真正的屏幕分辨率高度。比如480×800的高度在海豚浏览器上获取的高度是762.宽度是480。在webkit的内置浏览器上也是这个值。说明跟浏览器无关。而这个差值可能是浏览器工具栏的高度。因为若开启了海豚浏览器的底部工具栏。这个高度值就变成了697. 
而在ipad2 上获取到的是768×1024. 



版权声明:本文为博主offbye西涛原创文章,未经博主允许不得转载。

Android Webview知识点和遇到过的坑全总结

Java和Android架构 欢迎关注我们,一起讨论技术,扫描和长按下方的二维码可快速关注我们。或搜索微信公众号:JANiubility。 公众号:JANiubility ...

android 中使用webView的坑(个人整理,非网上Copy别人的,只是总结而已)

安卓使用webView加载网页,遇坑总结: 1 、 先说点大家都知道的,要使用webView加载网页,让网页在自己的webView中显示,而不是打开其他浏览器的话,就要设置webView的setWe...

Android webview 踩坑经验总结

webview中涉及到的问题汇总 1、支持.apk文件下载 2、支持https请求 3、发送post请求 4、支持本地图片上传 5、支持调起微信、支付宝支付 6、Uncaught Reference...

Android-报错总结之一:WebView加载本地JS

webview加载本地h5、js报错,报错内容是Cannot read property 'giftDoctorUserInfo' of null

Android使用WebView加载文字总结之中文乱码、禁止横向滚动、自动换行

WebView总结:  其实之前的初衷是想满足在TextView或者EditText来显示文字中作复制功能,在网上也找了一些资料,好像都不行,也许是我自己的问题;  最终想想使用WebView来实现这...

Android入门--WebView使用总结

WebView,字面理解就是网页浏览,用于加载显示网页,类似浏览器,使用了WebKit渲染引擎加载显示网页,Android及iOS的webView的引擎都是webkit,对Html5提供支持.下面整理...
  • TTCCAAA
  • TTCCAAA
  • 2015年04月27日 16:15
  • 1401

Android WebView - 全面总结(概述、捕获url、js交互、小技巧、内存泄漏、缓存机制)

前言结合H5页面开发的App日渐多了起来,而WebView正是Html与Native的纽带,今天就借着一个新的项目需求顺便做一下WebView的知识总结,如有错漏,恳请大家指点指点。(项目需求:将适配...
  • Goo_x
  • Goo_x
  • 2016年07月29日 16:05
  • 2361

android WebView总结

浏览器控件是每个开发环境都具备的,这为马甲神功提供了用武之地,windows的有webbrowser,android和ios都有webview。只是其引擎不同,相对于微软的webbrowser,and...

Android WebView常见问题总结

本篇文章同大家分享下WebView使用的过程中经常出现的一些问题及解决方法 1、H5页面没法弹出对话框: 经常会碰到Js中Alert的对话框没法弹出,只需要添加以下几行代码就可以轻松解决m...

Android WebView使用总结

在Android中有WebView Widget,它内置了WebKit引擎,同时,WebKit也是Mac OS X的Safari网页浏览器的基础。WebKit是一个开源的浏览器引擎,Chrome浏览器...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android WebView的坑总结
举报原因:
原因补充:

(最多只允许输入30个字)