在Android上用Canvas繪製音訊波形圖
阿新 • • 發佈:2019-02-10
最近在研究VAD演算法,但調整引數時無法實時看到效果,於是決定將音訊波形實時繪製出來,並且語音部分和噪音部分用不同顏色的線條顯示,這樣就能立即看到VAD演算法對各種噪音型別的魯棒性
為了簡化問題規模,先研究出怎麼在Android下實時繪製隨機生成波形的功能,後面再加入語音獲取、根據VAD演算法的結果用不同顏色線條顯示等功能
查了下Canvas類,發現drawLines方法跟drawLine方法都是根據4個浮點數繪製一條直線,前者還需要開闢額外的空間,所以選擇了後者,結果繪製速度很慢,在我的小米2s上繪製2s單通道16KHz取樣率16bit位寬的音訊,耗時達到700ms,無奈嘗試前者,其他條件不變的情況下降至20ms(最快1ms)
由此也能推測出,後者開銷這麼大主要是花在drawLine的函式呼叫,而不是座標點的生成。
程式碼
package com.happen23.games.waveviewer; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import android.util.Log; import android.view.View; import android.view.ViewTreeObserver; import java.util.Random; /** * Created by Administrator on 2016/5/14. */ public class VadView extends View { private static final String TAG = "VadView"; Paint paint; int audioSampleNum = 2 * 16000; int widthPixels; int heightPixels; float points[]; short audio[]; public VadView(Context context, AttributeSet attrs) { super(context, attrs); paint = new Paint(); paint.setColor(Color.BLUE); paint.setStrokeJoin(Paint.Join.ROUND); paint.setStrokeCap(Paint.Cap.ROUND); paint.setStrokeWidth(1); getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { widthPixels = getWidth(); heightPixels = getHeight(); } }); } protected void drawWave2(Canvas canvas, short audio[]) { for (int i = 0; i < audioSampleNum-1; i++){ points[4*i] = (float)i/audioSampleNum * widthPixels; points[4*i+1] = heightPixels/2 + (float)audio[i]/32768 * heightPixels/2; points[4*i+2] = (float)(i+1)/audioSampleNum * widthPixels; points[4*i+3] = heightPixels/2 + (float)audio[i+1]/32768 * heightPixels/2; }; canvas.drawLines(points, paint); } protected void drawWave1(Canvas canvas, short audio[]){ float startX, startY, stopX, stopY; for (int i = 0; i < audio.length-1; i++){ startX = (float)i/audioSampleNum * widthPixels; startY = heightPixels/2 + (float)audio[i]/32768 * heightPixels/2; stopX = (float)(i+1)/audioSampleNum * widthPixels; stopY = heightPixels/2 + (float)audio[i+1]/32768 * heightPixels/2; canvas.drawLine(startX, startY, stopX, stopY, paint); } } protected void onDraw(Canvas canvas) { if (points == null) { points = new float[audioSampleNum * 4]; audio = new short[audioSampleNum]; } Random r = new Random(); for (int i = 0; i < audioSampleNum; i++){ audio[i] = (short)(r.nextInt(65536) - 32768); } Log.w(TAG, "start drawLine"); drawWave2(canvas, audio); Log.w(TAG, "stop drawLine"); postDelayed(new Runnable() { @Override public void run() { invalidate(); } }, 200); } }