UIWebView cambia el tamaño del texto después de rotar: buscando una explicación para un error mágico o mi estupidez

Question

, así que tengo UIWebView en mi aplicación y cargo algo de HTML (artículo), pongo algo de CSS para que todo sea más agradable. Eso es simple y claro y todo es perfecto hasta que intente agregar lectura en la funcionalidad de paisaje y luego me di cuenta de que UIWebView ignora cualquier css "font-size" que he puesto en HTML y aumenta el tamaño de fuente drásticamente después de rotar al modo horizontal.

He pasado unas 4-5 horas (soy nuevo en la aplicación de programación de Iphone, pero soy bastante terco cuando se trata de hacer algo bien) tratando de arreglarlo. Intenté muchas opciones de configuración, NADA.

Y esta noche algo mágico ha sucedido. Basta con mirar a la fuente:

Paisaje con el error:

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)]; 

paisaje fijo (tamaño de la fuente no cambia más):

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)]; 

Como se puede ver que sólo añadido el mismo código una vez más y el margen aumentado (menos) en un punto. Y setFrame otra vez (no, no arregla el cambio de tamaño con solo un conjunto de setFrames).

Estoy feliz de que funcione, pero me gustaría saber CÓMO y POR QUÉ, así que puedo hacerlo "correctamente", porque ahora el código se ve estúpido y tiene 1 punto de margen alto en la parte inferior de la aplicación.

Y no pregunto por qué he tratado de copiar y pegar el mismo código de nuevo ..

Answer 1

Y la solución mágica fue:

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

Si sólo se sabía hace esta semana .. Tanto tiempo, tanto los nervios se perdieron ..

Answer 2

es probable que sólo necesita leer este

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

Del mismo modo, si se especifica solo se deduce el ancho de la ventana gráfica , la altura y la escala inicial de . Figura 3-15 muestra la prestación de la misma página web cuando la anchura de visualización se establece en 320. Observe que la orientación vertical se representa lo mismo que en la Figura 3-14, pero la orientación horizontal mantiene una anchura de 320 píxeles, que cambia la escala inicial y tiene el efecto de acercamiento cuando el usuario cambia a orientación horizontal.

Answer 3

me trataron su caso, pero sin suerte.

El soluion trabajó para mí era:

[recarga web View];

Answer 4

El Safari Web Content Guide también menciona cómo desactivar el autosizing de texto en el CSS, lo que solucionó el problema en mi caso.

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

Answer 5

Usando las dos primeras respuestas, la propiedad CSS:

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

y la etiqueta meta:

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

yo era capaz de inyectar tanto en un sitio web existente, el uso de este javascript código:

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); 

Utilizando el webViewDidFinishLoad del 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]; 

}