UIWebView juste une image qui devrait convenir à l'ensemble de la vue

Donc la question que je vais avoir maintenant est avec UIWebViews l'affichage d'une seule image.
Ce que j'aimerais c'est que l'image soit réduite si elle n'est pas le lieu, et de garder la taille d'origine si pas.
Donc, voici comment je le fais (dans un UIViewController):

- (void)viewDidLoad {
[super viewDidLoad];
UIWebView *webView = [[UIWebView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 80)];
NSString *path =[[NSBundle mainBundle] bundlePath];
NSURL *baseUrl =[NSURL fileURLWithPath:path];
NSString *html = [NSString stringWithFormat:@"<html><head>"
//THE LINE ABOVE IS TO PREVENT THE VIEW TO BE SCROLLABLE
"<script>document.ontouchstart = function(event) { event.preventDefault();  }</script>"
"</head><body style=\"text-align:center;margin:0;padding:0\">"
"<img src=\"banner.gif\" />"
"</body>"
"</html>"];             
webView.scalesPageToFit = YES;
[webView loadHTMLString:html baseURL:baseUrl]; 
[self.view addSubview:webView];
[webView release];
}

Cette culture de l'image et rend la webview de défilement, ce qui n'est pas le comportement souhaité.

J'ai donc commencé à essayer avec un peu de CSS int la balise d'image :

"<img style=\"width:100%\" src=\"banner.gif\" />"

ou

"<img style=\"max-width:100%\" src=\"banner.gif\" />"

Je ne sais pas pourquoi, mais à 100% ne semble pas être la largeur de la UIView, il est vraiment petit ! (la source de l'image dans la vue est plus grand que 320px, et voici le résultat 🙂

UIWebView juste une image qui devrait convenir à l'ensemble de la vue

Donc j'ai essayé de paramétrer le corps largeur :

        "</head><body style=\"width:100%;text-align:center;margin:0;padding:0\">"
"<img style=\"width:100%\" src=\"banner.gif\" />"

Et ce qui n'est simplement prévenir l' "text-align" bien travailler.
J'ai essayé également de supprimer le texte-align, parce que si la largeur s'adapte à la vue, il n'est pas nécessaire, mais ça ne fonctionne toujours pas.
J'ai aussi essayé de définir la taille de l'image à l'affichage de la largeur, mais il ne fonctionne pas sur la rétine des appareils, puis...
J'ai essayé de définir une fenêtre d'affichage de device-width, mais elle ne change pas.

Aucune idée de comment faire cela ?

Ici est un petit exemple avec 3 images que j'aimerais l'ajustement, dans le cas où vous avez le temps de jeter un oeil

OriginalL'auteur Julien | 2011-01-12