当前位置:  开发笔记 > 编程语言 > 正文

在本地UIWebView中使用Retina图像

如何解决《在本地UIWebView中使用Retina图像》经验,为你挑选了2个好方法。

出于某种原因,我不能让UIWebView与我的新Retina图像"玩得很好".这个问题,一步一步:

我正在从包中加载一系列HTML帮助文件.我的代码加载不同的HTML文件,如果它是iPhone 4(LWERetinaUtils下面是我写的一个util类).我已经读过这个问题,UIWebView不可能自动检测@ 2x指标 - 并亲自体验,因此这种方法.

if ([LWERetinaUtils isRetinaDisplay])
  htmls = [NSArray arrayWithObjects:@"foo@2x.html",@"bar@2x.html",nil];
else
  htmls = [NSArray arrayWithObjects:@"foo.html",@"bar.html",nil];

foo@2x.html和的内容之间的唯一区别foo.html是图像标签指的是更高分辨率的图像.

然后,我像这样加载我的UIWebView:

  _webView = [[UIWebView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 375.0f)];
  _webView.delegate = self;
  [self _loadPageWithBundleFilename:self.filename];
  [self.view addSubview:_webView];

_loadPageWithBundleFilename: 我写的只是一个帮助方法,告诉UIWebView加载文件中的内容.

到目前为止,我的内容在iPhone模拟器和iPhone 4模拟器之间的加载方式不同 - 而不是我的期望.

文本显示完全相同的大小 - 但Retina图像似乎按比例放大(它们看起来像素化),它们飞离屏幕的右端.

我试过了:

_webView.scalesPageToFit = YES

属性,当然,它使图像显得恰到好处(至少没有像素化).但是,那时我的文字很小(因为我的网页视图已经缩小了很多).

有谁知道如何解决这类问题?我已经看过一些Javascript解决方案(像这样),但它们似乎只是"图像交换",这是我上面已经做过的 - 所以它应该工作,不是吗?

最后,在HTML文件中,这是我引用图像的方式:


而CSS:

body{ margin:20pt; padding:10pt; line-height:38pt; font-size:24pt; text-align:left; background-color: transparent; font-family:Helvetica,sanserif; width:640pt;}

我把宽度标签放在CSS中 - 它似乎没有改变任何东西.



1> Mike..:

确保在标签上指定高度和宽度.你当然需要至少宽度来完成这项工作.


这很有效.回答我自己的问题(没有其他人写过这个,所以我希望我可以帮助其他人):IMAGE标签上的WIDTH属性应该设置为ORIGINAL(非高def)图像宽度.

2> c roald..:

如果你不关心让WebKit处理非视网膜设备数量下降的图像大小调整(收缩),你可以这样做:

    只需提供@ 2x图像.

    在IMG标记中指定标称(非高清)图像大小,或使用CSS3 background-size属性.

推荐阅读
ifx0448363
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有