Android 音量调节View

导语

手机直播一般都会通过移动屏幕来调节音量的大小，本篇只实现了图例，并不能改变音量。
先看效果：

需要的素材：小喇叭图片，点击这里获取

预热

如果你对Path,PathMeasure,RectF,Canvas等不适很了解的话，强烈建议看这位哥们的教程：
点击这里查看教程
如果你将这哥们的十几篇帖子都看完了的话，这个View实际上是非常简单的

步骤介绍

用动态图来介绍：

这里用文字翻译下：

1. 将小喇叭画到中心位置
2. 围绕着喇叭画一个圆圈，浅色的
3. 画一个圆弧，深色的
4. 根据触摸的位置来改变圆弧的大小

分解之后，发现并没有什么难度（可能本身就没有什么难度），下面来看每一步的操作，最后会将整个View的代码贴出来

绘制小喇叭

相关代码片（不要复制，只是看的）

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    //坐标移动到中心
    canvas.translate(mViewWidth / 2, mViewHeight / 2);
    //拿到小喇叭图片
    Bitmap voice = BitmapFactory.decodeResource(getResources(), R.mipmap.voice);
    //获取图片的宽高
    int bWidth = voice.getWidth();
    int bHeight = voice.getHeight();
    //移动坐标到中心位置
    canvas.drawBitmap(voice, -bWidth / 2, -bHeight / 2, outerCirclePaint);
}

分析
核心：将图片放到中心位置：
将图片向上移动高度的一半，向左移动宽度的一半，就可以移动到中心如图所示：

绘制浅色的圆环

相关代码片（不要复制，只是看的）

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    initPaint();
    //坐标移动到中心
    canvas.translate(mViewWidth / 2, mViewHeight / 2);

    //底层圆圈
    if (cirPath == null)
        cirPath = new Path();
    if (rectF == null) {
        //半径选取为图片宽度一半的1.3倍，可以调节
        r = (int) (bWidth / 2 * 1.3f);
        rectF = new RectF(-r, -r, r, r);
    }
    cirPath .addArc(rectF, 0, 360);
    //画底层浅色的圆圈
    canvas.drawPath(cirPath, outerCirclePaint);
}

分析：
这步没有什么难度，只是绘制一个圆圈

画一个深色的圆弧

相关代码片（不要复制，只是看的）

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    //坐标移动到中心
    canvas.translate(mViewWidth / 2, mViewHeight / 2);