音乐波形图动画效果

简介:

音乐波形图动画效果

 

注意

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

 

效果

 

源码

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

细节

 

目录
相关文章
|
4月前
宇宙星星转动特效带背景音乐引导页源码
宇宙星星转动特效带背景音乐引导页源码,源码由HTML+CSS+JS组成,记事本打开源码文件可以进行内容文字之类的修改,双击html文件可以本地运行效果,也可以上传到服务器里面,重定向这个界面
63 7
宇宙星星转动特效带背景音乐引导页源码
|
5月前
|
开发框架
threejs做特效:实现物体的发光效果-EffectComposer详解!
【8月更文挑战第7天】实现物体的发光效果-EffectComposer详解!
642 6
threejs做特效:实现物体的发光效果-EffectComposer详解!
|
5月前
PPT 动画-树叶摆动
PPT 动画-树叶摆动
41 0
|
5月前
PPT 动画-旋转唱片
PPT 动画-旋转唱片
69 0
|
5月前
|
图形学
小功能⭐️Unity中利用材质自发光实现物体闪烁效果
小功能⭐️Unity中利用材质自发光实现物体闪烁效果
|
7月前
|
Go 图形学
【Unity小技巧】3D人物移动脚步和跳跃下落音效控制
【Unity小技巧】3D人物移动脚步和跳跃下落音效控制
79 1
|
7月前
|
算法 图形学
【实现100个unity特效之3】使用PerlinNoise(柏林噪声)实现平滑的灯光闪烁效果
【实现100个unity特效之3】使用PerlinNoise(柏林噪声)实现平滑的灯光闪烁效果
124 0
|
8月前
如何用SCSS制作小铃铛振动/震动/摇晃/晃动的特效/效果?
如何用SCSS制作小铃铛振动/震动/摇晃/晃动的特效/效果?
|
前端开发 JavaScript
2023跨年代码(烟花+背景音乐)
2023跨年代码(烟花+背景音乐)
396 0
An动画基础之元件的影片剪辑效果
An动画基础之元件的影片剪辑效果
431 0

热门文章

最新文章