UIWebView如何触发其中的Web页面的Orientation事件?

最近在用sencha touch在iOS上试着开发一些native-like应用,遇到不少问题,其中之一就是通过UIWebView加载web页面时,如果转动屏幕,里面的Web页面不会自动适配高宽,但是用Safari浏览时却是可以的。

 

用Safari的Web检查器查看sencha touch生成的页面,发现sencha touch控件生成的HTML元素,都是指定了width/height的,当转动屏幕时,如果只是UIWebView转动,而不重新计算这些HTML元素的width/height,就会导致上述问题。

 

google了一下,这篇文章 中说Safari中之所以可以自动适配sencha touch产生的HTML元素,是由于Safari在转动屏幕时,会触发document的orientationchange事件,从而sencha touch可以捕获这个事件,重新计算控件产生的HTML元素的高宽,达到自动适配的目的。而UIWebView的orientation是你自己的程序处理的,你也要在获取orientation事件时告诉web的document,方法就是通UIWebView.stringByEvaluatingJavaScriptFromString。但具体如何触发呢?

 

就是给document产生一个orientationchange事件,剩下的由sencha touch处理好了(sencha touch的所有控件都可以响应这个事件重新计算高宽)。

 

示例代码:

//add by iame
var e = document.createEvent('Events');
e.initEvent('orientationchange', true, false); 
document.dispatchEvent(e);
 

不需要设置具体是landscape,portrait,只需要设置事件名称对就好了。sencha touch会在处理事件时,自动判断是landscape,还是portrait。

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值