iOS开发探索-Loading动画

目前公司的两个项目一直使用的是自己封装的一个简易动画,现在打算把动画简单的优化重构一下,做为动画工具调用。动画效果非常简洁轻量,并且不依赖任何库,欢迎各位来围观吐槽~。

动画效果示例如下图所示:

iOS开发探索-Loading动画_第1张图片
loading.png

1.简单的调用API:

+(instancetype)shareAnimation;

 //开始动画
- (void)startAnimating;

 //结束动画
- (void)stopAnimating;

// 动画状态
- (BOOL)isAnimating;

//可以设置动画提示文字
-(void)startAnimatingWithTitle:(NSString *)title;

2.具体实现:

使用UIView类实现动画
a.初始化动画视图控件,同时保存视图transform和center初始值
-(instancetype)init
{
    if (self = [super init]) {
        self.frame = CGRectMake(0, 0, 100, 50);
        self.center = CGPointMake(kScreenWidth/2.0, kScreenHeight/2.0);
        
        UIView *blueView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 30, 30)];
        blueView.center = CGPointMake(35, 25);
        blueView.backgroundColor = [UIColor blueColor];
        [self drawCircleView:blueView];
        self.blueView = blueView;
        [self addSubview:blueView];
        
        UIView *greenView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 50, 50)];
        greenView.center = CGPointMake(75, 25);
        greenView.backgroundColor = [UIColor greenColor];
        self.greenView = greenView;
//通过CAShapeLayer结合UIBezierPath生成圆角
        [self drawCircleView:greenView];
        [self addSubview:greenView];
        
        blueCenter = self.blueView.center;
        greenCenter= self.greenView.center;
        
        blueTransform = self.blueView.transform;
        greenTransform = self.greenView.transform;
        self.hidden = YES;
    }
    return self;
}

 绘制圆角
- (void)drawCircleView:(UIView*)view
{
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.path = [UIBezierPath bezierPathWithRoundedRect:view.bounds cornerRadius:view.bounds.size.width/2.0].CGPath;
    view.layer.mask = maskLayer;
}

**注意:当然下面两个方法也可以生成圆角,但是会产生离屏渲染,产出性能问题,故不推荐使用。
    self.view.layer.masksToBounds = YES;
    self.view.layer.cornerRadius = 5;



b.基本写法,代码必须放在Begin和Commit之间:
    [UIView beginAnimations:@"LoadingAnimation" context:nil];
    [UIView setAnimationDelegate:self];
    [UIView setAnimationDuration:0.5];
    [UIView setAnimationRepeatAutoreverses:YES];
    [UIView setAnimationRepeatCount:MAXFLOAT];
    //通过
    self.blueView.transform = CGAffineTransformMakeScale(5/3.0, 5/3.0);
    self.blueView.center = CGPointMake(25, 25);
    self.greenView.transform = CGAffineTransformMakeScale(0.6, 0.6);
    self.greenView.center = CGPointMake(65, 25);
    
    [UIView setAnimationDidStopSelector:@selector(animationDidStop:finished:context:)];
    [UIView commitAnimations];

c.动画结束时候通过代理方法恢复至原始的视图transform和center
  -(void) animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context
   {
      _blueView.center = blueCenter;
      _blueView.transform = blueTransform;
      _greenView.center = greenCenter;
      _greenView.transform =greenTransform;
   }

github地址 https://github.com/524429264/LoadingAnimation.git

扫描下方二维码关注我

iOS开发探索-Loading动画_第2张图片
零距离仰望星空

在此感谢各位读者的来访,您的关注是我写作分享的最大动力。

你可能感兴趣的:(iOS开发探索-Loading动画)