音乐波形图动画效果

简介:

音乐波形图动画效果

 

注意

经过测试,后期会发热严重,有优化的必要,但目前还没有处理。

 

效果

 

源码

https://github.com/YouXianMing/Animations




//
//  MusicBarAnimationController.m
//  Animations
//
//  Created by YouXianMing on 16/1/15.
//  Copyright © 2016年 YouXianMing. All rights reserved.
//

#import "MusicBarAnimationController.h"
#import "GCD.h"

@interface MusicBarAnimationController ()

@property (nonatomic, strong) GCDTimer  *timer;

@end

@implementation MusicBarAnimationController

- (void)setup {

    [super setup];
    
    self.view.backgroundColor = [UIColor blackColor];
    
    CGFloat width  = self.contentView.frame.size.width;
    CGFloat height = self.contentView.frame.size.height;
    
    CAReplicatorLayer *replicatorLayer = [CAReplicatorLayer layer];
    [self.contentView.layer addSublayer:replicatorLayer];
    
    replicatorLayer.frame              = CGRectMake(0, 0, width, height);
    replicatorLayer.position           = self.view.center;
    replicatorLayer.borderWidth        = 0.5f;
    replicatorLayer.instanceCount      = width / 8;
    replicatorLayer.masksToBounds      = YES;
    replicatorLayer.instanceTransform  = CATransform3DMakeTranslation(-8.0, 0.0, 0.0);
    replicatorLayer.instanceDelay      = 0.5f;
    
    CALayer *layer        = [CALayer layer];
    layer.frame           = CGRectMake(width - 4, height, 4, height);
    layer.backgroundColor = [UIColor blackColor].CGColor;
    layer.cornerRadius    = 2.f;
    [replicatorLayer addSublayer:layer];
    
    self.timer = [[GCDTimer alloc] initInQueue:[GCDQueue mainQueue]];
    [self.timer event:^{
        
        CABasicAnimation *colorAnimation = [CABasicAnimation animationWithKeyPath:@"backgroundColor"];
        colorAnimation.toValue           = (id)[UIColor colorWithRed:arc4random() % 256 / 255.f
                                                               green:arc4random() % 256 / 255.f
                                                                blue:arc4random() % 256 / 255.f
                                                               alpha:1].CGColor;
        
        CABasicAnimation *positionAnimation = [CABasicAnimation animationWithKeyPath:@"position.y"];
        positionAnimation.toValue           = @(layer.position.y - arc4random() % ((NSInteger)height - 64));
        
        CAAnimationGroup *group = [CAAnimationGroup animation];
        group.duration          = 1.f;
        group.autoreverses      = true;
        group.repeatCount       = CGFLOAT_MAX;
        group.timingFunction    = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
        group.animations        = @[colorAnimation, positionAnimation];
        [layer addAnimation:group forKey:nil];
        
    } timeIntervalWithSecs:1.f delaySecs:1.f];
    [self.timer start];
}

@end

细节

 

目录
相关文章
|
6月前
|
开发框架
threejs做特效:实现物体的发光效果-EffectComposer详解!
【8月更文挑战第7天】实现物体的发光效果-EffectComposer详解!
824 6
threejs做特效:实现物体的发光效果-EffectComposer详解!
|
6月前
|
图形学
小功能⭐️Unity中利用材质自发光实现物体闪烁效果
小功能⭐️Unity中利用材质自发光实现物体闪烁效果
|
8月前
|
图形学
【unity小技巧】FPS游戏实现相机的偏移震动、武器射击后退和后坐力效果
【unity小技巧】FPS游戏实现相机的偏移震动、武器射击后退和后坐力效果
84 1
|
8月前
|
算法 图形学
【实现100个unity特效之3】使用PerlinNoise(柏林噪声)实现平滑的灯光闪烁效果
【实现100个unity特效之3】使用PerlinNoise(柏林噪声)实现平滑的灯光闪烁效果
150 0
|
8月前
|
图形学
【unity小技巧】FPS简单的射击换挡瞄准动画控制
【unity小技巧】FPS简单的射击换挡瞄准动画控制
65 0
|
8月前
|
图形学
【unity小技巧】最简单的FPS游戏准心跳动动画控制
【unity小技巧】最简单的FPS游戏准心跳动动画控制
75 0
|
8月前
|
图形学
【unity小技巧】实现没有动画的FPS武器摇摆和摆动效果
【unity小技巧】实现没有动画的FPS武器摇摆和摆动效果
68 0
|
9月前
使用html+css制作一个发光立方体特效
使用html+css制作一个发光立方体特效
67 2
|
9月前
如何用SCSS制作小铃铛振动/震动/摇晃/晃动的特效/效果?
如何用SCSS制作小铃铛振动/震动/摇晃/晃动的特效/效果?
An动画基础之元件的影片剪辑效果
An动画基础之元件的影片剪辑效果
449 0

热门文章

最新文章