大家有唱过K的都知道,在演唱过程中一般会显示标准音高线,演唱者唱对则会显示分数,缺乏评分的唱K,无疑是缺乏灵魂的
在这里话不多说,推荐一款可以让大家轻松接入,无音视频开发经验也能驾驭的评分SDK
1、通过QQ:2875752033,官方网址 www.cenparty.com 联系上云歌实验室,拿到可用的 Android/IOS 评分SDK
2、安卓SDK实验室那边会给到.aar库,而IOS会给到.framework库,通过正常方法引入库到我们项目后,即可进行下一步对接
3、自定义评分绘制控件
public class CustomView extends ScoreBasicView {
private Paint mPaint;
private int mHitPos = -1;
public CustomView(Context context) {
super(context);
mPaint = new Paint();
mPaint.setStrokeWidth(getBlockHeight());
mPaint.setStrokeCap(Paint.Cap.ROUND);
}
public CustomView(Context context, AttributeSet attrs) {
super(context, attrs);
mPaint = new Paint();
mPaint.setStrokeWidth(getBlockHeight());
mPaint.setStrokeCap(Paint.Cap.ROUND);
}
/**
* 设置打分圆点偏移像素
*
* @return
*/
@Override
public int getXOffsetPx() {
return 300;
}
/**
* 设置每像素多少毫秒(决定打分曲线每段长度)
*
* @return
*/
@Override
public int getMsPrePx() {
return 2;
}
/**
* 设置打分曲线高度
*
* @return
*/
@Override
public int getBlockHeight() {
return 12;
}
/**
* 设置录音延时
*
* @return
*/
@Override
public int getRecordDelay() {
return Constants.WAVE_DELAY_CUL;
}
/**
* 自定义绘制
*
* @param canvas 画布
* @param offsetx 整体曲线向左移动像素值
* @param hitCusorY 打分圆点y值高度
* @param standers 标准曲线列表
* @param recordMap 录音信息Map
* @return false使用默认绘制,true使用自定义绘制
*/
@Override
public boolean onCustomDraw(Canvas canvas, int offsetx, int hitCusorY, int maxPos,
ArrayList<ScoreInfo> standers, HashMap<Integer, ArrayList<ScoreInfo>> recordMap) {
this.mPaint.setColor(-533482011);
int height = getMeasuredHeight();
int blockHeight = getBlockHeight();
canvas.drawRect(0.0F, 0.0F, (float) this.getXOffsetPx(), height, this.mPaint);
drawPitchBlock(canvas, recordMap, standers, offsetx);
this.mPaint.setColor(-48060);
float eve = 1.0f * (height - blockHeight) / maxPos;
if (mHitPos == -1) {
if (maxPos != 0) {
mHitPos = (int) (blockHeight / 2.0 + (maxPos - 1) * eve);
} else {
mHitPos = (int) (height - blockHeight / 2.0);
}
}
if (hitCusorY == -1) {
mHitPos += height / 10;
int maxH = (int) (blockHeight / 2.0 + (maxPos - 1) * eve);
if (mHitPos > maxH) {
mHitPos = maxH;
}
} else {
mHitPos = hitCusorY;
}
canvas.drawCircle(getXOffsetPx(), mHitPos, blockHeight / 2f, mPaint);
return true;
}
/**
* 绘制标准文件线段
*
* @param canvas canvas
*/
private void drawPitchBlock(Canvas canvas, HashMap<Integer, ArrayList<ScoreInfo>> recMap, ArrayList<ScoreInfo> stand, int offset) {
boolean need = false;
for (int i = 0, size = stand.size(); i < size; ++i) {
ScoreInfo stander = stand.get(i);
int x1 = stander.drawRect[0] - offset;
int x2 = stander.drawRect[1] - offset;
int y = stander.drawRect[2];
if (isNeedDraw(x1, x2)) {
mPaint.setColor(Color.LTGRAY);
need = true;
canvas.drawLine(x1, y, x2, y, mPaint);
if (recMap.containsKey(i)) {
boolean need2 = false;
List<ScoreInfo> words = recMap.get(i);
mPaint.setColor(Color.RED);
for (ScoreInfo word : words) {
int xx1 = word.drawRect[0] - offset;
int xx2 = word.drawRect[1] - offset;
int yy = word.drawRect[2];
if (isNeedDraw(xx1, xx2)) {
need2 = true;
if (y == yy && intersects(x1, x2, xx1, xx2)) {
canvas.drawLine(Math.max(xx1, x1), yy, Math.min(xx2, x2), yy, mPaint);
}
} else if (need2) {
break;
}
}
}
} else if (need) {
break;
}
}
}
private boolean intersects(int x1, int x2, int xx1, int xx2) {
return x1 < xx2 && xx1 < x2;
}
/**
* 判断是否需要绘制这部分区域
*
* @param var1 区域的左边
* @param var2 区域的右边
* @return
*/
private boolean isNeedDraw(int var1, int var2) {
return !(var1 >= getWidth() || var2 <= 0);
}
}
4、接着我们把录音数据传进控件,即可实现评分啦,是不是很方便呢
mCustomView.feedRecordBuffer(rec, rec.length, ms, isFeakTime);
5、如果说“可是录音数据哪来啊?我们也不会弄音视频相关的”,那么请放心,云歌实验室还提供----音频能力库,
方便大家轻松上手,见《云歌音频库》