温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

iOS实现音乐震动条效果

发布时间:2021-06-30 12:56:54 来源:亿速云 阅读:157 作者:小新 栏目:移动开发

小编给大家分享一下iOS实现音乐震动条效果,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

一、简单分析

音乐震动条不需要与用户交互。我们可以使用复制层来操作。添加震动条。添加动画。

复制层说明

//创建复制层
-(void)createRepl{
 //复制层
 CAReplicatorLayer * repL = [CAReplicatorLayer layer];
 repL.frame = self.contentV.bounds;
 //复制6份
 repL.instanceCount = 6;
 //形变,每一个形变都是相对于上一个复制出来的子层开始的
 repL.instanceTransform = CATransform3DMakeTranslation(45, 0, 0);
 //动画延时执行
 repL.instanceDelay = 0.5;
 ///要设置复制层的颜色 原始层的颜色要设为白色.
 repL.instanceColor = [UIColor redColor].CGColor;
 [self.contentV.layer addSublayer:repL];

 self.repL = repL;
}

二、代码

//
// ViewController.m
// 03_UIView75_音乐震动条
//
// Created by 杞文明 on 17/7/21.
// Copyright © 2017年 杞文明. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIView *contentV;
@property (weak,nonatomic) CAReplicatorLayer * repL;
@property (weak,nonatomic) CALayer * layer;
@end

@implementation ViewController

- (void)viewDidLoad {
 [super viewDidLoad];

 //1.创建复制层次
 [self createRepl];

 //2.添加音量震动条
 [self addVoiceBar];

 //3.添加动画
 [self addAnimation];
}


//创建复制层
-(void)createRepl{
 //复制层
 CAReplicatorLayer * repL = [CAReplicatorLayer layer];
 repL.frame = self.contentV.bounds;
 //复制6份
 repL.instanceCount = 6;
 //形变,每一个形变都是相对于上一个复制出来的子层开始的
 repL.instanceTransform = CATransform3DMakeTranslation(45, 0, 0);
 //动画延时执行
 repL.instanceDelay = 0.5;
 ///要设置复制层的颜色 原始层的颜色要设为白色.
 repL.instanceColor = [UIColor redColor].CGColor;
 [self.contentV.layer addSublayer:repL];

 self.repL = repL;
}

//添加音量震动条
-(void)addVoiceBar{
 CALayer * layer = [CALayer layer];
 layer.frame = CGRectMake(0, self.contentV.bounds.size.height-150, 30, 150);
 layer.backgroundColor = [UIColor whiteColor].CGColor;

 layer.position = CGPointMake(0, self.contentV.bounds.size.height);
 layer.anchorPoint = CGPointMake(0, 1);

 [self.repL addSublayer:layer];
 self.layer = layer;
}

//添加动画
-(void)addAnimation{
 //添加动画 对y方向缩放
 CABasicAnimation * anim = [CABasicAnimation animation];
 //设置属性
 anim.keyPath = @"transform.scale.y";
 anim.toValue = @0;
 anim.repeatCount = MAXFLOAT;
 anim.autoreverses = YES;
 anim.duration = 0.5;
 [self.layer addAnimation:anim forKey:nil];
}

@end

三、图示

iOS实现音乐震动条效果

以上是“iOS实现音乐震动条效果”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

ios
AI