你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發綜合 >> iOS仿小紅書呼吸燈動畫(核心動畫和定時器)兩種方式實現

iOS仿小紅書呼吸燈動畫(核心動畫和定時器)兩種方式實現

編輯:IOS開發綜合

最近公司需求做個類似小紅書的標簽呼吸燈動畫,經過一段時間研究使用兩種方式實現了該效果...

第一種方式使用定時器加 UIView動畫,核心方法如下

-(void)begigFlashAnimation {
  // 縮放 + 透明度動畫
  self.flashView.transform = CGAffineTransformMakeScale(0.1, 0.1);
  [UIView animateWithDuration:3 animations:^{
    self.flashView.transform = CGAffineTransformMakeScale(1,1);
    self.flashView.alpha = 1.0;
    [UIView beginAnimations:@"flash" context:nil];
    [UIView setAnimationDuration:2];
    [UIView setAnimationCurve:UIViewAnimationCurveLinear];
    self.flashView.alpha = 0;
    [UIView commitAnimations];
  }];
}

第二種方式使用核心動畫的動畫組,核心方法如下

- (CAAnimationGroup *)groups {
  if (!_groups) {
    // 縮放動畫
    CABasicAnimation * scaleAnim = [CABasicAnimation animation];
    scaleAnim.keyPath = @"transform.scale";
    scaleAnim.fromValue = @0.1;
    scaleAnim.toValue = @1;
    scaleAnim.duration = 2;
    // 透明度動畫
    CABasicAnimation *opacityAnim=[CABasicAnimation animationWithKeyPath:@"opacity"];
    opacityAnim.fromValue= @1;
    opacityAnim.toValue= @0.1;
    opacityAnim.duration= 2;
    // 創建動畫組
    _groups =[CAAnimationGroup animation];
    _groups.animations = @[scaleAnim,opacityAnim];
    _groups.removedOnCompletion = NO;
    _groups.fillMode = kCAFillModeForwards;
    _groups.duration = 2;
    _groups.repeatCount = FLT_MAX;
  }
  return _groups;
}

對比兩種方法,第一種方法需要使用定時器,第二個則不需要,不知道這樣是否第二個性能性對來說會好點呢?

github項目地址:https://github.com/Caiflower/XXTwinkleView.git

demo下載:XXTwinkleView_jb51.rar

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持本站。

  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved