前言####
我相信大多数的App都有一个启动动画、或者启动页什么的,本项目主要是借助启动页的方式,解说我们在项目中常用的几个动画效果,比如:圆形递减动画、缩放动画、渐变色动画
映客源码下载地址:高仿映客项目源码
映客系列详细解说目录:映客系列详细解说目录
圆形递减动画####
主要是先制作动画路径是圆形,然后启动定时器对strokeEnd做定时动画
#pragma mark - 增加圆形进度条
- (void)addRoundProcessLayerWithSuperView:(UIView *)superView
{
self.processLayer.frame = superView.bounds;
self.processLayer.fillColor = [UIColor clearColor].CGColor;
self.processLayer.lineWidth = 2.0;
UIBezierPath *circlePath = [UIBezierPath bezierPathWithOvalInRect:superView.bounds];
self.processLayer.path = circlePath.CGPath;
self.processLayer.strokeColor = [UIColor redColor].CGColor;
self.processLayer.strokeStart = 0;
self.processLayer.strokeEnd = 1.0;
[superView.layer addSublayer:self.processLayer];
[self startTime];
}
- (void)startTime
{
self.timer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(timerClocking) userInfo:nil repeats:YES];
}
- (void)timerClocking
{
self.processLayer.strokeEnd -=0.02; //动画一次设置描绘结束区域
if(self.processLayer.strokeEnd < 0.0)
{
[self stopTime];
self.jumpButton.userInteractionEnabled = YES;
[self addTransformScaleWithSuperView:self.jumpButton];
}
}
- (void)stopTime
{
[self.timer invalidate];
self.timer = nil;
}
缩放动画####
缩放动画比较简单,一般采用CAKeyframeAnimation,设置动画的参数是transform.scale,动画的区间是basc.values = @[@1.0,@1.2,@1.0];
#pragma mark - 增加放大效果
- (void)addTransformScaleWithSuperView:(UIView *)superView
{
CAKeyframeAnimation *basc = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale"];
basc.values = @[@1.0,@1.2,@1.0];
basc.duration = 1.0;
basc.repeatCount = CGFLOAT_MAX;
[superView.layer addAnimation:basc forKey:@"transform"];
}
文字渐变动画####
渐变动画主要是运用CAGradientLayer渐变类
渐变的本质:为需要渐变的层增加渐变层,使我们看起来是渐变的
#pragma mark - 增加渐变颜色
- (void)addGradientLayerWithSuperView:(UIView *)superView;
{
CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.anchorPoint = CGPointMake(0, 0); //渐变层定位锚点
gradient.startPoint = CGPointMake(0, 0.5); //渐变层起始点
gradient.endPoint = CGPointMake(1, 0.5); //渐变层终点
//设置可以知道渐变是从左到右
gradient.colors = @[(__bridge id)[UIColor colorWithWhite:0.6 alpha:1.0].CGColor,
(__bridge id)[UIColor redColor].CGColor,
(__bridge id)[UIColor colorWithWhite:0.6 alpha:1.0].CGColor,]; //渐变颜色数组
gradient.locations = @[@0.2,@0.5,@0.8]; //渐变颜色的区间分布
gradient.bounds =self.view.bounds;
[self.view.layer addSublayer:gradient];
[self addAnimationToLayer:gradient];
gradient.mask = superView.layer;
}
- (void)addAnimationToLayer:(CALayer *)layer
{
CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"locations"];
basic.fromValue = @[@0,@0,@0.4];
basic.toValue = @[@0.6,@0.8,@1.0];
basic.duration =3.0;
basic.repeatCount = MAXFLOAT;
[layer addAnimation:basic forKey:NSStringFromClass([layer class])];
}