ios的webView加载本地html图片路径显示及webview适配

最新推荐文章于 2023-02-17 13:59:51 发布

Angelagyy_123

最新推荐文章于 2023-02-17 13:59:51 发布

阅读量4.4k

点赞数

CC 4.0 BY-SA版权

分类专栏： ios初体验文章标签： ios uiwebview 图片适配

本文链接：https://blog.youkuaiyun.com/Angelagyy_123/article/details/44781805

ios初体验专栏收录该内容

3 篇文章

订阅专栏

本文介绍了在iOS应用中使用UIWebView加载本地HTML时如何正确显示图片，以及解决webview的适配问题。关键在于设置baseURL为图片路径，并在HTML中仅使用图片文件名。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在ios中，如果需要用到UIWebView，加载本地html，在本地html中，需要显示图片，路径显示的问题。

loadHTMLString时，将baseURL改为图片路径，在html文件中img标签直接改为图片名字即可。

</span><img src="image@3x.png"  alt="图片" /><span class="s4"><br><br></span>

    NSString *resPath = [[NSBundle mainBundle] resourcePath];
    NSString *htmlFilePath = [resPath stringByAppendingPathComponent:@"index.html"];

    NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"image@3x" ofType:@"png"];
    if ([[NSFileManager defaultManager] fileExistsAtPath:htmlFilePath]) {
        NSString *string = [NSString stringWithContentsOfFile:htmlFilePath encoding:NSUTF8StringEncoding error:nil];
        
        if (string) {
            NSString *htmlString = string;
            
            [_webView loadHTMLString:htmlString baseURL:[NSURL URLWithString:imagePath]];
        }
}

若图片显示过大，可加入以下代码适配界面：

#pragma mark - 修改html代码字符串，适应webview
+ (NSString *)adaptWebViewForHtml:(NSString *) htmlStr
{
    NSMutableString *headHtml = [[NSMutableString alloc] initWithCapacity:0];
    [headHtml appendString : @"<html>" ];
    
    [headHtml appendString : @"<head>" ];
    
    [headHtml appendString : @"<meta charset=\"utf-8\">" ];
    
    [headHtml appendString : @"<meta id=\"viewport\" name=\"viewport\" content=\"width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=false\" />" ];
    
    [headHtml appendString : @"<meta name=\"apple-mobile-web-app-capable\" content=\"yes\" />" ];
    
    [headHtml appendString : @"<meta name=\"apple-mobile-web-app-status-bar-style\" content=\"black\" />" ];
    
    [headHtml appendString : @"<meta name=\"black\" name=\"apple-mobile-web-app-status-bar-style\" />" ];
    
    [headHtml appendString : @"<style>img{width:100%;}</style>" ];
    
    [headHtml appendString : @"<style>table{width:100%;}</style>" ];
    
    [headHtml appendString : @"<title>webview</title>" ];
    
    NSString *bodyHtml;
    bodyHtml = [NSString stringWithString:headHtml];
    bodyHtml = [bodyHtml stringByAppendingString:htmlStr];
    return bodyHtml;

}