css - example - wkwebview swift 3

Suprima que WKWebView escale contenido para renderizar con el mismo aumento que UIWebView

Question

Problema

Usando WKWebView en lugar de UIWebView , noté que el contenido de WKWebView se redujo masivamente en comparación con mi UIWebView . Me gustaría que WKWebView dejara de hacer eso y simplemente respetara mis valores CSS literalmente, como UIWebView haría UIWebView .

Contexto

Utilizo vistas web en mi aplicación nativa de iOS para los contenidos que van dentro de popovers en un iPad donde estoy mostrando contenido informativo. Es genial poder dar esto a la gente de contenido y diseño y decir, "simplemente coloque algo de contenido HTML, haciendo referencia al archivo CSS vinculado".

Todo esto funcionó de maravilla al usar UIWebView .

Pero los popovers son a menudo bastante compactos.

Lo que estoy experimentando

En mis popovers estrechos, el contenido se reduce como si mi contenido fuera miniaturizado para ajustar una página web completa. Puedo ver que WKWebView estaba destinado principalmente a personas que crean navegadores alternativos en iOS o aplicaciones híbridas, donde el WKWebView es esencialmente, tomando el control de la pantalla.

El factor de aumento en WKWebView no es algo que se pueda establecer. Claro, el usuario puede hacer zoom, pero eso frustra el propósito. No estoy buscando una vista ampliada; Estoy buscando que todo el contenido se ajuste y se ajuste a las palabras como lo haría con UIWebView.

Con WKWebView, en el simulador, veré el tamaño que quiero si subo el tamaño del texto de mi cuerpo a 50 px en lugar de 14 px. Sin embargo, este código ni siquiera ayuda cuando estoy en el dispositivo, ¡así que inflar mis tamaños CSS tampoco es una opción!

¿Qué hay de malo con UIWebView?

Bueno, nada realmente. No está (todavía) en desuso en iOS8, tal vez b / c todavía tiene utilidad, como estoy experimentando. Sin embargo, noté que WKWebView era rápido. Y he visto algunas especulaciones de que la escritura está en la pared para UIWebView. Pensé: "¿Por qué no adoptar la API más moderna en iOS8 ahora?"

Por lo tanto, sigo usando UIWebView por ahora, pero me gustaría cambiar a WKWebView si pudiera hacer que respete mi tamaño CSS.

Aquí está mi CSS original que UIWebView representa muy bien, pero que WKWebView en un popover representará en fuentes muy pequeñas:

body {
    font-family: "HelveticaNeue";
    font-size: 15px;
    line-height: 17px;
    color: #000000;
}

h1 {
    font-family: "HelveticaNeue-Bold";
    font-size: 18px;
    line-height: 20px;
    color: #000000;
}


h2 {
    font-family: "HelveticaNeue-Bold";
    font-size: 16px;
    line-height: 18px;
    color: #000000;
}

Answer 1

Yo tuve el mismo problema. Solo tuve que poner

<meta name="viewport" content="initial-scale=1.0" />

en mi bloque de encabezado y eso lo resolvió para mí. Parece que WKWebView comporta más como Mobile Safari que un UIWebView , por lo que debe configurar la ventana gráfica si desea controlar la escala o el tamaño general.