UIWebView изменяет размер текста после поворота: ищет объяснение магической ошибки или моей глупости

поэтому у меня есть UIWebView в моем приложении, и я загружаю ему какой-то html (статью), добавляю CSS, чтобы сделать все лучше. Это просто и ясно, и все идеально, пока я не попытаюсь добавить чтение в альбомную функциональность, а затем я заметил, что UIWebView игнорирует любой размер шрифта css, который я разместил в HTML, и резко увеличил размер шрифта после поворота в альбомный режим.

Я провел около 4-5 часов (я новичок в программировании приложения Iphone, но я довольно упрям, когда речь заходит о том, чтобы что-то сделать правильно), пытаясь его исправить. Пробовал множество и множество опций конфигурации - НИЧЕГО.

И сегодня случилось что-то волшебное. Просто посмотрите на источник:

Пейзаж с ошибкой:

r = CGRectMake(0.0, 0.0, 480.0, 320.0);
[adView.view removeFromSuperview];
if (!isFullScreen) {
    minus = 50 + minus;
    [controlsView setFrame:CGRectMake(0, r.size.height - 50, r.size.width, 50)];        
} else {
    minus = 20; 
}

[textView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];  
[scrollView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];

Пейзаж исправлен (размер шрифта больше не изменяется):

r = CGRectMake(0.0, 0.0, 480.0, 320.0);
[adView.view removeFromSuperview];
if (!isFullScreen) {
    minus = 50 + minus;
    [controlsView setFrame:CGRectMake(0, r.size.height - 50, r.size.width, 50)];        
} else {
    minus = 20; 
}
[textView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];  
[scrollView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];

if (!isFullScreen) {
    minus = 1 + minus;
} else {
    minus = 20+1;   
}
[textView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];  
[scrollView setFrame:CGRectMake(0, 0, r.size.width, r.size.height - minus)];

Как вы можете видеть, я добавил один и тот же код еще раз и увеличил запас (минус) на одну точку. И снова сделал setFrame (нет, он не фиксирует изменение размера только с одним набором setFrames).

Я рад, что это работает, но я хотел бы знать, КАК И ПОЧЕМУ, поэтому я могу сделать это "правильно", потому что теперь код выглядит глупо и имеет 1-точечную шкалу высот в нижней части приложения.

И не спрашивайте, почему я попытался снова скопировать тот же код.

ОТВЕТЫ

Ответ 1

И магическое решение было:

<meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0;'>

Если бы я знал эту неделю назад.. Так много времени, столько нервов потерялось..

Ответ 2

В Safari Web Content Guide также упоминается, как отключить автоматизацию текста в CSS, который решил проблему в моем случае.

html {
    -webkit-text-size-adjust: none; /* Never autoresize text */
}

Ответ 3

Используя первые два ответа, свойство CSS:

html {
    -webkit-text-size-adjust: none; /* Never autoresize text */
}

и метатег:

<meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0;'>

Мне удалось ввести оба на существующий веб-сайт, используя этот код javascript:

var style = document.createElement(\"style\"); 
document.head.appendChild(style); 
style.innerHTML = "html{-webkit-text-size-adjust: none;}";
var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
viewPortTag.content = "width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;";
document.getElementsByTagName('head')[0].appendChild(viewPortTag);

Использование webViewDidFinishLoad из UIWebViewDelegate:

- (void)webViewDidFinishLoad:(UIWebView *)webView{

    NSString *javascript = @"var style = document.createElement(\"style\"); document.head.appendChild(style); style.innerHTML = \"html{-webkit-text-size-adjust: none;}\";var viewPortTag=document.createElement('meta');viewPortTag.id=\"viewport\";viewPortTag.name = \"viewport\";viewPortTag.content = \"width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;\";document.getElementsByTagName('head')[0].appendChild(viewPortTag);";
    [webView stringByEvaluatingJavaScriptFromString:javascript];

}

Ответ 4

Вам, вероятно, просто нужно прочитать это

http://developer.apple.com/safari/library/documentation/appleapplications/reference/safariwebcontent/UsingtheViewport/UsingtheViewport.html

Аналогично, если вы укажете только ширина видового экрана, высота и начальная. Рисунок 3-15 показывает рендеринг той же веб-страницы, когда ширина окна просмотра установлена ​​равной 320. Обратите внимание, что портретная ориентация отображается так же, как на рисунке 3-14, но ландшафтная ориентация поддерживает ширину 320 пикселей, что изменяет начальную шкалу и имеет эффект масштабирования, когда пользователь изменения ориентации ландшафта.

Ответ 5

Я попробовал ваше дело, но не повезло.

Содействие для меня было:

[обновление webView];