首页 > 学院 > 开发设计 > 正文

视图收起动画

2019-11-09 16:17:36
字体:
来源:转载
供稿:网友

最近在写项目集成即时通讯,音视频修改成类似QQ中收起的动画效果:

动画代码比较简单,效果:

动画View添加到window中为了方便可以不管到什么控制器都可以悬浮展示,

根据demo大致写了下代码:

//

//  ShowContentView.h

#import <UIKit/UIKit.h>

#import <AVFoundation/AVFoundation.h>

@interface ShowContentView :UIView<CAAnimationDelegate>

@PRoperty (nonatomic,strong)UIView *headView;

@property (nonatomic,strong)UIButton *clicBtn;

/** 动画用的layer */

@property (strong,nonatomic)CAShapeLayer *shapeLayer;

@property (nonatomic,strong)UIButton *smallBtn;

@end

//

//  ShowContentView.m

#import "ShowContentView.h"

@implementation ShowContentView

- (instancetype)initWithFrame:(CGRect)frame

{

    if (self = [superinitWithFrame:frame]) {

        UIView *headView = [[UIViewalloc]initWithFrame:CGRectMake(0,0, 120,120)];

        headView.center =CGPointMake(self.center.x,130);

        [headView setBackgroundColor:[UIColorredColor]];

        headView.layer.cornerRadius =60;

        headView.clipsToBounds =YES;

        self.clipsToBounds =YES;

        self.headView = headView;

        [selfaddSubview:headView];

        

        UIButton *btn = [UIButtonbuttonWithType:UIButtonTypeCustom];

        btn.frame =CGRectMake(30, [UIScreenmainScreen].bounds.size.height-80, [UIScreen mainScreen].bounds.size.width - 60, 30);

        [btn setBackgroundColor:[UIColorredColor]];

        [btn setTitle:@"点我"forState:UIControlStateNormal];

        self.clicBtn = btn;

        [btn addTarget:selfaction:@selector(btnclickAction:)forControlEvents:UIControlEventTouchUpInside];

        [selfaddSubview:btn];

    }

    returnself;

}

- (void)btnclickAction:(UIButton *)btn

{

    //开始的圆形

    UIBezierPath *endPath = [UIBezierPathbezierPathWithOvalInRect:self.headView.frame];

    CGSize startSize =CGSizeMake(self.frame.size.width * 0.5, self.frame.size.height-self.headView.center.y);

    CGFloat radius =sqrt(startSize.width*startSize.width+startSize.height*startSize.height);

    CGRect statF =CGRectInset(self.headView.frame, -radius, -radius);

    UIBezierPath *startPath = [UIBezierPathbezierPathWithOvalInRect:statF];

    

    CAShapeLayer *shapLayer = [CAShapeLayerlayer];

    shapLayer.path = endPath.CGPath;

    self.layer.mask = shapLayer;

    self.shapeLayer = shapLayer;

    //动画

    CABasicAnimation *pathAnimation = [CABasicAnimationanimationWithKeyPath:@"path"];

    pathAnimation.fromValue = (id)startPath.CGPath;

    pathAnimation.toValue = (id)endPath.CGPath;

    pathAnimation.duration =0.5;

    pathAnimation.timingFunction = [CAMediaTimingFunctionfunctionWithName:kCAMediaTimingFunctionEaseInEaSEOut];

    pathAnimation.delegate =self;

    pathAnimation.removedOnCompletion =NO;

    pathAnimation.fillMode =kCAFillModeForwards;

    

    [shapLayer addAnimation:pathAnimationforKey:@"shapAnmination"];

}

#pragma mark - CAAnimationDelegate

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag

{

    if ([animisEqual:[self.shapeLayeranimationForKey:@"shapAnmination"]]) {

        CGRect rect =self.frame;

        rect.origin =self.headView.frame.origin;

        self.bounds = rect;

        rect.size =self.headView.frame.size;

        self.frame = rect;

        

        [UIViewanimateWithDuration:1.0animations:^{

            self.center =CGPointMake([UIScreenmainScreen].bounds.size.width - 60, [UIScreenmainScreen].bounds.size.height - 80);

            self.transform =CGAffineTransformMakeScale(0.5,0.5);

            

        } completion:^(BOOL finished) {

            self.smallBtn.frame =self.frame;

            self.smallBtn.layer.cornerRadius = self.smallBtn.bounds.size.width * 0.5;

            self.smallBtn.layer.masksToBounds = YES;

            [self.superviewaddSubview:_smallBtn];

        }];

    } elseif ([anim isEqual:[self.shapeLayeranimationForKey:@"showAnimation"]]) {

        self.layer.mask =nil;

        self.shapeLayer =nil;

    }

}

- (UIButton *)smallBtn

{

    if (!_smallBtn) {

        _smallBtn = [UIButtonbuttonWithType:UIButtonTypeCustom];

        [_smallBtnaddTarget:selfaction:@selector(microClick)forControlEvents:UIControlEventTouchUpInside];

    }

    return_smallBtn;

}

- (void)microClick

{

    [self.smallBtnremoveFromSuperview];

    self.smallBtn =nil;

    

    [UIViewanimateWithDuration:1.0animations:^{

        self.center =self.headView.center;

        self.transform =CGAffineTransformIdentity;

    } completion:^(BOOL finished) {

        self.bounds = [UIScreenmainScreen].bounds;

        self.frame =self.bounds;

        

        CAShapeLayer *shapeLayer =self.shapeLayer;

        

        // 1.获取动画缩放开始时的圆形

        UIBezierPath *startPath = [UIBezierPathbezierPathWithOvalInRect:self.headView.frame];

        

        // 2.获取动画缩放结束时的圆形

        CGSize endSize =CGSizeMake(self.frame.size.width * 0.5, self.frame.size.height - self.headView.center.y);

        CGFloat radius =sqrt(endSize.width * endSize.width + endSize.height * endSize.height);

        CGRect endRect =CGRectInset(self.headView.frame, -radius, -radius);

        UIBezierPath *endPath = [UIBezierPathbezierPathWithOvalInRect:endRect];

        

        // 3.创建shapeLayer作为视图的遮罩

        shapeLayer.path = endPath.CGPath;

        

        // 添加动画

        CABasicAnimation *pathAnimation = [CABasicAnimationanimationWithKeyPath:@"path"];

        pathAnimation.fromValue = (id)startPath.CGPath;

        pathAnimation.toValue = (id)endPath.CGPath;

        pathAnimation.duration =0.5;

        pathAnimation.timingFunction = [CAMediaTimingFunctionfunctionWithName:kCAMediaTimingFunctionEaseInEaseOut];

        pathAnimation.delegate =self;

        pathAnimation.removedOnCompletion =NO;

        pathAnimation.fillMode =kCAFillModeForwards;

        

        [shapeLayer addAnimation:pathAnimationforKey:@"showAnmination"];

    }];

}

@end

//

//  ViewController.m

//

#import "ViewController.h"

#import "ShowContentView.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {

    [superviewDidLoad];

    // Do any additional setup after loading the view, typically from a nib.

    [self.viewsetBackgroundColor:[UIColorgreenColor]];

    ShowContentView *showView = [[ShowContentViewalloc]initWithFrame:self.view.frame];

    [showView setBackgroundColor:[UIColorlightGrayColor]];

    [self.viewaddSubview:showView];

}

@end


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表