自定义动画效果——音频抖动效果
绘制一个矩形:
想要绘制一个矩形,继承View,并重写onDraw方法即可。复杂一点还可以重写onMeasure方法和onLayout方法进行大小测量和位置测量。但本文不打算写那么复杂的view,故只需要重写一个onDraw方法即可:
private RectF rectF = new RectF();//绘制矩形
private float lineWidth = 50;
private Paint paint = new Paint();
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//设置颜色
paint.setColor(context.getColor(R.color.colorPrimary));
//填充内部
paint.setStyle(Paint.Style.FILL);
//设置抗锯齿
paint.setAntiAlias(true);
//绘制矩形的四边
int widthCentre = getWidth() / 2;
int heightCentre = getHeight() / 2;
rectF.left = widthCentre - lineWidth / 2;
rectF.right = widthCentre + lineWidth / 2;
rectF.top = heightCentre - lineWidth * 2;
rectF.bottom = heightCentre + lineWidth * 2;
//绘制圆角矩形,rx:x方向上的圆角半径。ry:y方向上的圆角半径。
canvas.drawRoundRect(rectF, 6, 6, paint);
}
1.我们需要初始化一个RectF来绘制矩形,这个类通过一个边的来绘制矩形。并初始化一个画笔,和矩形的宽度。
2.在onDraw方法中,设置画笔paint,包括颜色,填充方式,是否抗拒性。还有更多的设置,读者可以自行查阅API
3.获取该View的实际宽高的一半,然后设置矩形的四边,熟悉Android的view的绘制都知道,view的宽为right - left,高度为bottom - top。所以让right比left多一个lineWidth即可让矩形的宽为lineWidth,bottom比top多4lineWidth即可让高读为4lineWidth,并利用实际宽高的一半,把矩形绘制在view的中央。
4.在画布上使用drawRoundRect方法绘制一个圆角的矩形
5.然后在xml文件中引用这个view就可以使用了:
<com.ycm.customview.LineWaveVoiceView
android:id="@+id/line1"
android:layout_width="300dp"
android:layout_height="100dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
/>
这样就可以在view中绘制一个矩形,如图所示:
绘制多个矩形
现在我们可以绘制多个矩形在画布上。直接采用for循环是不行的,这样会让矩形重叠在一起,导致只显示一个矩形,所以应该控制让矩形错开显示,我们可以让矩形之间间隔一个lineWidth。如图所示: