UIWebView如何加载本地图片

时间:2021-12-05 02:02:15

UIWebView如何加载本地图片

UIWebView如何加载本地图片

UIWebView加载本地图片是有实用价值的.比方说,有时候我们需要本地加载静态页来显示相关帮助信息,而这些帮助信息当中含有很多很多的富文本,用代码实现难度较大,这时候,可以考虑使用UIWebView加载本地图片的方式实现需求.

UIWebView是可以从本地加载图片的,只不过这个本地的图片需要是bundle中的图片

UIWebView如何加载本地图片

沙盒中的文件如何添加呢?

http://*.com/questions/17494752/how-to-read-image-file-at-documents-directory-from-ios-webview

You could give the URL for this image using an absolute path with a file:// scheme.

NSString *documentsDirectory = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask,YES)[];
NSString *filePath = [NSString stringWithFormat:@"file://%@/image.png", documentsDirectory];

You could then run some javascript to update the src tag to update it to the new path:

NSString *javascript = [NSString stringWithFormat:@"var imageElement = document.getElementById('localFile'); imageElement.setAttribute('src', '%@');", filePath];
[self.webView stringByEvaluatingJavaScriptFromString:javascript];

In your HTML the path would look like something like:

<html>
<body>
<img id="localFile" src="file:///var/mobile/Applications/3D7D43E8-FA5E-4B19-B74C-669F7D1F3093/Documents/image.png" />
</body>
</html>

本人亲自测试过,但是没有成功,也许方法不对......

测试用静态页html源码

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>关于我们</title>
<!-- When the value is true and the page contains the viewport meta tag, -->
<!-- meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"-->
</head>
<style>
body,p,h1,h2,h3,h4,h5,h6,dl,dd{ margin:0; font-size:12px; font-family:"宋体";}
ol,ul{list-style:none; padding:0; margin:0;}
a{text-decoration:none;}
img{ border:none;}
.clear{zoom:1;}
.clear:after{ content:"";display:block;clear:both;} .wrap{ width:auto;}
.head{ width:auto; height:24px; background:#ffffff} .list{ width:auto; margin:0 auto; padding-top:36px; text-align:center;}
.list h3{ font-size:90px; color:#c0c0c0; line-height:170px;}
.text{ margin:30px auto; width:95%; border-bottom:1px solid #cccccc;} .text p{ margin-bottom:30px; font-size:40px; color:#757575; text-align:left; line-height:55px;}
.text2{ text-align:left;margin:0 auto; width:95%;}
.list h2{ font-size:24px; color:#000; line-height:60px;}
.text2 p{ font-size:24px; color:#c0c0c0; line-height:60px;}
.foot{ width:auto; height:62px; background:#ffffff;}
</style>
<body>
<div class="wrap">
<div class="head">
</div>
<div class="list"> <h3>未选择的路</h3>
<img src="demo.jpg" /> <div class="text"> <p>黄色的树林里分出两条路,
可惜我不能同时去涉足,
我在那路口久久伫立,
我向着一条路极目望去,
直到它消失在丛林深处。
但我却选了另外一条路,
它荒草萋萋,十分幽寂,
显得更诱人、更美丽,
虽然在这两条小路上,
都很少留下旅人的足迹,
虽然那天清晨落叶满地,
两条路都未经脚印污染。
呵,留下一条路等改日再见!
但我知道路径延绵无尽头,
恐怕我难以再回返。
也许多少年后在某个地方,
我将轻声叹息把往事回顾,
一片树林里分出两条路,
而我选了人迹更少的一条,
从此决定了我一生的道路。
</br></p>
</div>
<div class="text2">
<h2>【联系本人】</h2>
<p>电 话:159 - 1051 - 4635</br></p>
<p>邮 箱:you_xian_1030@163.com</br></p>
<p>博 客:http://www.cnblogs.com/YouXianMing/</br></p>
</div>
<div class="foot"> </div> </div> </div>
</body>
</html>