iPhone UIWebView地域資源利用のJavascriptおよび取り扱いonorientationChange
https://stackoverflow.com/questions/843820
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian質問
ようにしているサーバー HTML、JavascriptやCSSコンテンツからのiPhoneアプリケーションの地域資源をうまく取り扱いonOrientationChangeイベントかどうかについては、外部です。
いることもできるでしょうへリンクCSSに正しくないです。私は利用しようと、以下の例の取り扱いonOrientationChange(を構築する方法をiPhoneサイト がんのページからアプリのNSBundle mainBundle.
また取り付けるjavascript関数。onorientationchange、ウインドウです。onorientationchangeながらUIWebView地（または遠隔での作品について知っておきましょiPhoneをご利用のサファリがあります。
<!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>
解決
その答えできから警告したにXCode:
警告:ルプファイル'$(PROJECT_DIR)/html/orientation.js'型sourcecode.javascriptのための建築i386
XCodeの設定*.jsのjavascriptなどのソースコードが必要、申請たいと思ってもこちらをご覧ください資源としているかのように2となる。
- を選択します。jsファイルの詳細ビューの選択を解除してbullseye欄でコンパイルされたコード
- の"グ&ファイル"のビューの拡大は、"目標"ツリー-拡大に適用し、その"コピーバンドル資源"をドラッグすると、以下のような*.jsファイルで
リンゴの発フォーラムでは掲載して解
でくれることを願っています"と南青山のイチョウ並木そばにあ にXcodeを考えます。jsているもの へのとりまとめ"です。基本的には、 Xcodeを考えるべきスクリプト なんとか実行されるため、マーク その一環として、ソースコードです。源 コードはもちろん、コピー の資源です。
る必要がありますいつもの選択 きます。jsファイルのプロジェクト、 offのチェックボックスをチェックすることを示す ベースで作成している（bullseye" にもなります。だいこん 取得で警告を発するビルドログにて できないコンパイルのファイル (すべき最初の警告- 常に出や 是正およびすべての警告 が構築).
その後ドラッグし、ドロップしても、 対象の"コピーバンドル資源".
他のヒント
ではないの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;
}
}
を用い
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation
以降、safariは、実際に通話orientationChange後のビューに転させます。
これは私にとって重要で必要なリサイズは私のHTML5後のキャンバスのページを回転させたと知っていたのできないシステムを構築した.
私はローカルリソースとのUIWebViewを使用するためのいくつかの追加情報を見つけました。
私は短いブログでそれらを一緒に収集しました。誰かが興味を持っている場合は、ダウンロードすることができ作業例があります。
http://mentormate.com/blog/ iphone-のUIWebViewクラスのローカル-CSS-javascriptの資源/ の
私はモバイルSafariでそれが動作しながら、iOSの4.2は、のUIWebViewでwindow.orientationプロパティをサポートしていないことがわかりました... だから、私は私のJSは、姿勢変化に対応させるために発見した唯一の方法は、私のObjective-Cのコードの呼び出し、現在表示のUIWebViewのWebページで定義されたJavaScript関数にすることでした。ここでのViewControllerのdidRotateFromInterfaceOrientationメソッドをオーバーライドするサンプルコードは、います：
- (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
}
あなたは次のようにJavaScript関数を定義する必要があります：
function didRotateTo(ori) {
if (ori=="portrait") {
// ... do something
} else {
// ... do something else
}
}
お楽しみください！ ：）
