UIWebView: cargue el sitio web externo, establezca la escala de zoom inicial programáticamente y permita al usuario hacer zoom posteriormente

Question

¿Es posible hacer todo lo anterior? SO me ha dado una excelente manera de configurar la escala de zoom inicial here. A saber, para incluir la siguiente línea en mi método webViewDidFinishLoad:

[webView stringByEvaluatingJavaScriptFromString: @"document.body.style.zoom = 5.0;"]; 

Pero lo que todavía no puedo hacer es permitir al usuario cambiar la relación de zoom después de que el programa establece inicialmente ella. Si configuro scalePagesToFit en NO, el usuario no puede cambiar la escala de zoom. Y si configuro scalePagesToFit en SÍ, anula mi zoom programático.

¿Alguien puede ayudar?

EDIT: gracias por la respuesta. Pero si hago zoom en la vista de desplazamiento, las cosas se difuminan un poco.

Answer 1

se puede añadir o modificar una etiqueta <meta name='viewport' para lograrlo. documentación de Apple en la etiqueta meta/visor aquí:

https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html

He aquí un ejemplo de cómo agregar la etiqueta una vez que se ha cargado el documento:

- (void) webViewDidFinishLoad:(UIWebView *)webView 
{ 
    NSString* js = 
    @"var meta = document.createElement('meta'); " \ 
    "meta.setAttribute('name', 'viewport'); " \ 
    "meta.setAttribute('content', 'width = device-width, initial-scale = 5.0, user-scalable = yes'); " \ 
    "document.getElementsByTagName('head')[0].appendChild(meta)"; 

    [webView stringByEvaluatingJavaScriptFromString: js];   
} 

Si la página web que está cargando ofrece una ya existente Metaetiqueta puede necesitar modificarla en lugar de intentar agregar un nuevo elemento meta al DOM. Esta pregunta SO discute la técnica:

Can I change the viewport meta tag in mobile safari on the fly?

En mi aplicación de prueba fijo el UIWebViewscalesPageToFit a SÍ.

Answer 2

Parece que se puede acceder al UIScrollView subyacente desde iOS 5.x.

En webViewDidFinishLoad: puede solicitar un zoom, por ejemplo:

[webView.scrollView zoomToRect:CGRectMake(0.0, 0.0, 50.0, 50.0) animated:YES]; 

Esto parece funcionar incluso con scalesPageToFit conjunto de YES.

Answer 3

trate de cambiar el orden en que se está configurando estos comandos - scalePagesToFit primero en Sí y luego:

[webView stringByEvaluatingJavaScriptFromString: @"document.body.style.zoom = 5.0;"]; 

Answer 4

Esto es realmente brillante. Necesitaba tener la capacidad de zoom, mientras que scalePagesToFit es NO. Aunque su código TomSwift no funcionó como lo necesitaba, un pequeño ajuste hizo el truco.

Estoy ejecutando esto en iOS 6.x ... funciona como un encanto.

NSString* js = 
     @"var meta = document.createElement('meta'); " \ 
     "meta.setAttribute('name', 'viewport'); " \ 
     "meta.setAttribute('content', 'width = device-width, initial-scale=1.0, minimum-scale=0.2, maximum-scale=5.0; user-scalable=1;'); " \ 
     "document.getElementsByTagName('head')[0].appendChild(meta)"; 

[webView stringByEvaluatingJavaScriptFromString: js]; 

Awesome tip Tom.

Answer 5

La diferencia con mi respuesta es que está limpiando la ventana gráfica antes de establecer el ancho.

Esto permite rotar o redimensionar la vista web (después de cargarla) sin restablecer los cambios de sus atributos.

- (void)webViewDidFinishLoad:(UIWebView *)webView 
{ 
    // Clear view port 
    NSString* js = @"$('meta[name=viewport]').remove();"; 
    [webView stringByEvaluatingJavaScriptFromString: js]; 

    // Set content size 
    js = [NSString stringWithFormat:@"var meta = document.createElement('meta');" 
      "meta.setAttribute('name', 'viewport'); " 
      "meta.setAttribute('content', 'width = device-width, initial-scale = 5.0, user-scalable = yes'); " 
      "document.getElementsByTagName('head')[0].appendChild(meta);"]; 

    [webView stringByEvaluatingJavaScriptFromString: js]; 
}