Содержимое HTML соответствует UIWebview без масштабирования

Я использую UIWebView для отображения некоторого HTML. Однако, хотя ширина моего веб-представления составляет 320, мой HTML по-прежнему отображается по всей ширине и может прокручиваться по горизонтали.

Я хочу добиться того же самого, что и для собственного почтового приложения, которое подходит для всего содержимого в пределах этой ширины без масштабирования – как само по себе почтовое приложение визуализирует HTML как это?

Обновить

Я думал, что использование метатега viewport поможет, но я не мог заставить это работать.

Это то, что происходит:

введите описание изображения здесь

Как видите, содержимое не соответствует ширине устройства. Я пробовал так много комбинаций метатега viewport . Ниже приведен пример того, что происходит, когда я пробую предложение Мартинса.

Оригинальный HTML-код можно найти здесь .

То, как этот HTML-код создается почтовым почтовым приложением, выглядит так .

Вот что вы делаете:

В вашем controllerе пользовательского интерфейса, которому принадлежит веб-представление, сделайте его UIWebViewDelegate . Затем, когда вы устанавливаете URL для загрузки, установите делегат в качестве controllerа:

 NSString *urlAddress = @"http://dl.dropbox.com/u/50941418/2-build.html"; NSURL *url = [NSURL URLWithString:urlAddress]; NSURLRequest *requestObj = [NSURLRequest requestWithURL:url]; [webView loadRequest:requestObj]; webView.delegate = self; 

И, наконец, webViewDidFinishLoad: чтобы правильно установить уровень масштабирования:

Этот параметр применим к iOS 5.0 и>

 - (void)webViewDidFinishLoad:(UIWebView *)theWebView { CGSize contentSize = theWebView.scrollView.contentSize; CGSize viewSize = theWebView.bounds.size; float rw = viewSize.width / contentSize.width; theWebView.scrollView.minimumZoomScale = rw; theWebView.scrollView.maximumZoomScale = rw; theWebView.scrollView.zoomScale = rw; } 

Надеюсь, это поможет…

Вариант B, вы можете попробовать изменить HTML (этот пример выполняет задание, но он не идеален с точки зрения синтаксического анализа HTML. Я просто хотел проиллюстрировать свою точку зрения. Это работает для вашего примера и, вероятно, в большинстве случаев. 40, вероятно, можно обнаружить программно, я не пытался это исследовать.

 NSString *urlAddress = @"http://dl.dropbox.com/u/50941418/2-build.html"; NSURL *url = [NSURL URLWithString:urlAddress]; NSString *html = [NSString stringWithContentsOfURL:url encoding:[NSString defaultCStringEncoding] error:nil]; NSRange range = [html rangeOfString:@"div {max-width: %fpx;}", self.view.bounds.size.width - inset]; html = [NSString stringWithFormat:@"%@%@%@", [html substringToIndex:range.location], style, [html substringFromIndex:range.location]]; } [webView loadHTMLString:html baseURL:url]; 

Просто добавьте это:

 webView.scalesPageToFit = YES; 

Что для меня работало, так это выбрать UIWebView в Interface Builder и установить флажок «Scales Page To Fit»:

введите описание изображения здесь

Как правило, вы должны использовать метатег viewport. Но его использование очень неустойчиво, в основном, если вам нужна веб-страница с кросс-платформой.

Это также зависит от того, какой контент и css у вас есть.

Для моей домашней страницы iPhone, которая должна автоматически изменяться с портрета на lanscape, я использую это:

  

Если вам нужен специальный размер, вы также можете использовать событие:

  

с соответствующим funciton в вашем javascript:

 function updateOrientation() { if(Math.abs(window.orientation)==90) // landscape else // portrait } 

РЕДАКТИРОВАТЬ :

Увидев источник страницы, похоже, вы сделали это с помощью веб-редактора, не так ли?

Хорошо я понял. Ваш главный div имеет ширину 600 пикселей. Разрешение экрана iphone 320×480. 600> 320, поэтому он превышает границы экрана.

Теперь давайте сделаем несколько простых операций:

 320 / 600 = 0.53 480 / 600 = 0.8 

Таким образом, вы хотите уменьшить масштаб в 0,5 раза и максимум 0,8 раза. Позволяет изменить видовое окно:

  

Swift 3:

Используйте это расширение для изменения размера содержимого веб-браузера в зависимости от размера веб-представления.

 extension UIWebView { ///Method to fit content of webview inside webview according to different screen size func resizeWebContent() { let contentSize = self.scrollView.contentSize let viewSize = self.bounds.size let zoomScale = viewSize.width/contentSize.width self.scrollView.minimumZoomScale = zoomScale self.scrollView.maximumZoomScale = zoomScale self.scrollView.zoomScale = zoomScale } } 

Как вызвать?

 webViewOutlet.resizeWebContent() 
 @implementation UIWebView (Resize) - (void)sizeViewPortToFitWidth { [self stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"document.querySelector('meta[name=\"viewport\"]').setAttribute('content', 'width=%d;', false); ", (int)self.frame.size.width]]; } @end 

Вы можете создать NSAttributedString из HTML (сделать это на фоне):

 @implementation NSAttributedString (Utils) + (void)parseHTML:(NSString *)html withCompletion:(void (^)(NSAttributedString *completion, NSError *error))completion { dispatch_async(dispatch_get_global_queue( DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^(void){ NSError * __autoreleasing *error = nil; NSAttributedString *result = [[NSAttributedString alloc] initWithData:[html dataUsingEncoding:NSUTF8StringEncoding] options:@{NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType, NSCharacterEncodingDocumentAttribute: @(NSUTF8StringEncoding)} documentAttributes:nil error:error]; NSError *safeError = (error != nil) ? *error : nil; dispatch_sync(dispatch_get_main_queue(), ^(void){ completion(result, safeError); }); }); } @end 

И показать его с помощью экземпляра UITextView :

 [NSAttributedString parseHTML:htmlString withCompletion:^(NSAttributedString *parseResult, NSError *error) { bodyTextView.attributedText = parseResult; }]; 

Однако некоторые возможности компоновки могут испортиться при таком подходе.

Interesting Posts
Давайте будем гением компьютера.