May 05

Es una de las preguntas más frecuentes en los foros de programación iPhone.

Por qué cuando ponemos <img src=”miFoto.jpg” /> no sale nada si tenemos miFoto.jpg entre nuestros ficheros de recursos añadidos en XCode?

Supongamos que el código que usamos para cargar el html del nuestro UIWebView es el siguiente:

NSString *html = @"<html><body><img src='miFoto.jpg' /></body></html>";
[miUIWebView loadHTMLString:html baseURL:nil];

Con esto vemos que no se muestra ninguna imagen. El problema está en que UIWebView no sabe donde buscar la foto. Nosotros le hemos dicho la foto que queremos pero no hemos dicho donde tiene que buscarlo, para eso tenemos el parámetro baseURL.

Nuestra imagen está entre nuestros ficheros de recursos por lo que la UIWebView tiene que ir a buscar la imagen entre los ficheros de recursos y para eso tenemos que pasar el path de la carpeta de recursos vía el parámetro baseURL.

Entonces, la versión correcta del código sería el siguiente:

NSString *path = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]];
NSString *html = @"<html><body><img src='miFoto.jpg' /></body></html>";
[miUIWebView loadHTMLString:html baseURL:path];

Y todo esto que se ha explicado también es válido en el caso de que queramos incluir scripts externos o ficheros CSS.

Sorprendentemente hay gente que no conoce esta solución tan simple y hacen “cosas raras” sólo para poder mostrar fotos.

Una forma poco común de mostrar imágenes es convertirlos a base64 y usar la esquema data:URI para mostrarlos en una página web.

Ejemplo:

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoA
AAAKCAYAAACNMs+9AAAABGdBTUEAALGPC/xhBQ
AAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0S
U1FB9YGARc5KB0XV+IAAAAddEVYdENvbW1lbnQAQ3Jl
YXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1JREFUGNO9zL
0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7
jqch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6M
Jpcq2MLaI97CER3N0vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />

Esto en la mayoría de los casos no se usa pero también tiene su utilidad en diferentes entornos. Por ejemplo antes de la versión 3.0 de iPhone OS no podíamos adjuntar imágenes a los emails desde nuestro código y muchos lo solucionaron parcialmente pasando la imagen como texto (en base 64).

VN:F [1.9.8_1114]
Rating: 5.0/5 (1 vote cast)
VN:F [1.9.8_1114]
Rating: 0 (from 0 votes)
Tagged with:
preload preload preload