溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

iOS實現(xiàn)音樂震動條效果

發(fā)布時間:2021-06-30 12:56:54 來源:億速云 閱讀:171 作者:小新 欄目:移動開發(fā)

小編給大家分享一下iOS實現(xiàn)音樂震動條效果,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!

一、簡單分析

音樂震動條不需要與用戶交互。我們可以使用復(fù)制層來操作。添加震動條。添加動畫。

復(fù)制層說明

//創(chuàng)建復(fù)制層
-(void)createRepl{
 //復(fù)制層
 CAReplicatorLayer * repL = [CAReplicatorLayer layer];
 repL.frame = self.contentV.bounds;
 //復(fù)制6份
 repL.instanceCount = 6;
 //形變,每一個形變都是相對于上一個復(fù)制出來的子層開始的
 repL.instanceTransform = CATransform3DMakeTranslation(45, 0, 0);
 //動畫延時執(zhí)行
 repL.instanceDelay = 0.5;
 ///要設(shè)置復(fù)制層的顏色 原始層的顏色要設(shè)為白色.
 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.創(chuàng)建復(fù)制層次
 [self createRepl];

 //2.添加音量震動條
 [self addVoiceBar];

 //3.添加動畫
 [self addAnimation];
}


//創(chuàng)建復(fù)制層
-(void)createRepl{
 //復(fù)制層
 CAReplicatorLayer * repL = [CAReplicatorLayer layer];
 repL.frame = self.contentV.bounds;
 //復(fù)制6份
 repL.instanceCount = 6;
 //形變,每一個形變都是相對于上一個復(fù)制出來的子層開始的
 repL.instanceTransform = CATransform3DMakeTranslation(45, 0, 0);
 //動畫延時執(zhí)行
 repL.instanceDelay = 0.5;
 ///要設(shè)置復(fù)制層的顏色 原始層的顏色要設(shè)為白色.
 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];
 //設(shè)置屬性
 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實現(xiàn)音樂震動條效果

以上是“iOS實現(xiàn)音樂震動條效果”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注億速云行業(yè)資訊頻道!

向AI問一下細節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

ios
AI