用SDWebImage漸變載入圖片

用SDWebImage漸變載入圖片

使用

使用請詳細查看源碼，只需要給定一個圖片地址以及一個placeHolder圖片（非必須）即可。

效果

源碼

https://github.com/YouXianMing/UI-Component-Collection 中的 SDWebImageViewPlaceHorder

//
//  PlaceholderImageView.h
//  SDWebImageViewPlaceHorder
//
//  Created by YouXianMing on 16/8/19.
//  Copyright © 2016年 YouXianMing. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface PlaceholderImageView : UIView

/**
 *  Picture's url string.
 */
@property (nonatomic, strong) NSString *urlString;

/**
 *  The placeholder's image.
 */
@property (nonatomic, strong) UIImage  *placeholderImage;

/**
 *  Default is UIViewContentModeScaleAspectFill.
 */
@property (nonatomic) UIViewContentMode placeholderImageContentMode;

/**
 *  Default is UIViewContentModeScaleAspectFill.
 */
@property (nonatomic) UIViewContentMode contentImageContentMode;

/**
 PlaceholderImageView's constractor.

 @param frame The Frame.
 @param image The placeholderImage.
 @return The PlaceholderImageView's instancetype.
 */
+ (instancetype)placeholderImageViewWithFrame:(CGRect)frame placeholderImage:(UIImage *)image;

@end

//
//  PlaceholderImageView.m
//  SDWebImageViewPlaceHorder
//
//  Created by YouXianMing on 16/8/19.
//  Copyright © 2016年 YouXianMing. All rights reserved.
//

#import "PlaceholderImageView.h"
#import "UIImageView+WebCache.h"

@interface PlaceholderImageView ()

@property (nonatomic, strong) UIImageView *placeHoderImageView;
@property (nonatomic, strong) UIImageView *contentImageView;
@property (nonatomic, strong) NSString    *pUrlString;

@end

@implementation PlaceholderImageView

- (void)layoutSubviews {
    
    [super layoutSubviews];
    self.placeHoderImageView.frame = self.bounds;
    self.contentImageView.frame    = self.bounds;
}

- (instancetype)initWithFrame:(CGRect)frame {
    
    if (self = [super initWithFrame:frame]) {
        
        self.layer.masksToBounds = YES;
        
        self.placeHoderImageView = [[UIImageView alloc] initWithFrame:self.bounds];
        self.contentImageView    = [[UIImageView alloc] initWithFrame:self.bounds];
        
        [self addSubview:self.placeHoderImageView];
        [self addSubview:self.contentImageView];
        
        self.contentImageContentMode     = UIViewContentModeScaleAspectFill;
        self.placeholderImageContentMode = UIViewContentModeScaleAspectFill;
    }
    
    return self;
}

+ (instancetype)placeholderImageViewWithFrame:(CGRect)frame placeholderImage:(UIImage *)image {

    PlaceholderImageView *placeHolderImageView = [[PlaceholderImageView alloc] initWithFrame:frame];
    placeHolderImageView.placeholderImage      = image;
    
    return placeHolderImageView;
}

#pragma mark - Setter & Getter.

- (void)setPlaceholderImage:(UIImage *)placeholderImage {
    
    _placeHoderImageView.image = placeholderImage;
}

- (UIImage *)placeholderImage {
    
    return _placeHoderImageView.image;
}

- (void)setUrlString:(NSString *)urlString {
    
    _pUrlString             = urlString;
    _contentImageView.alpha = 0.f;
    
    NSURL *url = [NSURL URLWithString:urlString];
    [_contentImageView sd_setImageWithURL:url completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) {
       
        if (image) {
            
            // Image load from disk or download from network.
            if (cacheType == SDImageCacheTypeNone || cacheType == SDImageCacheTypeDisk) {
                
                [UIView animateWithDuration:0.5f animations:^{
                    
                    _contentImageView.alpha = 1.f;
                }];
                
            } else {
            
                _contentImageView.alpha = 1.f;
            }
        }
    }];
}

- (NSString *)urlString {

    return _pUrlString;
}

- (void)setPlaceholderImageContentMode:(UIViewContentMode)placeholderImageContentMode {

    _placeHoderImageView.contentMode = placeholderImageContentMode;
}

- (UIViewContentMode)placeholderImageContentMode {

    return _placeHoderImageView.contentMode;
}

- (void)setContentImageContentMode:(UIViewContentMode)contentImageContentMode {

    _contentImageView.contentMode = contentImageContentMode;
}

- (UIViewContentMode)contentImageContentMode {

    return _contentImageView.contentMode;
}

@end