音频条形图,顶部带小矩形

简单实现音频条形图,但是顶部新加了小矩形,不过没有实现小矩形自由下落的动画,如果谁那有实现了的demo,记得发我一份一起学习。大笑

首先自定义View分为这么一下几步:

1.首要绘制出一排长短不一样的矩形图

2.通过延迟调用onDraw方法实现矩形图可以动起来

3.下面加入线性渐变的效果,让这个音频条看着更好看(以上这几步网上的例子很多,就不多说了,一会直接贴出代码)

4.下面说我在顶部加了一个小的矩形,这里我是通过矩形条上次和这次比较是变长还是变短进行的分别绘制,

1.由长变短我会在原来的位置从新画上小的矩形 

2.由短变长我会在新的位置画上笑的矩形(不知道这么说能说明白不)

上面就是基本的步骤了,主要是最后一步,我本来想在网上找找参考一下,后来没找着,就自己试着写了写,如果不对的话希望指出,谢谢各位大神了啊。

下面把主要的代码写出来:

 for (int i = 0; i < rectCount; i++) {
            random = Math.random();
            currentH = (float) (rectH * random)+offset;
            //绘制矩形上面的小方块
                lastHeight = (float) array.get(i);
                float  desY =lastHeight-currentH;
                if (desY>0) {//上一个高度距离顶部远
                    canvas.drawRect((rectW+offset)*i,
                            currentH-offset,
                            (rectW+offset)*i+rectW,
                            currentH,paint1);
                }else {//上一个高度距离顶部近
                    canvas.drawRect((rectW+offset)*i,
                            lastHeight-offset,
                            (rectW+offset)*i+rectW,
                            lastHeight,paint1);
                }


            //绘制下面的可变矩形
            canvas.drawRect((rectW+offset)*i,
                            currentH,
                            (rectW+offset)*i+rectW,
                            rectH,paint);

            array.put(i,currentH);

        }
        postInvalidateDelayed(500);

    }
上面的注释也都写的差不多了,就不多说了。下面是写的线性渐变的代码,原来用这个写过一个相机水印的渐变的背景颜色,很好用省去找UI切图的麻烦。

 int width = getWidth();
        int height = getHeight();
        int mRectW = (int) (width * 0.5 / rectCount);
        LinearGradient linearGradient = new LinearGradient(0, 0, mRectW, height, Color.BLUE,
                Color.RED, Shader.TileMode.CLAMP);
        paint.setShader(linearGradient);

基本上就这些东西了,很简单的小例子,最后上个图,



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值