如何为UIWebView中的图像设置合适的尺寸?

I loaded HTML to my UIWebView that including both Text and Images.

我将HTML加载到我的UIWebView中，包括文本和图像。

Text is fit to UIWebView and Images are not fit to UIWebView.

文本适合UIWebView，图像不适合UIWebView。

It's too large in UIWebView.

它在UIWebView中太大了。

It's showing scroll bar at the end of the UIWebView.

它在UIWebView的结尾显示滚动条。

I want to adjust image fit size in UWebView. So i tested with following codes.

我想在UWebView中调整图像大小。所以我测试了以下代码。

self.myWebView.scalesPageToFit = YES;

However it's fixed including Text and Text is too small to read and Images are fixed.

但是它是固定的，包括文本和文本都太小了不能读，图像也是固定的。

I want to set Text Normally and only want to fit size Image in UIWeView.

我想在UIWeView中正常设置文本，只需要匹配大小图像。

How can i do it?

我怎么做呢?

3 个解决方案

#1

I have solve this problem using css. The css contained within the style tags below will make sure to automatically resize your images maintaining aspect ratio for the width of the UIWebView. Hope this helps!

我已经用css解决了这个问题。下面的样式标签中包含的css将确保自动调整图像的尺寸，保持UIWebView宽度的长宽比。希望这可以帮助!

NSString *strTemplateHTML = [NSString stringWithFormat:@"<html><head><style>img{max-width:100%%;height:auto !important;width:auto !important;};</style></head><body style='margin:0; padding:0;'>%@</body></html>", @"insert your html content here"];

[webView loadHTMLString:strTemplateHTML baseURL:nil];

#2

Use the viewport meta tag is used by UIWebView on the iPhone/iPad to determine how to display a web page.

UIWebView在iPhone/iPad上使用viewport meta标记来确定如何显示网页。

 <meta name="viewport" content="width=device-width, maximum-scale=1.0" />

refer below link for more details:

详情请参阅以下连结:

https://developer.apple.com/library/ios/DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

#3

-1

The following code snippet may help you

下面的代码片段可能会对您有所帮助

NSString *fontString = @"<!DOCTYPE html><html>\
    <head>\
    <style>\
    img{";
        NSString *imageDimensionsStr = [NSString stringWithFormat:@"max-width: %fpx; max-height: %fpx;}",self.view.frame.size.width - 50.0f, self.view.frame.size.height/2];
        fontString =[fontString stringByAppendingString:imageDimensionsStr];
fontString = [fontString stringByAppendingString:@"</style></head><body>"];
    fontString = [[fontString stringByAppendingString:htmlString] stringByAppendingString:@"</body></html>"];
    [webView loadHTMLString:fontString baseURL:nil];

The above code will resize the width and height of the image according to view dimension. You can change according to your requirement.

以上代码将根据视图维度调整图像的宽度和高度。你可以根据你的要求修改。

#1