UIPopoverController内のUIWebViewのWikiモバイルページを表示

Question

UIPopoverController内のUIWebViewでwikiモバイルバージョンのWebページを開こうとします。私のcontentSizeForViewInPopover、または単にUIWebViewフレームを設定する方法に関係なく、または単にUIWebView.scalesPageToFit = YESを設定することに問題はありません。 Wikiモバイルのバージョンページのコンテンツサイズが私のUIWebViewよりも大きいようです。しかし、もし私がiPhone上でそれを使用しても、そのような問題はありません。ここでポップオーバーコントローラのための私のコードは次のとおりです。

//create a UIWebView UIViewController first 
WikiViewController *addView = [[WikiViewController alloc] init]; 
addView.contentSizeForViewInPopover = CGSizeMake(320.0, 480.0f); 

//then create my UIPopoverController 
popover = [[UIPopoverController alloc] initWithContentViewController:addView]; 
popover.delegate = self; 
[addView release]; 

//then get the popover rect 
CGPoint pointforPop = [self.mapView convertCoordinate:selectAnnotationCord 
             toPointToView:self.mapView]; 
CGRect askRect = CGRectMake((int)pointforPop.x, (int)pointforPop.y+10, 1.0, 1.0); 
[popover presentPopoverFromRect:askRect 
         inView:self.mapView 
     permittedArrowDirections:UIPopoverArrowDirectionRight animated:YES]; 
[self.mapView deselectAnnotation:annotation animated:YES]; 

、これはのUIWebViewを作成する上で、私のコードです：

- (void)viewDidLoad 
{ 
wikiWebView = [[UIWebView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 480.0f)]; 
wikiWebView.scalesPageToFit = YES; 
//or No, doesn't matter, it all get larger than this 
wikiWebView.delegate = self; 
self.view = wikiWebView; 
} 

すべてのコードは、誰もが私にいくつかの光を当てることができれば が、私は疑問に思う...典型的であるように見えます、どうもありがとうございます。

Answer 1

ああ、htmlに「width = device-width」という行があり、popoverコントローラからwebviewをロードすると、このpopoverコントローラが自動的にデバイスの幅を表示するのではなく、表示幅あなたは指定して、あなたの意見を醜くてファンキーにする。その投稿ではjQueryの問題であり、jQueryの方法で解決しました。私の問題では、それはwikiのモバイル版のhtmlの問題です。だから私は別の方法を試みるが、それに似ている。

私はwebViewdidloadデリゲートメソッドでコードを単純に追加し、最初にNSStringにURL htmlを取得し、NSStringインスタンスメソッドを使用して読み込まれたhtmlの "device-width"を検索し、それをビュー幅に置き換えて新しいNSString、この新しいNSStringでこのページを読み込みます。それでおしまい。

- (void) webViewDidFinishLoad:(UIWebView *)webView 
{ 
if (!alreadyReload) 
{ 
    NSString *webHTML = [NSString stringWithContentsOfURL:webView.request.URL encoding:NSUTF8StringEncoding error:NULL]; 
    NSRange range = [webHTML rangeOfString:@"device-width"]; 
    if ((range.location!=NSNotFound)&&(range.length != 0)) 
    { 
     webHTML = [webHTML stringByReplacingOccurrencesOfString:@"device-width" withString:@"whatever width you need" options:0 range:range]; 
     [webView loadHTMLString:webHTML baseURL:wikiWebView.request.URL]; 
     alreadyReload = YES; 
    } 
} 
} 

このようなものです。

ところで、私はこれをwikiのモバイル版でしか使用していないので、HTMLはシンプルで、この種の比較と置き換えはかなり簡単です。より一般的なケースで使用する場合は、別の方法で使用することもできます。

Answer 2

それは完全にロードされてから、再度修正HTMLでページ全体をリロードしているという後のhtml を変更することよりも、JavaScriptをを介してデバイス幅を操作するためにはるかに効率的です。これは、仕事（ともそれがビューポートの幅を変更するためにも、必要かどう考慮する）必要があります

：

​​

Answer 3

これは、ビューポートメタタグが存在しない場合、それはなりたAUC答え、の拡張バージョンです追加：ここでは

- (void)webViewDidFinishLoad:(UIWebView*)webView 
{ 
    int webviewWidth = (NSUInteger)webView.frame.size.width; 

    if (!webView.loading) { 

     NSString *jsCmd = [NSString stringWithFormat:@"try {var viewport = document.querySelector('meta[name=viewport]');if (viewport != null) {viewport.setAttribute('content','width=%ipx, initial-scale=1.0, user-scalable=1');} else {var viewPortTag=document.createElement('meta');viewPortTag.id='viewport';viewPortTag.name = 'viewport';viewPortTag.content = 'width=%ipx, initial-scale=1.0, user-scalable=1';document.getElementsByTagName('head')[0].appendChild(viewPortTag);}} catch (e) {/*alert(e);*/}", webviewWidth, webviewWidth]; 

     [webView stringByEvaluatingJavaScriptFromString:jsCmd]; 
    } 
} 

たちが320PX

try { 
    var viewport = document.querySelector('meta[name=viewport]'); 
    if (viewport != null) { 
     viewport.setAttribute('content', 
       'width=320px, initial-scale=1.0, user-scalable=1'); 
    } else { 
     var viewPortTag = document.createElement('meta'); 
     viewPortTag.id = 'viewport'; 
     viewPortTag.name = 'viewport'; 
     viewPortTag.content = 'width=320px,initial-scale=1.0, user-scalable=1'; 
     document.getElementsByTagName('head')[0].appendChild(viewPortTag); 
    } 
} catch (e) { 
    /*alert(e);*/ 
} 

の幅とのWebViewに注入されているJavascriptのかなりフォーマットされたコードです

必要に応じてtry/catchを削除できます。