美文网首页源码图片iOS从头开始做一个APP
YYImage源码解析<一> 简单使用

YYImage源码解析<一> 简单使用

作者: 风往北吹_ | 来源:发表于2015-11-25 20:00 被阅读5535次

    YYImage学习笔记<一> 简单使用

    前言

    YYImage开源库包含5个类文件,分别为:YYImage、YYFrameImage、YYSpriteSheetImage、YYImageCoder、YYAnimaeImageView。

    功能简介如下:
    YYImage:加载单张图片,包括gif,WebP,APNG等图片(YYImageDemo里面主要测试里这三种)
    YYFrameImage:加载多张图使用
    YYSpriteSheetImage:加载精灵图片,就是多个图片在一张图纸上,通过计算坐标来取图
    YYImageCoder:用于对图片文件进行编解码
    YYAnimaeImageView:实现动画效果

    简单使用

    1、加载gif图(使用YYImage类)

    - (void)viewDidLoad {
        // 加载图片
        YYImage * image = [YYImage imageNamed:@"niconiconi"];
        // 类似系统的UIImageView(这里作者重写用于显示gif、WebP和APNG格式图片)
        YYAnimatedImageView *imageView = [[YYAnimatedImageView alloc] initWithImage:image];
        imageView.frame = CGRectMake(0, 70, 300, 300);
        [self.view addSubview:imageView];
    }
    

    2 加载WebP格式图片(使用YYImage类)

    - (void)viewDidLoad {
        // 加载图片
        YYImage * image = [YYImage imageNamed:@"wall-e"];
        // 类似系统的UIImageView(这里作者重写用于显示gif、WebP和APNG格式图片)
        YYAnimatedImageView *imageView = [[YYAnimatedImageView alloc] initWithImage:image];
        imageView.frame = CGRectMake(0, 70, 300, 300);
        [self.view addSubview:imageView];
    }
    

    3 加载APNG格式图片(使用YYImage类)

    - (void)viewDidLoad {
        // 加载图片
        YYImage * image = [YYImage imageNamed:@"pia"];
        // 类似系统的UIImageView(这里作者重写用于显示gif、WebP和APNG格式图片)
        YYAnimatedImageView *imageView = [[YYAnimatedImageView alloc] initWithImage:image];
        imageView.frame = CGRectMake(0, 70, 300, 300);
        [self.view addSubview:imageView];
    }
    

    4 加载多图(使用YYFrameImage类)

    - (void)viewDidLoad {
        [super viewDidLoad];
      
        // 获取图片路径
        NSString *basePath = [[NSBundle mainBundle].bundlePath stringByAppendingPathComponent:@"EmoticonWeibo.bundle/com.sina.default"];
        
        // 拼接图片路径并添加数组
        NSMutableArray *paths = [NSMutableArray new];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_aini@3x.png"]];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_baibai@3x.png"]];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_chanzui@3x.png"]];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_chijing@3x.png"]];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_dahaqi@3x.png"]];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_guzhang@3x.png"]];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_haha@2x.png"]];
        [paths addObject:[basePath stringByAppendingPathComponent:@"d_haixiu@3x.png"]];
        
        // 加载多图
        UIImage *image = [[YYFrameImage alloc] initWithImagePaths:paths oneFrameDuration:0.1 loopCount:0];
        
        // 显示多图
        YYAnimatedImageView *imageView = [[YYAnimatedImageView alloc] initWithImage:image];
        imageView.frame = CGRectMake(30, 70, 50, 50);
        [self.view addSubview:imageView];
    }
    

    5 加载精灵图片(使用YYSpriteSheetImage类)

        NSString *path = [[NSBundle mainBundle].bundlePath stringByAppendingPathComponent:@"ResourceTwitter.bundle/fav02l-sheet@2x.png"];
        UIImage *sheet = [[UIImage alloc] initWithData:[NSData dataWithContentsOfFile:path] scale:2];
        NSMutableArray *contentRects = [NSMutableArray new];
        NSMutableArray *durations = [NSMutableArray new];
        
        
        // 8 * 12 sprites in a single sheet image
        CGSize size = CGSizeMake(sheet.size.width / 8, sheet.size.height / 12);
        for (int j = 0; j < 12; j++) {
            for (int i = 0; i < 8; i++) {
                CGRect rect;
                rect.size = size;
                rect.origin.x = sheet.size.width / 8 * i;
                rect.origin.y = sheet.size.height / 12 * j;
                [contentRects addObject:[NSValue valueWithCGRect:rect]];
                [durations addObject:@(1 / 60.0)];
            }
        }
        YYSpriteSheetImage *sprite;
        sprite = [[YYSpriteSheetImage alloc] initWithSpriteSheetImage:sheet
                                                         contentRects:contentRects
                                                       frameDurations:durations
                                                            loopCount:0];
        
        
        YYAnimatedImageView *imageView = [[YYAnimatedImageView alloc] initWithImage:sprite];
        
        imageView.frame = CGRectMake(30, 70, 50, 50);
        
        [self.view addSubview:imageView];
    

    总结:由上面的例子可以看出,单张图片的加载都是通过YYImage类完成,只有精灵图片的加载(多个图片元素在一张图片上面),作者重新继承了一个类YYSpriteSheetImage用于计算显示的坐标和时间等。

    相关文章

      网友评论

      • 77aec65bc6be:抱歉,看到niconiconi我笑出了声
      • Teehom:请问下使用这个类库,加载图片过多的时候,内存占用太多,这个问题怎么解决。
        爱吃土豆的菇凉:YYFrameImage使用这个 处理帧动画的时候内存不会标上去

      本文标题:YYImage源码解析<一> 简单使用

      本文链接:https://www.haomeiwen.com/subject/cgxdhttx.html