实现iOS图片等资源文件的热更新化(二):自定义的动态 imageNamed

这篇文章,要解决的是,使用一个自定义的 imageNamed 函数来替代系统的 imageNamed 函数.内部逻辑,将贯穿对比论证 关于"合适"的图片的定义.对iOS加载图片的规则不是很熟悉的童鞋,可以着重看这篇.

不同后缀图片加载的优先级

  • iPhone 7 plus(iOS10.0): sample@3x.png > sample@2x.png > sample~iphone.png >sample.png
    其他后缀的图片总是不被加载.

  • iPad Pro 12.9 inch(iOS10.0): sample@2x.png > sample~ipad.png > sample.png 其他后缀的图片总是不被加载.

不同后缀的图片iPhone 7 plus(iOS10.0)iPad Pro 12.9 inch(iOS10.0)
sample.png78
sample@2x.png910
sample@3x.png100
sample~iphone.png80
sample~iphone@2x.png00
sample~iphone@3x.png00
sample~ipad.png09
sample~ipad@2x.png00

可以使用同名不同内容的图片来对比观察.优先级从高到低.优先级较高的优先被加载,优先级为0的永远不会被加载.仅以iPhone 7 plus 和 iPad Pro为例分析,其他情况可自行.所用验证版本为iOS10,未来不同机型手机和系统可能会有差异.

想自己动手试一下的,可以下载示例: https://github.com/ios122/ios_assets_hot_update/raw/master/res/ios_assets_hot_update_2.zip 很小,只有100多K.编译,我此时用的是 Xcode 8.

使用bundle包放置图片等资源文件

使用bundle包放置图片等资源文件

资源把到一个bundle包中,便于保留资源的目录结构,也方便整体管理与替换.iOS中的bundle包,就一个一个特殊的以.bunle结尾的文件夹.示例中,我使用的是main.bundle.另外,关于bundle保留资源目录结构这个特点,是react-native中很依赖的一个特性,以后你的项目中或许也会需要.如果单单只是从原有 Images.xcassets 迁移代码的话,此处都放于同一层级即可.

使用 imageWithContentsOfFile: 加载图片

把图片放到资源文件夹main.bundle后,再加载图片,可以参考下面的代码,这样做的额外的好处就是可以适当减小图片加载的内存占用问题:

NSString * bundlePath = [[NSBundle mainBundle].resourcePath stringByAppendingPathComponent:@"main.bundle"];
NSBundle * mainBundle = [NSBundle bundleWithPath:bundlePath];
NSString * imgPath = [mainBundle pathForResource:@"sample" ofType:@"png"];
self.sampleImageView.image = [UIImage imageWithContentsOfFile: imgPath];

使iPhone @3x 与iPad @2x 共用同一张图片

首先是需要显示加载 @3x 的图片:

NSString * imgPath = [mainBundle pathForResource:@"sample@3x" ofType:@"png"];

此时代码,在iPhone 7 / iPhone 7 plus/ iPad Pro,都能显示图片,直接输出图片本身的尺寸都为 原图尺寸的 1/3.

NSLog(@"加载后的图片尺寸:%@",[NSValue valueWithCGSize:self.sampleImageView.image.size]);

但是,此处有一个问题.@3x总是被解读为三倍图,在iPhone上,正是我们需要的尺寸,但是在iPad上,尺寸就有些偏小了.我们在iPad上,通常总是需要将此张图按照@2x图来显示.这是一个规律!做过iPhone和iPad通用图标尺寸适配的童鞋,应该早就注意到了.

所以,现在要解决的关键技术问题是:如何把 @3x图,在iPad上按照@2x图来解读?相对完整代码如下,最终输出的图片尺寸在iPhone上为原始尺寸的1/3,在iPad上为原始尺寸的1/2,正是我们需要的:

 NSString * bundlePath = [[NSBundle mainBundle].resourcePath stringByAppendingPathComponent:@"main.bundle"];
 NSBundle * mainBundle = [NSBundle bundleWithPath:bundlePath];
 NSString * imgPath = [mainBundle pathForResource:@"sample@3x" ofType:@"png"];

 UIImage * image;
 static NSString * model;

 if (!model) {
     model = [[UIDevice currentDevice]model];
 }

 if ([model isEqualToString:@"iPad"]) {
     NSData *imageData = [NSData dataWithContentsOfFile: imgPath];
     image = [UIImage imageWithData:imageData scale:2.0];
 }else{
     image = [UIImage imageWithContentsOfFile: imgPath];
 }

 self.sampleImageView.image = image;

 NSLog(@"加载后的图片尺寸:%@",[NSValue valueWithCGSize:self.sampleImageView.image.size]);

封装为类目(category),实现自定义的 imageNamed

此处实现了一个简单够用的类目方法,支持从指定bundle读取指定名字的图片:

#import "UIImage+imageNamed_bundle_.h"

@implementation UIImage (imageNamed_bundle_)
+ (UIImage *)imageNamed:(NSString *)imgName bundle:(NSString *)bundleName
{
    bundleName = [NSString stringWithFormat:@"%@.bundle",bundleName];
    imgName = [NSString stringWithFormat:@"%@@3x",imgName];

    NSString * bundlePath = [[NSBundle mainBundle].resourcePath stringByAppendingPathComponent: bundleName];
    NSBundle * mainBundle = [NSBundle bundleWithPath:bundlePath];
    NSString * imgPath = [mainBundle pathForResource:imgName ofType:@"png"];

    UIImage * image;
    static NSString * model;

    if (!model) {
        model = [[UIDevice currentDevice]model];
    }

    if ([model isEqualToString:@"iPad"]) {
        NSData *imageData = [NSData dataWithContentsOfFile: imgPath];
        image = [UIImage imageWithData:imageData scale:2.0];
    }else{
        image = [UIImage imageWithContentsOfFile: imgPath];
    }
    return  image;
}
@end

借助类目,原来的调用,可以简化为:

UIImage * image = [UIImage imageNamed:@"sample" bundle:@"main"];
self.sampleImageView.image = image;

也支持有层级结构的图片资源的读取呦:

UIImage * image = [UIImage imageNamed:@"sub/sample" bundle:@"main"];
self.sampleImageView.image = image;

参考链接

系列专属 github 项目主页

https://github.com/ios122/ios_assets_hot_update

相关资源:Leslie人口预测模型
相关推荐
<p style="text-align:left;"> <span> </span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> <span style="font-family:"color:#E53333;font-size:14px;background-color:#FFFFFF;line-height:24px;"><span style="line-height:24px;">限时福利1:</span></span><span style="font-family:"color:#3A4151;font-size:14px;background-color:#FFFFFF;">购课进答疑群专享柳峰(刘运强)老师答疑服务。</span> </p> <p> <br /> </p> <p class="ql-long-24357476"> <strong><span style="color:#337FE5;font-size:14px;">为什么说每一个程序员都应该学习MySQL?</span></strong> </p> <p class="ql-long-24357476"> <span style="font-size:14px;">根据《2019-2020年中国开发者调查报告》显示,超83%的开发者都在使用MySQL数据库。</span> </p> <p class="ql-long-24357476"> <img src="https://img-bss.csdn.net/202003301212574051.png" alt="" /> </p> <p class="ql-long-24357476"> <span style="font-size:14px;">使用量大同时,掌握MySQL早已是运维、DBA的必备技能,甚至部分IT开发岗位也要求对数据库使用和原理有深入的了解和掌握。</span><br /> <br /> <span style="font-size:14px;">学习编程,你可能会犹豫选择 C++ 还是 Java;入门数据科学,你可能会纠结于选择 Python 还是 R;但无论如何, MySQL 都是 IT 从业人员不可或缺的技能!</span> </p> <span></span> <p> <br /> </p> <p> <span> </span> </p> <h3 class="ql-long-26664262"> <p style="font-size:12pt;"> <strong class="ql-author-26664262 ql-size-14"><span style="font-size:14px;color:#337FE5;">【课程设计】</span></strong> </p> <p style="font-size:12pt;"> <span style="color:#494949;font-weight:normal;"><br /> </span> </p> <p style="font-size:12pt;"> <span style="color:#494949;font-weight:normal;font-size:14px;">在本课程中,刘运强老师会结合自己十多年来对MySQL的心得体会,通过课程给你分享一条高效的MySQL入门捷径,让学员少走弯路,彻底搞懂MySQL。</span> </p> <p style="font-size:12pt;"> <span style="color:#494949;font-weight:normal;"><br /> </span> </p> <p style="font-size:12pt;"> <span style="font-weight:normal;font-size:14px;">本课程包含3大模块:</span><span style="font-weight:normal;font-size:14px;"> </span> </p> </h3> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <strong class="ql-author-26664262"><span style="font-size:14px;">一、基础篇:</span></strong> </p> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <span class="ql-author-26664262" style="font-size:14px;">主要以最新的MySQL8.0安装为例帮助学员解决安装与配置MySQL的问题,并对MySQL8.0的新特性做一定介绍,为后续的课程展开做好环境部署。</span> </p> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <span class="ql-author-26664262" style="font-size:14px;"><br /> </span> </p> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <strong class="ql-author-26664262"><span style="font-size:14px;">、SQL语言篇</span></strong><span class="ql-author-26664262" style="font-size:14px;">:</span> </p> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <span class="ql-author-26664262" style="font-size:14px;">本篇主要讲解SQL语言的四大部分数据查询语言DQL,数据操纵语言DML,数据定义语言DDL,数据控制语言DCL,</span><span style="font-size:14px;">学会熟练对库表进行增删改查等必备技能。</span> </p> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <span style="font-size:14px;"><br /> </span> </p> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <strong class="ql-author-26664262"><span style="font-size:14px;">三、MySQL进阶篇</span></strong><span style="font-size:14px;">:</span> </p> <p class="ql-long-26664262" style="font-size:11pt;color:#494949;"> <span style="font-size:14px;">本篇可以帮助学员加高效的管理线上的MySQL数据库;具备MySQL的日常运维能力,语句调优、备份恢复等思路。</span> </p> <span><span> <p style="font-size:11pt;color:#494949;"> <span style="font-size:14px;"> </span><img src="https://img-bss.csdn.net/202004220208351273.png" alt="" /> </p> </span></span>
<div style="color:rgba(0,0,0,.75);"> <span style="color:#4d4d4d;"> </span> <div style="color:rgba(0,0,0,.75);"> <span style="color:#4d4d4d;"> </span> <div style="color:rgba(0,0,0,.75);"> <div style="color:rgba(0,0,0,.75);"> <span style="color:#4d4d4d;">当前课程中商城项目的实战源码是我发布在 GitHub 上的开源项目 newbee-mall (新蜂商城),目前已有 6300 多个 star,</span><span style="color:#4d4d4d;">本课程是一个 Spring Boot 技术栈的实战类课程,课程共分为 3 大部分,前面两个部分为基础环境准备和相关概念介绍,第三个部分是 Spring Boot 商城项目功能的讲解,让大家实际操作并实践上手一个大型的线上商城项目,并学习到一定的开发经验以及其中的开发技巧。<br /> 商城项目所涉及的功能结构图整理如下:<br /> </span> </div> <div style="color:rgba(0,0,0,.75);">   </div> <div style="color:rgba(0,0,0,.75);"> <p style="color:#4d4d4d;"> <img alt="modules" src="https://imgconvert.csdnimg.cn/aHR0cHM6Ly9uZXdiZWUtbWFsbC5vc3MtY24tYmVpamluZy5hbGl5dW5jcy5jb20vcG9zdGVyL3N0b3JlL25ld2JlZS1tYWxsLXMucG5n?x-oss-process=image/format,png" /> </p> </div> <p style="color:rgba(0,0,0,.75);"> <strong><span style="color:#e53333;">课程特色</span></strong> </p> <p style="color:rgba(0,0,0,.75);">   </p> <div style="color:rgba(0,0,0,.75);">   </div> <div style="color:rgba(0,0,0,.75);"> <ul> <li> 对新手开发者十分友好,无需复杂的操作步骤,仅需 2 秒就可以启动这个完整的商城项目 </li> <li> 最终的实战项目是一个企业级别的 Spring Boot 大型项目,对于各个阶段的 Java 开发者都是极佳的选择 </li> <li> 实践项目页面美观且实用,交互效果完美 </li> <li> 教程详细开发教程详细完整、文档资源齐全 </li> <li> 代码+讲解+演示网站全方位保证,向 Hello World 教程说拜拜 </li> <li> 技术栈新颖且知识点丰富,学习后可以提升大家对于知识的理解和掌握,可以进一步提升你的市场竞争力 </li> </ul> </div> <p style="color:rgba(0,0,0,.75);">   </p> <p style="color:rgba(0,0,0,.75);"> <span style="color:#e53333;">课程预览</span> </p> <p style="color:rgba(0,0,0,.75);">   </p> <div style="color:rgba(0,0,0,.75);">   </div> <div style="color:rgba(0,0,0,.75);"> <p style="color:#4d4d4d;"> 以下为商城项目的页面和功能展示,分别为: </p> </div> <div style="color:rgba(0,0,0,.75);"> <ul> <li> 商城首页 1<br /> <img alt="" src="https://img-bss.csdnimg.cn/202103050347585499.gif" /> </li> <li> 商城首页 2<br /> <img alt="" src="https://img-bss.csdn.net/202005181054413605.png" /> </li> <li>   </li> <li> 购物车<br /> <img alt="cart" src="https://imgconvert.csdnimg.cn/aHR0cHM6Ly9uZXdiZWUtbWFsbC5vc3MtY24tYmVpamluZy5hbGl5dW5jcy5jb20vcG9zdGVyL3Byb2R1Y3QvY2FydC5wbmc?x-oss-process=image/format,png" /> </li> <li> 订单结算<br /> <img alt="settle" src="https://imgconvert.csdnimg.cn/aHR0cHM6Ly9uZXdiZWUtbWFsbC5vc3MtY24tYmVpamluZy5hbGl5dW5jcy5jb20vcG9zdGVyL3Byb2R1Y3Qvc2V0dGxlLnBuZw?x-oss-process=image/format,png" /> </li> <li> 订单列表<br /> <img alt="orders" src="https://imgconvert.csdnimg.cn/aHR0cHM6Ly9uZXdiZWUtbWFsbC5vc3MtY24tYmVpamluZy5hbGl5dW5jcy5jb20vcG9zdGVyL3Byb2R1Y3Qvb3JkZXJzLnBuZw?x-oss-process=image/format,png" /> </li> <li> 支付页面<br /> <img alt="" src="https://img-bss.csdn.net/201909280301493716.jpg" /> </li> <li> 后台管理系统登录页<br /> <img alt="login" src="https://imgconvert.csdnimg.cn/aHR0cHM6Ly9uZXdiZWUtbWFsbC5vc3MtY24tYmVpamluZy5hbGl5dW5jcy5jb20vcG9zdGVyL3Byb2R1Y3QvbWFuYWdlLWxvZ2luLnBuZw?x-oss-process=image/format,png" /> </li> <li> 商品管理<br /> <img alt="goods" src="https://imgconvert.csdnimg.cn/aHR0cHM6Ly9uZXdiZWUtbWFsbC5vc3MtY24tYmVpamluZy5hbGl5dW5jcy5jb20vcG9zdGVyL3Byb2R1Y3QvbWFuYWdlLWdvb2RzLnBuZw?x-oss-process=image/format,png" /> </li> <li> 商品编辑<br /> <img alt="" src="https://img-bss.csdnimg.cn/202103050348242799.png" /> </li> </ul> </div> </div> </div> </div>
<p> <span> </span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> <span class="ql-author-24357476"><span style="font-size:14px;"> </span></span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> 人工智能、物联网、大数据时代,Linux正有着一统天下的趋势,几乎每个程序员岗位,都要求掌握Linux。本课程零基础也能轻松入门。 </p> <p class="ql-long-24357476"> <br /> </p> <p class="ql-long-24357476"> 本课程以简洁易懂的语言手把手教你系统掌握日常所需的Linux知识,每个知识点都会配合案例实战让你融汇贯通。课程通俗易懂,简洁流畅,适合0基础以及对Linux掌握不熟练的人学习; </p> <p> <span></span> </p> <p> <span style="color:#FF9900;"><span><span> </span></span></span> </p> <p class="ql-long-24357476"> <span style="background-color:#FFFFFF;color:#E53333;">【限时福利】</span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> <span class="ql-author-24357476">1)购课后按提示添加小助手,进答疑群,还可获得价值300元的编程大礼包!</span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> <span class="ql-author-24357476"><span>2)本月购买此套餐加入老师答疑交流群,可参加老师的免费分享活动,学习最新技术项目经验。</span><br /> </span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> <span class="ql-author-24357476">---------------------------------------------------------------</span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> <span class="ql-author-24357476" style="color:#E53333;">99元=掌握Linux必修知识+社群答疑+讲师社群分享会+700元编程礼包。</span> </p> <p class="ql-long-24357476" style="font-size:11pt;color:#494949;"> <span class="ql-author-24357476" style="color:#E53333;"><br /> </span> </p> <p style="font-size:11pt;color:#494949;"> <span> <img alt="" src="https://img-bss.csdn.net/202002140604337221.png" /></span> </p>
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页