iPhone UIWebView lokale Ressourcen mit Javascript und Handhabung onorientationChange
https://stackoverflow.com/questions/843820
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianFrage
Ich versuche zu Server HTML Javascript und CSS Inhalte von einer lokalen Ressource der iPhone-Anwendung, und ich habe Probleme onOrientationChange Behandlung von Ereignissen und einschließlich dem externen Javascript.
Ich scheine in CSS zu können, richtig verknüpfen, aber kein Javascript. Ich versuche, das folgende Beispiel des Umgangs mit onOrientationChange ( Wie eine iPhone Website bauen), aber ich bin dazu diene, die Homepage von meiner App NSBundle main~~POS=TRUNC.
Ich habe versucht, eine Javascript-Funktion Befestigung an body.onorientationchange und aber weder Arbeit window.onorientationchange, wenn sie von UIWebView lokal (oder entfernt) serviert, aber es funktioniert, wenn ich die iPhone Safari bin mit.
<!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>
Lösung
Die Antwort kann von der Warnung zurückverfolgt werden ich in XCode bekommen:
Warnung: keine Regel-Datei zu verarbeiten '$ (project_dir) /html/orientation.js' vom Typ sourcecode.javascript für Architektur i386
XCode Setup * .js javascript als irgendeine Art von Quellcode benötigt, um in der Anwendung kompiliert werden, wenn ich es als eine Ressource so gelöst einschließen wollte ich es um 2 Dinge zu tun.
- js-Datei auswählen und im „Detail“ Ansicht deaktivieren Sie das Bullseye Spalte angibt, dass es Code kompiliert
- In der „Gruppen & Dateien“ Ansicht, die den „Targets“ Baum erweitern und erweitern Sie dann die Anwendung auf „Copy Bundle Ressourcen“ gehen und ziehen Sie die * JS-Dateien in es
Die Apple-Entwickler-Foren haben eine Lösung gepostet:
Es scheint, dass Sie werden immer etwas von die „Xcode denkt, dass Js Dinge zu erstellenden“-Funktion. Grundsätzlich Xcode denkt, dass das Skript sollte irgendwie laufen oder compiliert, so Markierungen werden es als Teil des Quellcodes. Quelle Code, natürlich, kopiert nicht in die Ressourcen.
Sie müssen also zwei Dinge tun - wählen die Js-Datei in Ihrem Projekt, und wiederum Aus dem Kontrollkästchen, das anzeigt, dass es wird kompiliert (das „Bullseye“ Säule). Wenn Sie dies nicht tun, werden Sie erhält eine Warnung in Ihrem Buildprotokoll über nicht in der Lage, die Datei zu kompilieren (Das sollte Ihre erste Warnung sein - immer versuchen, herauszufinden, und und korrigiert jegliche Warnung, dass erscheinen in Ihrem Build).
Dann ist es ziehen und es in der Drop Ziel des "Copy Bundle-Ressourcen".
Andere Tipps
Eine Antwort auf Ihr zweites Problem des onorientationchange Handler nicht in UIWebView genannt werden:
bemerkte ich, dass die window.orientation Eigenschaft nicht richtig funktioniert und der window.onorientationchange Handler nicht aufgerufen bekommt. Die meisten Anwendungen leiden dieses Problem. Dies kann durch die Einstellung der window.orientation Eigenschaft und rief window.onorientationchange im willRotateToInterfaceOrientation Methode der View-Controller festgelegt werden, die Ihre UIWebView enthält:
- (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;
}
}
Es ist besser zu nutzen
- (void) didRotateFromInterfaceOrientation: (UIInterfaceOrientation) fromInterfaceOrientation
da Safari tatsächlich orientationChange ruft nachdem die Ansicht gedreht hat.
Das ist mir wichtig war, weil ich brauchte, um meine HTML5 Leinwände, um die Größe, nachdem die Seite gedreht hatte, und ich wusste, wie groß es ist Container war.
fand ich einige zusätzliche Informationen für UIWebView mit lokalen Ressourcen.
Ich sammelte sie zusammen in einem kurzen Blog. Wenn jemand interessiert ist, gibt es ein funktionierendes Beispiel, dass Sie herunterladen können.
http://mentormate.com/blog/ iphone-UIWebView-Klasse-local-CSS-Javascript-Ressourcen /
ich gefunden habe, iOS 4.2 nicht window.orientation Eigenschaft in UIWebView, während in der mobilen Safari unterstützt es funktioniert ... So ist die einzige Art, wie ich gefunden, um meine JS reagieren zu Orientierungsänderungen zu machen war zu meinem Objective-C-Code Aufruf einer JavaScript-Funktion definiert in aktuell angezeigter UIWebView Webseite zu machen. Hier ist ein Beispielcode, zwingende Viewcontroller des didRotateFromInterfaceOrientation Methode:
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
[webView stringByEvaluatingJavaScriptFromString:
[NSString stringWithFormat:@"didRotateTo('%@')",
[self currentOrientationAsString]]];
}
- (NSString*) currentOrientationAsString {
switch([[UIDevice currentDevice] orientation]) {
case UIDeviceOrientationLandscapeLeft:
case UIDeviceOrientationLandscapeRight:
return @"landscape";
}
return @"portrait"; // assuming portrait is default
}
Sie müssen Ihre Javascript-Funktion wie folgt definieren:
function didRotateTo(ori) {
if (ori=="portrait") {
// ... do something
} else {
// ... do something else
}
}
Viel Spaß! :)
