我正在尝试从iPhone应用程序的本地资源中提供HTML Javascript和CSS内容,而且我在处理onOrientationChange事件和包括外部Javascript时遇到了问题.
我似乎能够正确地链接CSS但不是javascript.我正在尝试使用以下处理onOrientationChange的示例(如何构建iPhone网站),但我正在从我的应用程序的NSBundle mainBundle提供网页.
我尝试将一个javascript函数附加到body.onorientationchange和window.onorientationchange,但是当从本地(或远程)从UIWebView提供时,它都不起作用,但是如果我正在使用iPhone Safari,它就可以工作.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>How to build an iPhone website</title>
<meta name="author" content="will" />
<meta name="copyright" content="copyright 2008 www.engageinteractive.co.uk" />
<meta name="description" content="Welcome to engege interactive on the iPhone!" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<link rel="apple-touch-icon" href="images/template/engage.png"/>
<style type="text/css">
@import url("iphone.css");
</style>
<!--
<script type="text/javascript" src="orientation.js"></script>
-->
<script type="text/javascript">
function updateOrientation(){
try {
var contentType = "show_normal";
switch(window.orientation){
case 0:
contentType = "show_normal";
break;
case -90:
contentType = "show_right";
break;
case 90:
contentType = "show_left";
break;
case 180:
contentType = "show_flipped";
break;
}
document.getElementById("page_wrapper").setAttribute("class", contentType);
//alert('ORIENTATION: ' + contentType);
}
catch(e) {
alert('ERROR:' + e.message);
}
}
window.onload = function initialLoad(){
try {
loaded();
updateOrientation();
}
catch(e) {
alert('ERROR:' + e.message);
}
}
function loaded() {
document.getElementById("page_wrapper").style.visibility = "visible";
}
</script>
</head>
<body onorientationchange="updateOrientation();">
<div id="page_wrapper">
<h1>Engage Interactive</h1>
<div id="content_left">
<p>You are now holding your phone to the left</p>
</div>
<div id="content_right">
<p>You are now holding your phone to the right</p>
</div>
<div id="content_normal">
<p>You are now holding your phone upright</p>
</div>
<div id="content_flipped">
<p>This doesn't work yet, but there is a chance apple will enable it at some point, so I've put it in anyway. You would be holding your phone upside down if it did work.</p>
</div>
</div>
</body>
</html>
Dou*_*kem 47
答案可以从我在XCode中获得的警告中找到答案:
警告:没有规则处理架构i386类型sourcecode.javascript的'$(PROJECT_DIR)/html/orientation.js'文件
XCode设置*.js javascript作为某种类型的源代码需要在应用程序中编译时我想将它作为资源包含,所以我通过做两件事来解决它.
Apple dev论坛有一个发布的解决方案:
看来你已经得到了"Xcode认为.js是要编译的东西"功能.基本上,Xcode认为脚本应该以某种方式运行或编译,因此将其标记为源代码的一部分.当然,源代码不会复制到资源中.
因此,您需要做两件事 - 在项目中选择.js文件,然后关闭表明它已编译的复选框("bullseye"列).如果你不这样做,你会在你的构建日志中收到关于无法编译文件的警告(这应该是你的第一个警告 - 总是试图找出并纠正你的构建中出现的任何和所有警告).
然后拖动它并将其放入目标的"复制包资源"中.
Mar*_*Thé 24
回答你未在UIWebView中调用onorientationchange处理程序的第二个问题:
我注意到window.orientation属性不能正常工作,并且不会调用window.onorientationchange处理程序.大多数应用程序遇到此问题 这可以通过设置window.orientation属性并在包含UIWebView的视图控制器的willRotateToInterfaceOrientation方法中调用window.onorientationchange来修复:
- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
switch (toInterfaceOrientation)
{
case UIDeviceOrientationPortrait:
[webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return 0;});window.onorientationchange();"];
break;
case UIDeviceOrientationLandscapeLeft:
[webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return 90;});window.onorientationchange();"];
break;
case UIDeviceOrientationLandscapeRight:
[webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return -90;});window.onorientationchange();"];
break;
case UIDeviceOrientationPortraitUpsideDown:
[webView stringByEvaluatingJavaScriptFromString:@"window.__defineGetter__('orientation',function(){return 180;});window.onorientationchange();"];
break;
default:
break;
}
}
最好使用
因为safari实际上是在视图旋转后调用orientationChange.
这对我很重要,因为我需要在页面旋转后调整HTML5画布的大小,我知道它的容器有多大.