2016-04-14 7 views
7

В iOS 9.2 HTML-рендеринг HTML WKWebView с таблицами с фиксированной шириной, превышающим ширину устройства, можно было бы сжать, чтобы уменьшить размер содержимого, добавив тег вида просмотра, например:WKWebView viewport shrink-to-fit не работает на iOS 9.3

<meta name="viewport" content="width=device-width, shrink-to-fit=YES"> 

Эта линия вызвал WKWebView эффективно уменьшить окно просмотра так, чтобы вся страница визуализации вписывается в виде рамы без необходимости скроллинга. Например, рассмотрим следующий код, при запуске в viewDidLoad в ванильным одном приложении вид:

WKWebViewConfiguration *wkWebConfig = [[WKWebViewConfiguration alloc] init]; 
WKWebView *newWebView = [[WKWebView alloc] initWithFrame:CGRectMake(0,40,self.view.frame.size.width, self.view.frame.size.height - 40) configuration:wkWebConfig]; 
NSString *toRender = @"<head><meta name=\"viewport\" content=\"width=device-width, shrink-to-fit=YES\"></head><body><table width=700 style='background-color: blue; color:white; font-size=20px'><tr><td>this is some text that is long enough to exceed the width of the iphone 6 unless shrink-to-fit is applied</td></tr></table></body>"; 
[newWebView loadHTMLString:toRender baseURL:nil]; 
[self.view addSubview:newWebView]; 

Содержание делает так:

enter image description here

Однако это поведение изменилось в 9.3. Идентичный код, работающий в 9.3 делает так:

enter image description here

(Хотя вы не можете видеть на скриншоте, есть горизонтальная полоса прокрутки)

Поиск другие вопросы по StackOverflow и в других местах, это похоже, большинство других людей предпочитают поведение 9.3. Тем не менее, мне нужно поведение 9.2, сжимаемое к месту. Итак, мой вопрос: кто-нибудь знает, как получить то же самое сглаживание в соответствии с поведением в 9.3? И кто-нибудь знает, намеренно ли это изменение, или ошибка, которая будет исправлена ​​в последующих выпусках?

Мой тестовый код можно найти на https://github.com/nsolter/NSWebViewShrinkTest, в частности https://github.com/nsolter/NSWebViewShrinkTest/blob/master/NSWebViewShrinkTest/ViewController.m

ответ

6

Я подал отчет об ошибке с Apple, и это ответ:

«Нет, мы не хотим, чтобы поддерживать термоусадочную к -fit. Обходным путем является использование метатега viewport, который правильно описывает ширину содержимого. "

Я попробовал это. Если в теге viewport вы указываете ширину фактической ширины html после ее рендеринга, она будет отображаться правильно на вашей ширине устройства. В моем примере выше, с шириной стола 700, если вы указали: <meta name=\"viewport\" content=\"width=700, shrink-to-fit=YES\">

Затем страница будет отображаться без горизонтальных полос прокрутки.

Обратите внимание, что вы не можете указать свойство видового экрана начального масштаба. Тогда он не отображается с соответствующей шириной.

Это, очевидно, не идеально, потому что вы, как правило, не знаете, какая ширина вашего визуализированного html будет пока вы его не визуализируете. Мое текущее решение состоит в том, чтобы сделать его один раз с шириной = ширина устройства, а затем визуализировать его снова с помощью width = X, где X - фактическая ширина отображаемой страницы в первый раз.

+0

Я также использую width = device-width и сталкивается с той же проблемой. Перегружаете ли вы страницу шириной = X ?? – anoop4real

+0

По существу, да. Я фактически показываю его в новом WKWebView, который в настоящее время не отображается, а затем заменяется на новый веб-просмотр. –

+1

У вас есть образцы? – anoop4real