zoukankan      html  css  js  c++  java
  • SDWebImage源码解读 之 UIImage+GIF

    第二篇

    前言

    本篇是和GIF相关的一个UIImage的分类。主要提供了三个方法:

    • + (UIImage *)sd_animatedGIFNamed:(NSString *)name ----- 根据名称获取图片
    • + (UIImage *)sd_animatedGIFWithData:(NSData *)data ----- 根据NSData获取图片
    • - (UIImage *)sd_animatedImageByScalingAndCroppingToSize:(CGSize)size ----- 修改图片到指定的尺寸

    UIImage的size,scale属性

    我们先不管图片的更高级的知识,我们简单的对size和scale这两个属性做一下介绍。

    注意:如果要获取一个图片的尺寸,不是直接使用image.size,而是使用image.size*image.scale。当然,这是伪代码。原因就是我们在获取size的时候。使用的是Point坐标,而图片的尺寸是以像素为参照的。系统为我们处理了这两种坐标系的转换工作。

    我们用一个例子来演示上边的内容:

    UIImage *image = [UIImage imageNamed:@"photo_delete"];
    NSLog(@"-----尺寸:(%f %f)", image.size.width, image.size.height);
    

    打印结果为:

    -----尺寸:(18.000000 18.000000)
    

    可以看出来。使用size这个属性是不对的。该图片的实际尺寸为:

    那我们修改下代码:

    UIImage *image = [UIImage imageNamed:@"photo_delete"];
    NSLog(@"-----尺寸:(%f %f)", image.size.width * image.scale, image.size.height * image.scale);
    

    打印结果如下:

    -----尺寸:(36.000000 36.000000)
    

    修改图片到指定的尺寸

    - (UIImage *)sd_animatedImageByScalingAndCroppingToSize:(CGSize)size {
        if (CGSizeEqualToSize(self.size, size) || CGSizeEqualToSize(size, CGSizeZero)) {
            return self;
        }
    
        CGSize scaledSize = size;
        CGPoint thumbnailPoint = CGPointZero;
    
        CGFloat widthFactor = size.width / self.size.width;
        CGFloat heightFactor = size.height / self.size.height;
        CGFloat scaleFactor = (widthFactor > heightFactor) ? widthFactor : heightFactor;
        scaledSize.width = self.size.width * scaleFactor;
        scaledSize.height = self.size.height * scaleFactor;
    
        if (widthFactor > heightFactor) {
            thumbnailPoint.y = (size.height - scaledSize.height) * 0.5;
        }
        else if (widthFactor < heightFactor) {
            thumbnailPoint.x = (size.width - scaledSize.width) * 0.5;
        }
    
        NSMutableArray *scaledImages = [NSMutableArray array];
    
        for (UIImage *image in self.images) {
            UIGraphicsBeginImageContextWithOptions(size, NO, 0.0);
            
            [image drawInRect:CGRectMake(thumbnailPoint.x, thumbnailPoint.y, scaledSize.width, scaledSize.height)];
            UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    
            [scaledImages addObject:newImage];
    
            UIGraphicsEndImageContext();
        }
     
        return [UIImage animatedImageWithImages:scaledImages duration:self.duration];
    }
    

    上边的方法能够实现把图片的尺寸修剪为size,剪裁的前提是根据图片原来的比例。具体的实现,在这里就不举例说明了。和数学原理有点关系。

    + (float)sd_frameDurationAtIndex:(NSUInteger)index source:(CGImageSourceRef)source

    一个Image Sources抽象出来了图片数据,通过raw memory buffer减轻开发人员对数据的处理。Image Sources包含不止一个图像,缩略图,各个图像的特征和图片文件。通过CGImageSource实现。可以这么说:
    CGImageSourceRef就是对图像数据的一层封装。

    + (float)sd_frameDurationAtIndex:(NSUInteger)index source:(CGImageSourceRef)source {
        float frameDuration = 0.1f;
        CFDictionaryRef cfFrameProperties = CGImageSourceCopyPropertiesAtIndex(source, index, nil);
        NSDictionary *frameProperties = (__bridge NSDictionary *)cfFrameProperties;
        NSDictionary *gifProperties = frameProperties[(NSString *)kCGImagePropertyGIFDictionary];
    
        NSNumber *delayTimeUnclampedProp = gifProperties[(NSString *)kCGImagePropertyGIFUnclampedDelayTime];
        if (delayTimeUnclampedProp) {
            frameDuration = [delayTimeUnclampedProp floatValue];
        }
        else {
    
            NSNumber *delayTimeProp = gifProperties[(NSString *)kCGImagePropertyGIFDelayTime];
            if (delayTimeProp) {
                frameDuration = [delayTimeProp floatValue];
            }
        }
    
        // Many annoying ads specify a 0 duration to make an image flash as quickly as possible.
        // We follow Firefox's behavior and use a duration of 100 ms for any frames that specify
        // a duration of <= 10 ms. See <rdar://problem/7689300> and <http://webkit.org/b/36082>
        // for more information.
    
        if (frameDuration < 0.011f) {
            frameDuration = 0.100f;
        }
    
        CFRelease(cfFrameProperties);
        return frameDuration;
    }
    

    + (UIImage *)sd_animatedGIFWithData:(NSData *)data

    当我们由NSData => UIImage 的时候,我们应该考虑更多一点。如果NSData中不止一张图片,应该怎么办?

    1. 获取NSData中的图片数量

       CGImageSourceRef source = CGImageSourceCreateWithData((__bridge CFDataRef)data, NULL);
       size_t count = CGImageSourceGetCount(source);
      
    2. 如果图片数量小于或者等于1,直接转换

       if (count <= 1) {
               animatedImage = [[UIImage alloc] initWithData:data];
           }
      
    3. 数量大于1的情况

      • 取出每一个图片
      • 计算总的duration
      • 生成UIImage

    代码如下:

    + (UIImage *)sd_animatedGIFWithData:(NSData *)data {
        if (!data) {
            return nil;
        }
    
        CGImageSourceRef source = CGImageSourceCreateWithData((__bridge CFDataRef)data, NULL);
        size_t count = CGImageSourceGetCount(source);
    
        UIImage *animatedImage;
    
        if (count <= 1) {
            animatedImage = [[UIImage alloc] initWithData:data];
        }
        else {
            NSMutableArray *images = [NSMutableArray array];
    
            NSTimeInterval duration = 0.0f;
    
            for (size_t i = 0; i < count; i++) {
                CGImageRef image = CGImageSourceCreateImageAtIndex(source, i, NULL);
                if (!image) {
                    continue;
                }
    
                duration += [self sd_frameDurationAtIndex:i source:source];
    
                [images addObject:[UIImage imageWithCGImage:image scale:[UIScreen mainScreen].scale orientation:UIImageOrientationUp]];
    
                CGImageRelease(image);
            }
    
            if (!duration) {
                duration = (1.0f / 10.0f) * count;
            }
    
            animatedImage = [UIImage animatedImageWithImages:images duration:duration];
        }
    
        CFRelease(source);
    
        return animatedImage;
    

    }

    + (UIImage *)sd_animatedGIFNamed:(NSString *)name

    + (UIImage *)sd_animatedGIFNamed:(NSString *)name {
        CGFloat scale = [UIScreen mainScreen].scale;
    
        if (scale > 1.0f) {
            NSString *retinaPath = [[NSBundle mainBundle] pathForResource:[name stringByAppendingString:@"@2x"] ofType:@"gif"];
    
            NSData *data = [NSData dataWithContentsOfFile:retinaPath];
    
            if (data) {
                return [UIImage sd_animatedGIFWithData:data];
            }
    
            NSString *path = [[NSBundle mainBundle] pathForResource:name ofType:@"gif"];
    
            data = [NSData dataWithContentsOfFile:path];
    
            if (data) {
                return [UIImage sd_animatedGIFWithData:data];
            }
    
            return [UIImage imageNamed:name];
        }
        else {
            NSString *path = [[NSBundle mainBundle] pathForResource:name ofType:@"gif"];
    
            NSData *data = [NSData dataWithContentsOfFile:path];
    
            if (data) {
                return [UIImage sd_animatedGIFWithData:data];
            }
    
            return [UIImage imageNamed:name];
        }
    }
    

    补充

    在这里补充一点实现渐进式图片加载的步骤。

    当图片从网络中获取的时候,可能由于过大,数据缓慢,这时候就需要渐进式加载图片来显示。主要通过CFData对象来实现:

    1. 创建一个CFData去添加image data
    2. 创建一个渐进式图片资源,通过 CGImageSourceCreateIncremental
    3. 获取图片数据到CFData中
    4. 调用CGImageSourceUpdateData函数,传递CFData和一个bool值,去描述这个数据是否包含全部图片数据或者只是部分数据。无论什么情况,这个data包含已经积累的全部图片文件
    5. 如果已经有足够的图片数据,可以通过函数绘制CGImageSourceCreateImageAtIndex部分图片,然后记得要Release掉它
    6. 检查是否已经有全部的图片数据通过使用CGImageSourceGetStatusAtIndex函数。如果图片是完整的,函数返回值为kCGImageStatusComplete。否则继续3,4步骤,直到获得全部数据
    7. Release掉渐进式增长的image source

    总结

    写到这里,我突然意识到,gif也算是一种无损的格式,本分类也只是给予UIImage支持GIF的能力,因此由这种思想,我联想到别的地方。当我们需要某种能力支持的时候,我们应该去观察底层,也就是数据层的规律。就比如图像数据,本质上还是一些二进制的数据,越往上,越被包装的简单易用,归根到底,写代码的根本就是处理数据。

    SDWebImage源码解读 之 NSData+ImageContentType 简书 博客园

  • 相关阅读:
    .net core上传
    C#/.NET整数的三种强制类型转换(int)、Convert.ToInt32()、int.Parse()的区别
    14、Silverlight 滤镜到 UWP 滤镜的移植(二)
    13、在 uwp应用中,给图片添加高斯模糊滤镜效果(一)
    1、揭秘通用平台的 HttpClient (译)
    12、uwp 开发的零碎总结
    11、使用 WinAppDeployCmd 部署appx 包到 Windows10 Mobile上(更新)
    10、Windows10 上,在窗口左侧向右滑动打开 SplitView 的 Pane面板
    09、win32 转换为 store app
    08、通过自定义依赖属性,用 StateTrigger 修改全局主题样式
  • 原文地址:https://www.cnblogs.com/machao/p/6134364.html
Copyright © 2011-2022 走看看