iOS音波图的绘制生成

2018-12-29 王建伟 iOS开发

我们在实现录音和音乐播放功能的时候，经常需要绘制音波图，这篇文章主要讲如何根据声音自动生成音波图

首先我们先介绍一下如何获取声音的音波数据，根据每秒获取的数据然后绘制图形

利用方法：[self.recorder updateMeters]来获取音波的波值，然后对波值进行处理

 float power =[self.recorder averagePowerForChannel:0];
float minValue = -60;
if(power<minValue) { 
power=minValue;
 }
 float decibels=(power+60)/60*100;

获取了音波的数值后，现在我们需要来绘制音波图像了

首先创建一个view类，类中需要3个属性值，总数：totalCount,波值数组：voiceWaves,波值当前数组：currentVoiceWaves

然后开始编写绘制图形的方法：

 -(void)drawRect:(CGRect)rect{
[self drawLevelLine];
[self drawVoiceWave];
}
-(void)drawLevelLine{
NSMutableParagraphStyle*paragraphStyle = [[NSParagraphStyle defaultParagraphStyle] mutableCopy];
paragraphStyle.alignment= NSTextAlignmentCenter;
CGFloat H=self.frame.size.height/8;
NSArray*numbers=@[@"75",@"50",@"25",@"0",@"25",@"50",@"75"];
for (int i=1;i<8,;i++){ 
UIBezierPath*linePath=[UIBezierPath bezierPath]; 
[linePath moveToPoint:SPPoint(22,H*i)];
 [linePath addLineToPoint:SPPoint(SPScreen_W,H*i)]; 
linePath lineWidth=0.5;
 [SPUselessColor setStroke]; 
[linePath stroke]; 
[number[i-1] drawInRect:SPFrame(0,H*i-6,22,10) withAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:10.f],NSForegroundColorAttributeName:SPGrayColor,NSParagraphStyleAttributeName:paragraphStyle}]; } } 
-(void)drawVoiceWave{ 
for (int i=0; i<self.currentVoiceWaves.count; i++) { 
CGFloat n=[self.currentVoiceWaves[i] floatValue]; 
UIBezierPath*linePath=[UIBezierPath bezierPath]; 
[linePath moveToPoint:SPPoint(i*2+22, 100-n)]; 
[linePath addLineToPoint:SPPoint(i*2+22, 100+n)];
 linePath.lineWidth=1;
 [SPMainColor setStroke];
 [linePath stroke];
 } 
}

根据获取到的音波数据绘制图形方法：

 -(void)setRecordVoiceWaveWithFloat:(CGFloat)number{
    [self.voiceWaves addObject:[NSNumber numberWithFloat:number]];
    if(self.voiceWaves.count>=TW){
        self.currentVoiceWaves=[NSMutableArray arrayWithArray:[self.voiceWaves    subarrayWithRange:NSMakeRange(self.voiceWaves.count-TW, TW)]];
    }
    else{
        self.currentVoiceWaves=[self.voiceWaves mutableCopy];
    }
    [self setNeedsDisplay];
}

清空当前图形方法：

 -(void)refreshSPRecordView{
    [self.voiceWaves removeAllObjects];
    [self.currentVoiceWaves removeAllObjects];
    [self setNeedsDisplay];
    playLineView.frame=SPFrame(22, 4, 1, 192);
}

移动播放指针图形

 -(void)removePlayLineWithCount:(NSInteger)count{
    NSInteger CW=self.voiceWaves.count;
    if(count<=TW/2){
 NSInteger c=(CW<TW)?CW:TW; 
self.currentVoiceWaves=[NSMutableArray arrayWithArray:[self.voiceWaves subarrayWithRange:NSMakeRange(0, c)]]; playLineView.frame=SPFrame(22+count*2, 4, 1, 192);
 } 
else{
 NSInteger c=(CW<=count+TW/2)?(CW-count+TW/2):TW; 
self.currentVoiceWaves=[NSMutableArray arrayWithArray:[self.voiceWaves subarrayWithRange:NSMakeRange(count-TW/2,c)]]; 
playLineView.frame=SPFrame(22+TW, 4, 1, 192);
 } 
[self setNeedsDisplay]; 
}

具体效果如下图：

分享到： QQ空间新浪微博腾讯微博微信更多

« Android判断网络是否可用、区分WiFi和数据、是否被安全软件拦截 | 在CSS中使用变量»

iOS音波图的绘制生成

日历

存档

最新评论

链接

搜索