TranformFadeView
效果图:
源码地址:
https://github.com/YouXianMing/UI-Component-Collection
注意:
maskView是iOS8中新出的,用以简化alpha遮罩的操作,与layer的mask是一回事,想要修改兼容的,请考虑使用layer的mask来满足你的需求.
特点:
* 方块的个数可以自己设定
* 你可以实现你自己的策略来设定渐变消失的方式
核心源码:
//
// TranformFadeView.h
// TransformationFadeView
//
// Created by XianMingYou on 15/4/16.
// Copyright (c) 2015年 XianMingYou. All rights reserved.
// #import <UIKit/UIKit.h> @interface TranformFadeView : UIView /**
* Image显示方式
*/
@property (nonatomic) UIViewContentMode contentMode; /**
* 要显示的相片
*/
@property (nonatomic, strong) UIImage *image; /**
* 垂直方向方块的个数
*/
@property (nonatomic) NSInteger verticalCount; /**
* 水平方向方块的个数
*/
@property (nonatomic) NSInteger horizontalCount; /**
* 开始构造出作为mask用的view
*/
- (void)buildMaskView; /**
* 渐变动画的时间
*/
@property (nonatomic) NSTimeInterval fadeDuradtion; /**
* 两个动画之间的时间间隔
*/
@property (nonatomic) NSTimeInterval animationGapDuration; /**
* 开始隐藏动画
*
* @param animated 是否执行动画
*/
- (void)fadeAnimated:(BOOL)animated; /**
* 开始显示动画
*
* @param animated 时候执行动画
*/
- (void)showAnimated:(BOOL)animated; @end
//
// TranformFadeView.m
// TransformationFadeView
//
// Created by XianMingYou on 15/4/16.
// Copyright (c) 2015年 XianMingYou. All rights reserved.
// #import "TranformFadeView.h" #define STATR_TAG 0x19871220 @interface TranformFadeView () /**
* 图片
*/
@property (nonatomic, strong) UIImageView *imageView; /**
* 所有的maskView
*/
@property (nonatomic, strong) UIView *allMaskView; /**
* maskView的个数
*/
@property (nonatomic) NSInteger maskViewCount; /**
* 存储maskView的编号
*/
@property (nonatomic, strong) NSMutableArray *countArray; @end @implementation TranformFadeView /**
* 初始化并添加图片
*
* @param frame frame值
*/
- (void)initImageViewWithFrame:(CGRect)frame {
self.imageView = [[UIImageView alloc] initWithFrame:frame];
self.imageView.layer.masksToBounds = YES;
[self addSubview:self.imageView];
} - (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) {
[self initImageViewWithFrame:self.bounds];
} return self;
} - (void)buildMaskView { /**
* 如果没有,就返回空
*/
if (self.horizontalCount < || self.verticalCount < ) {
return;
} // 承载所有的maskView
self.allMaskView = [[UIView alloc] initWithFrame:self.bounds];
self.maskView = self.allMaskView; // 计算出每个view的尺寸
CGFloat height = self.frame.size.height;
CGFloat width = self.frame.size.width;
CGFloat maskViewHeight = self.verticalCount <= ? height : (height / self.verticalCount);
CGFloat maskViewWidth = self.horizontalCount <= ? width : (width / self.horizontalCount); // 用以计数
int count = ; // 先水平循环,再垂直循环
for (int horizontal = ; horizontal < self.horizontalCount; horizontal++) { for (int vertical = ; vertical < self.verticalCount; vertical++) { CGRect frame = CGRectMake(maskViewWidth * horizontal,
maskViewHeight * vertical,
maskViewWidth,
maskViewHeight); UIView *maskView = [[UIView alloc] initWithFrame:frame];
maskView.frame = frame;
maskView.tag = STATR_TAG + count;
maskView.backgroundColor = [UIColor blackColor]; [self.allMaskView addSubview:maskView]; count++;
} } self.maskViewCount = count; // 存储
self.countArray = [NSMutableArray array];
for (int i = ; i < self.maskViewCount; i++) {
[self.countArray addObject:@(i)];
}
} /**
* 策略模式一
*
* @param inputNumber 输入
*
* @return 输出
*/
- (NSInteger)strategyNormal:(NSInteger)inputNumber {
NSNumber *number = self.countArray[inputNumber];
return number.integerValue;
} - (void)fadeAnimated:(BOOL)animated {
if (animated == YES) { for (int i = ; i < self.maskViewCount; i++) {
UIView *tmpView = [self maskViewWithTag:[self strategyNormal:i]]; [UIView animateWithDuration:(self.fadeDuradtion <= .f ? .f : self.fadeDuradtion)
delay:i * (self.animationGapDuration <= .f ? 0.2f : self.animationGapDuration)
options:UIViewAnimationOptionCurveLinear
animations:^{
tmpView.alpha = .f;
} completion:^(BOOL finished) { }];
} } else { for (int i = ; i < self.maskViewCount; i++) {
UIView *tmpView = [self maskViewWithTag:i];
tmpView.alpha = .f;
} }
} - (void)showAnimated:(BOOL)animated {
if (animated == YES) { for (int i = ; i < self.maskViewCount; i++) {
UIView *tmpView = [self maskViewWithTag:[self strategyNormal:i]]; [UIView animateWithDuration:(self.fadeDuradtion <= .f ? .f : self.fadeDuradtion)
delay:i * (self.animationGapDuration <= .f ? 0.2f : self.animationGapDuration)
options:UIViewAnimationOptionCurveLinear
animations:^{
tmpView.alpha = .f;
} completion:^(BOOL finished) { }];
} } else { for (int i = ; i < self.maskViewCount; i++) {
UIView *tmpView = [self maskViewWithTag:i];
tmpView.alpha = .f;
} } } /**
* 根据tag值获取maskView
*
* @param tag maskView的tag值
*
* @return tag值对应的maskView
*/
- (UIView *)maskViewWithTag:(NSInteger)tag {
return [self.maskView viewWithTag:tag + STATR_TAG];
} /* 重写setter,getter方法 */ @synthesize contentMode = _contentMode;
- (void)setContentMode:(UIViewContentMode)contentMode {
_contentMode = contentMode;
self.imageView.contentMode = contentMode;
}
- (UIViewContentMode)contentMode {
return _contentMode;
} @synthesize image = _image;
- (void)setImage:(UIImage *)image {
_image = image;
self.imageView.image = image;
}
- (UIImage *)image {
return _image;
} @end
需要注意的细节: