Fit image of random size into a UIWebview (IOS)

问题

I want to fit large image into UIwebview with keeping image ratio same as image view.

How can i do it.?

My code as follows to fit image in Uiwebview. if image is large then display is not good.

                CGFloat screenWidth = self.view.frame.size.width;
                CGFloat screenHeight = self.view.frame.size.height;

                NSString *htmlString = [NSString stringWithFormat:@"%@", @"<html><head><meta name='viewport' content='user-scalable=yes,width=device-width'></head><body bgcolor='000000'><img src='%@' width='%f' height='%f' style='max-width:200% max-height:200%'></body></html>"];
                imageHTML  = [[NSString alloc] initWithFormat:htmlString, fileUrl, screenWidth, screenHeight];

        [Webview loadHTMLString:imageHTML baseURL:nil];
        [imageHTML release];

回答1:

I have used below code and its working well.

   NSString *imageHTML = [[NSString alloc] initWithFormat:@"%@%@%@", @"<!DOCTYPE html>"
                                 "<html lang=\"ja\">"
                                 "<head>"
                                 "<meta charset=\"UTF-8\">"
                                 "<style type=\"text/css\">"
                                 "html{margin:0;padding:0;}"
                                 "body {"
                                 "margin: 0;"
                                 "padding: 0;"
                                 "color: #363636;"
                                 "font-size: 90%;"
                                 "line-height: 1.6;"
                                 "background: black;"
                                 "}"
                                 "img{"
                                 "position: absolute;"
                                 "top: 0;"
                                 "bottom: 0;"
                                 "left: 0;"
                                 "right: 0;"
                                 "margin: auto;"
                                 "max-width: 100%;"
                                 "max-height: 100%;"
                                 "}"
                                 "</style>"
                                 "</head>"
                                 "<body id=\"page\">"
                                 "<img src='",fileUrl,@"'/> </body></html>"];

                [wview_contents loadHTMLString:imageHTML baseURL:nil];

回答2:

To load image in Swift 3.0 from application document directory in a UIWebView with his expected ratio -

if let dir = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first {
            let path = dir.appendingPathComponent(imageName)
            
            
            
        let fullHTML = "<!DOCTYPE html>" +
            "<html lang=\"ja\">" +
            "<head>" +
            "<meta charset=\"UTF-8\">" +
            "<style type=\"text/css\">" +
            "html{margin:0;padding:0;}" +
            "body {" +
            "margin: 0;" +
            "padding: 0;" +
            "color: #363636;" +
            "font-size: 90%;" +
            "line-height: 1.6;" +
            "background: black;" +
            "}" +
            "img{" +
            "position: absolute;" +
            "top: 0;" +
            "bottom: 0;" +
            "left: 0;" +
            "right: 0;" +
            "margin: auto;" +
            "max-width: 100%;" +
            "max-height: 100%;" +
            "}" +
            "</style>" +
            "</head>" +
            "<body id=\"page\">" +
            "<img src='\(path)'/> </body></html>"
            
            imgWbView.loadHTMLString(fullHTML, baseURL: nil)
}

回答3:

Set your WebView page to scale fit:

[webView setScalesPageToFit:YES];

EDIT:

Here check these two lines also

CGFloat screenWidth = self.view.frame.size.width;
CGFloat screenHeight = self.view.frame.size.height;

If you know what size you want them pass static values here, will fix your problem.

e.g.

CGFloat screenWidth = 300;
CGFloat screenHeight = 300;

回答4:

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.

来源：https://stackoverflow.com/questions/26252101/fit-image-of-random-size-into-a-uiwebview-ios

标签

ios

iphone

uiwebview