1.用CALayer定制下载进度条控件,直接修改CALayer的frame值执行隐式动画，实现进度条效果
//创建layer并添加layer
CALayer *layer = [CALayer layer];
layer.frame = CGRectMake(0, 0, 100, 5);
[self.view.layer addSublayer:layer];
//执行隐式动画(直接触发动画效果)
layer.frame = CGRectMake(0, 0, 200, 5);
@interface ProgressView :UIView
@property (nonatomic,assign)CGFloat progress; //进度参数（取值范围为 %0 ~ %100）
@property (nonatomic,strong)UIColor *layerColor;//修改layer的颜色
@end
#import "ProgressView.h"
@interface ProgressView ()
@property (nonatomic,strong)CALayer *progressLayer;
@property (nonatomic,assign)CGFloat currentViewWidth;
@end
@implementation ProgressView
- (instancetype)initWithFrame:(CGRect)frame
{
self = [superinitWithFrame:frame];
if (self) {
self.progressLayer = [CALayerlayer];
self.progressLayer.frame =CGRectMake(0,0,0, frame.size.height);
self.progressLayer.backgroundColor = [UIColorredColor].CGColor;
[self.layeraddSublayer:self.progressLayer];
// 存储当前view的宽度值
self.currentViewWidth = frame.size.width;
}
return self;
}
#pragma mark - 重写setter，getter方法
@synthesize progress =_progress;
- (void)setProgress:(CGFloat)progress {
_progress = progress;
if (progress <=0) {
self.progressLayer.frame =CGRectMake(0,0,0,self.frame.size.height);
}elseif (progress <=1) {
self.progressLayer.frame =CGRectMake(0,0,
progress *self.currentViewWidth,
self.frame.size.height);
}else {
self.progressLayer.frame =CGRectMake(0,0,self.currentViewWidth,
self.frame.size.height);
}
}
- (CGFloat)progress {
return_progress;
}
@synthesize layerColor =_layerColor;
- (void)setLayerColor:(UIColor *)layerColor {
_layerColor = layerColor;
self.progressLayer.backgroundColor = layerColor.CGColor;
}
- (UIColor *)layerColor {
return_layerColor;
}
@end
//调用
#import "ProgressView.h"
@interface ViewController ()
@property (nonatomic,strong)ProgressView *progressView;
@property (nonatomic,strong)NSTimer *timer;
@end
@implementation ViewController
- (void)viewDidLoad {
[superviewDidLoad];
self.view.backgroundColor = [UIColorblackColor];
self.progressView = [[ProgressViewalloc]initWithFrame:CGRectMake(20,20,290,3)];
self.progressView.layerColor = [UIColoryellowColor];
[self.viewaddSubview:self.progressView];
//创建定时器，每一秒执行一回
self.timer = [NSTimerscheduledTimerWithTimeInterval:1
target:self
selector:@selector(layerAnimation)
userInfo:nil
repeats:YES];
}
- (void)layerAnimation {
// 随机获取 0% ~ 100% 给layer赋值
self.progressView.progress =arc4random() %100 /100.f;
}
@end
2.用CALayer定制UIImageView淡入淡出切换图片效果
2.1、CALayer一般作为UIView的容器而使用
2.2、CALayer是一个管理着图片载体（image-basedcontent）的层结构
2.3、直接修改单独创建出的CALayer的属性可以触发隐式动画
2.4、UIView中的CALayer动画必须显式触发才能生效
self.view.layer.contents = (__bridgeid)([UIImageimageNamed:@"图片"].CGImage);
可以直接用图片填充整个View,可见CALayer是一个管理着图片载体（image-basedcontent）的层结构
#define NO_EXECUTE 0 // 不执行
#define EXECUTE 1 // 执行
@interface ViewController ()
@property (nonatomic,strong)CALayer *imageLayer;
@end
@implementation ViewController
- (void)viewDidLoad {
[superviewDidLoad];
// 创建出独立的layer
self.imageLayer = [CALayerlayer];
self.imageLayer.frame =CGRectMake(0,0,302,707);
[self.view.layeraddSublayer:self.imageLayer];
// 给layer的contents属性设置图片
self.imageLayer.contents = (__bridgeid)([UIImageimageNamed:@"起始图片"].CGImage);
// 3s后执行layer动画
[selfperformSelector:@selector(layerAnimation)
withObject:nil
afterDelay:3.f];
self.view.layer.contents = (__bridgeid)([UIImageimageNamed:@"起始图片"].CGImage);
}
- (void)layerAnimation {
if (NO_EXECUTE) {
//执行隐式动画（你自己无法控制持续时间等等的参数）
self.imageLayer.contents = (__bridgeid)([UIImageimageNamed:@"结束图片"].CGImage);
}
if (NO_EXECUTE) {
//执行显式动画（你自己无法控制持续时间等等的参数）
// 设定基本动画参数
CABasicAnimation *contentsAnimation = [CABasicAnimationanimationWithKeyPath:@"contents"];
contentsAnimation.fromValue = self.imageLayer.contents;
contentsAnimation.toValue = (__bridgeid)([UIImageimageNamed:@"结束图片"].CGImage);
contentsAnimation.duration =3.f;
// 设定layer动画结束后的contents值
self.imageLayer.contents = (__bridgeid)([UIImageimageNamed:@"结束图片"].CGImage);
// 让layer开始执行动画
[self.imageLayeraddAnimation:contentsAnimationforKey:nil];
}
if (EXECUTE) {
//执行显式动画（你自己无法控制持续时间等等的参数）
// 基于图片的动画
CABasicAnimation *contentsAnimation = [CABasicAnimationanimationWithKeyPath:@"contents"];
contentsAnimation.fromValue = self.imageLayer.contents;
contentsAnimation.toValue = (__bridgeid)([UIImageimageNamed:@"结束图片"].CGImage);
contentsAnimation.duration =0.5f;
// 基于bounds的动画
CABasicAnimation *boundsAnimation = [CABasicAnimationanimationWithKeyPath:@"bounds"];
boundsAnimation.fromValue = [NSValuevalueWithCGRect:self.imageLayer.bounds];
boundsAnimation.toValue = [NSValuevalueWithCGRect:CGRectMake(0,0,302/2.f,707/2.f)];
boundsAnimation.duration =0.5f;
//将基于图片的动画与基于bounds的动画组合起来
CAAnimationGroup *groupAnimation = [CAAnimationGroupanimation];
groupAnimation.animations =@[contentsAnimation, boundsAnimation];
groupAnimation.duration =0.5f;
// 设定layer动画结束后的contents值
self.imageLayer.contents = (__bridgeid)([UIImageimageNamed:@"结束图片"].CGImage);
self.imageLayer.bounds =CGRectMake(0,0,302/2.f,707/2.f);
// 让layer开始执行动画
[self.imageLayeraddAnimation:groupAnimationforKey:nil];
}
}
@end
3.用CALayer实现复杂遮罩效果
3.1、遮罩原理的分析
3.2、用png图片作为CALayer中mask属性的遮罩Layer
3.3、移动该CALayer的mask的frame值实现遮罩动画效果
#import "ViewController.h"
@interface ViewController ()
@property (nonatomic,strong)CALayer *imageLayer;
@property (nonatomic,strong)CALayer *maskLayer;
@property (nonatomic,strong)UIImage *imageContents;
@property (nonatomic,strong)UIImage *maskContents;
@end
@implementation ViewController
- (void)viewDidLoad {
[superviewDidLoad];
self.view.backgroundColor = [UIColorblackColor];
// 获取图片
self.imageContents = [UIImageimageNamed:@"原始图片"];
self.maskContents = [UIImageimageNamed:@"maskLayerContents"];
// 创建出图片layer
self.imageLayer = [CALayerlayer];
self.imageLayer.frame =CGRectMake(50,50,200,200);
self.imageLayer.contents = (__bridgeid)(self.imageContents.CGImage);
[self.view.layeraddSublayer:self.imageLayer];
// 创建出遮罩layer
self.maskLayer = [CALayerlayer];
self.maskLayer.frame =self.imageLayer.bounds;
self.maskLayer.contents = (__bridgeid)(self.maskContents.CGImage);
//self.maskLayer.backgroundColor = [UIColor whiteColor].CGColor;
// 给图片layer提供遮罩的layer
self.imageLayer.mask =self.maskLayer;
// 3秒钟之后做maskLayer动画
[selfperformSelector:@selector(maskLayerAnimation)
withObject:nil
afterDelay:3.f];
}
- (void)maskLayerAnimation {
// self.maskLayer.frame = CGRectMake(50, 50, 200, 200);
}
@end
1061
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
