zhuming3834 / blindanimation

百叶窗动画

BlindAnimation

##百叶窗动画
百叶窗动画显示原理:
1.先把图片切分为一定的份数;
2.做一个切割后的小图片的动画;
3.设置动画相关的参数如:动画循环次数,动画时间等.

###图片切割

/**
 *  图片切割
 *
 *  @param image   需要切割的图片
 *  @param x       切割的份数
 *  @param quality 切割的质量
 *
 *  @return 切割后小图片的文件路径
 */
+ (NSDictionary *)separateImage:(UIImage *)image separate:(NSInteger)x cacheQuality:(CGFloat)quality
{
    // 错误处理
    if (x<1) {
        NSLog(@"illegal x!");
        return nil;
    }
    if (![image isKindOfClass:[UIImage class]]) {
        NSLog(@"illegal image format!");
        return nil;
    }
    
    CGFloat xstep = image.size.width*1.0;
    CGFloat ystep = image.size.height*1.0/x;
    NSMutableDictionary *mutableDictionary=[[NSMutableDictionary alloc]initWithCapacity:1];
    NSString *prefixName = @"win";
    
    // 把图片裁剪为小图片存进沙盒
    for (int i=0; i<x; i++)
    {
        for (int j=0; j<1; j++)
        {
            CGRect rect=CGRectMake(xstep*j, ystep*i, xstep, ystep);
            CGImageRef imageRef=CGImageCreateWithImageInRect([image CGImage],rect);
            UIImage* elementImage=[UIImage imageWithCGImage:imageRef];
            UIImageView *imageView=[[UIImageView alloc] initWithImage:elementImage];
            imageView.frame=rect;
            NSString *imageString=[NSString stringWithFormat:@"%@_%d_%d.jpg",prefixName,i,j];
            // 切割后的图片保存进字典        图片               图片名
            [mutableDictionary setObject:imageView forKey:imageString];
            
            if (quality<=0)
            {
                continue;
            }
            quality=(quality>1)?1:quality;
            // 切割后的图片写进文件
            NSString *imagePath=[NSHomeDirectory() stringByAppendingPathComponent:imageString];
            // 图片压缩 quality是压缩系数  0~1 之间
            NSData *imageData=UIImageJPEGRepresentation(elementImage, quality);
            // 压缩后的图片 写进文件
            [imageData writeToFile:imagePath atomically:NO];
        }
    }
    NSDictionary *dictionary = mutableDictionary;
    return dictionary;
}

###百叶窗动画

/**
 *  百叶窗动画
 */
- (void)blindAnimation{
    NSDictionary *dice = [ToolUnit separateImage:self.image separate:self.separateCount cacheQuality:self.cacheQuality];
    // 百叶窗动画
    CABasicAnimation *rotation=[CABasicAnimation animationWithKeyPath:@"transform.rotation.x"];
    rotation.duration = self.duration;
    rotation.fromValue = [NSNumber numberWithFloat:0];    // 从0°开始
    rotation.toValue = [NSNumber numberWithFloat:M_PI_2]; // 转动180°
    rotation.timingFunction = [CAMediaTimingFunction functionWithName: kCAMediaTimingFunctionEaseInEaseOut];
    rotation.autoreverses = YES;  // 翻转后是否反向翻转
    rotation.repeatCount = MAXFLOAT;    // 循环次数
    rotation.delegate = self;    // 动画代理
    NSArray *keys=[dice allKeys];
    for (int count = 0; count < self.separateCount; count++)
    {
        NSString *key=[keys objectAtIndex:count];
        UIImageView *imageView=[dice objectForKey:key];
        [imageView.layer addAnimation:rotation forKey:@"rotation"];
        [self.superView addSubview:imageView];
    }
}

###百叶窗动画视图的使用 1.包含头文件

#import "BlindUnit.h"

2.设置代理

BlindDelegate

3.新建视图

BlindUnit *blindView = [[BlindUnit alloc] init];
blindView.superView = self.view;
blindView.image = self.image1;
blindView.separateCount = 12;
blindView.cacheQuality = 1;
blindView.duration = 3;
blindView.delegate = self;
[blindView blindAnimation];

4.实现代理方法

- (void)blindFinishedAnimation{
    NSLog(@"blindFinishedAnimation");
}
- (void)blindStartAnimation{
    NSLog(@"blindStartAnimation");
}

详细使用可以查看博客《【iOS】百叶窗动画》