POP按鈕動(dòng)畫(huà)
ps：長(zhǎng)按按鈕顯示底層圖片，松開(kāi)隱藏
一、總結(jié)
通過(guò)實(shí)現(xiàn)pop動(dòng)畫(huà)代理 設(shè)置view的透明度。一次方程函數(shù)實(shí)現(xiàn)從0.9到1的計(jì)算。
二、實(shí)現(xiàn)效果
二、界面布局
布局包含以下控件：
? ? 1、原始圖片
? ? 2、毛玻璃化圖片
? ? 3、中心按鈕
? ? 4、進(jìn)度Label
? ? 5、中間線動(dòng)畫(huà)layer
@property(nonatomic,strong) UIImageView? ? *normalImageView;
@property(nonatomic,strong) UIImageView? ? *blurImageView;
@property(nonatomic,strong) UIButton? ? ? ? *centerButton;
@property(nonatomic,strong) UILabel? ? ? ? *centerLabel;
@property(nonatomic,strong) CAShapeLayer? ? *circle1;
//一元一次函數(shù)。。后續(xù)會(huì)介紹用處
@property(nonatomic,strong) Math? ? ? ? ? ? *math;
界面初始化：
//一元一次方程 按鈕縮放由1~0.9，則計(jì)算對(duì)應(yīng)的x值
self.math = [Math mathOnceLinearEquationWithPointA:MATHPointMake(0, 1) PointB:MATHPointMake(1, 0.9)];
//UIImageView
UIImage *image =[UIImage imageNamed:@"5"];
self.normalImageView = [[UIImageView alloc] initWithImage:image];
self.normalImageView.frame = self.view.bounds;
self.normalImageView.contentMode = UIViewContentModeScaleAspectFill;
[self.view addSubview:self.normalImageView];
self.blurImageView = [[UIImageView alloc] initWithFrame:self.normalImageView.frame];
self.blurImageView.image = [image blurImage];
[self.view addSubview:self.blurImageView];
//中心按鈕
self.centerButton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
self.centerButton.backgroundColor = [UIColor whiteColor];
self.centerButton.center = self.view.center;
self.centerButton.layer.cornerRadius = 50;
[self.view addSubview:self.centerButton];
//中心Label
self.centerLabel = [[UILabel alloc] initWithFrame:self.centerButton.bounds];
[self.centerButton addSubview:self.centerLabel];
self.centerLabel.textAlignment = NSTextAlignmentCenter;
self.centerLabel.font = [UIFont HeitiSCWithFontSize:30];
self.centerLabel.text = @"0%";
//按鈕事件
//按住Button
[self.centerButton addTarget:self action:@selector(scaleToSmall) forControlEvents:UIControlEventTouchDown | UIControlEventTouchDragEnter];
//松開(kāi)Button
[self.centerButton addTarget:self action:@selector(scaleToNormal) forControlEvents:UIControlEventTouchUpInside];
//圓環(huán)圖層
{
? ? self.circle1 = [CAShapeLayer layer];
? ? self.circle1.strokeEnd = 0;
? ? CGFloat lineWidth = .5;
? ? CGFloat radius = 50;
? ? self.circle1.bounds = CGRectMake(0, 0, (radius + lineWidth)*2, (radius + ? ? lineWidth)*2);
? ? self.circle1.lineWidth = lineWidth;
? ? self.circle1.position = self.centerButton.center;
? ? UIBezierPath *circlePath1 = [UIBezierPath bezierPathWithArcCenter:CGPointMake(radius+lineWidth, radius+lineWidth) radius:radius startAngle:0 endAngle:M_PI*2 clockwise:YES];
? ? self.circle1.path = circlePath1.CGPath;
? ? self.circle1.strokeColor = [UIColor whiteColor].CGColor;
? ? self.circle1.fillColor = [UIColor clearColor].CGColor;
? ? [self.view.layer addSublayer:self.circle1];
}
//縮小事件
-(void)scaleToSmall{
//刪除在中心按鈕的所有動(dòng)畫(huà)
[self.centerButton.layer pop_removeAllAnimations];
//縮小
POPBasicAnimation *scaleAnim = [POPBasicAnimation animationWithPropertyNamed:kPOPLayerScaleXY];
scaleAnim.toValue = [NSValue valueWithCGSize:CGSizeMake(.9, .9)];
scaleAnim.delegate = self;
scaleAnim.duration = .8;
[self.centerButton.layer pop_addAnimation:scaleAnim forKey:@"scale"];
//更改顏色
POPSpringAnimation *springAnim = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerBackgroundColor];
springAnim.toValue = (id)[UIColor blackColor].CGColor;
[self.centerButton.layer pop_addAnimation:springAnim forKey:@"bgColor" ];
}
//還原事件
-(void)scaleToNormal{
[self.centerButton.layer pop_removeAllAnimations];
POPBasicAnimation *scaleAnim = [POPBasicAnimation animationWithPropertyNamed:kPOPLayerScaleXY];
scaleAnim.toValue = [NSValue valueWithCGSize:CGSizeMake(1, 1)];
scaleAnim.delegate = self;
[self.centerButton.layer pop_addAnimation:scaleAnim forKey:@"scale"];
POPSpringAnimation *springAnim = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerBackgroundColor];
springAnim.toValue = (id)[UIColor whiteColor].CGColor;
[self.centerButton.layer pop_addAnimation:springAnim forKey:@"bgcolor"];
}
//動(dòng)畫(huà)delegate
- (void)pop_animationDidApply:(POPAnimation *)anim {
//獲取當(dāng)前值
NSValue *value = [anim valueForKeyPath:@"currentValue"];
CGSize size = [value CGSizeValue];
//動(dòng)畫(huà)事務(wù)
[CATransaction setDisableActions:YES];
//通過(guò)一次函數(shù) 計(jì)算當(dāng)前x值百分比
CGFloat percent = (size.height - self.math.b)/self.math.k;
self.circle1.strokeEnd = percent;
[CATransaction setDisableActions:NO];
//設(shè)置進(jìn)度文字
self.centerLabel.text = [NSString stringWithFormat:@"%.f%%",fabs(percent*100)];
self.centerLabel.textColor =[UIColor colorWithRed:percent green:percent blue:percent alpha:1];
//設(shè)置玻璃view的透明度
self.blurImageView.alpha = 1 - percent;
}
