组件17:骨架组件化-资源加载

一、解决图片加载的问题:

  1. 图片放置的位置:
  2. 每个宿主工程都要用到的图片:放在外界,Images.xcassets,比如tabBar按钮的图片;
  3. 组件内用到的图片:放入对应的组件;
  4. 修改加载路径:
  5. 代码NSBundle和[UIImage imageNamed:@"tabbar_bg"];
  6. xib、storyboard加载图片路径

二、需要了解的知识:

获取图片的工具:
  1. iOSImagesExtractor ;
  2. cartool (在参数那里,前一个是输入路径,后一个是输出路径)。
组件化Bundle路径:

NSBundle *mainBundle = [NSBundle mainBundle];//主bundle
NSBundle *currentBundle = [NSBundle bundleForClass:self];//对应组件中的bundle
NSLog(@"mainBundle——>%@",mainBundle);
NSLog(@"currentBundle——>%@",currentBundle);

主Bundle(默认):mainBundle——>NSBundle </Users/fengluo/Library/Developer/CoreSimulator/Devices/1F8ABC0F-4C13-4E90-A11C-A2910F304687/data/Containers/Bundle/Application/F269A0A9-6DB4-4FDC-96B5-1B45ED1D7920/LFFMMain_Example.app> (loaded)
库对应的Bundle:currentBundle——>NSBundle </Users/fengluo/Library/Developer/CoreSimulator/Devices/1F8ABC0F-4C13-4E90-A11C-A2910F304687/data/Containers/Bundle/Application/F269A0A9-6DB4-4FDC-96B5-1B45ED1D7920/LFFMMain_Example.app/Frameworks/LFFMMain.framework> (loaded)
主Bundle和库对应的Bundle
主Bundle和库对应的Bundle.png

三、操作步骤

  1. 准备图片:可以使用iOSImagesExtractor、cartool,或者别出找;
  2. 主骨架图片放在宿主工程的Images.xcassets,因为每个宿主工程都要用到;


    xcassets.png
  3. 组件特有的图片放入对应组件的Assets;


    组件对应的Assets.png
  4. 修改库中xib、storyboard中图片的加载路径:LFFMMain.bundle/tabbar_np_shadow,即在原来的图片名前面加上对应的bundleLFFMMain.bundle/
    Snip20170711_112.png
  5. 代码中Nib、图片资源加载:
  6. 涉及到NSBundle:
NSBundle *currentBundle = [NSBundle bundleForClass:self];
XMGMiddleView *middleView = [[currentBundle loadNibNamed:@"XMGMiddleView" owner:nil options:nil] firstObject];
  1. 涉及到[UIImage imageNamed:@"tabbar_bg"]
NSBundle *currentBundle = [NSBundle bundleForClass:[self class]];
NSString *imagePath = [currentBundle pathForResource:@"tabbar_bg@2x.png" ofType:nil inDirectory:@"LFFMMain.bundle"];
UIImage *image = [UIImage imageWithContentsOfFile:imagePath];
self.backgroundImage = image;
imageNamed在组件中如何使用.png

####### 获取图片工具的使用

1.iOSImagesExtractor 的使用:
缺点是只能解压出@2x.png,解压不出@3x.png的图片

iOSImagesExtractor使用.png

2.cartool 的使用
可以解压出@3x.png的图片,只是用法有点奇葩

cartool使用.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容