android实现音乐波动条形图
16lz
2022-04-26
android实现音乐波动条形图
我们经常听音乐的时候都会有一些柱状图波动，今天我就在android里面来实现这个效果。先看效果图：
分析：
这里我将通过自定义view来实现这个效果，我们将重写View里面的两个重要的方法：onMeasure，onDraw。第一个方法是测量，第二个是绘制。因为我们的控件要适配屏幕，所以我们不能把大小写死了，所以要在
onMeasure里面动态设置大小。 Java
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//拿到控件的宽高度,并动态计算柱子的宽度
height = View.MeasureSpec.getSize(heightMeasureSpec);
width = View.MeasureSpec.getSize(widthMeasureSpec);
// Log.i("dandy",""+height+" "+width);
rect_w= (float) (width*0.9/6);//柱子的宽度，因为是6条柱子。*0.9是为了留有空隙，美观一点
random= (int) (height/5);//动态变换的高度比例
}
既然我们测量好了，就开始绘制吧，首先我们可以想象一下所以的条形图都是一样长的，想要他动起来，就得动态改变它的top值并且每隔一段时间刷新，这样就形成了波动效果。既然关键方法分析完了，那就直接上原代码。
public class MyView extends View {private float width;//控件宽度private float height;//空间高度private float rect_w;//柱状图的宽度private int rect_t1,rect_t2,rect_t3,rect_t4,rect_t5;private int random;//动态变换的高度比例private boolean status=true;//控件的状态private Handler handler=new Handler(){ public void handleMessage(android.os.Message msg) { if(msg.what==0x1233){ MyView.this.invalidate();//重绘更新view } };};public MyView(Context context) { super(context);}public MyView(Context context, AttributeSet attrs) { super(context, attrs);}/**这里是为了实现点击一下控件就停止 * 控制控件是否跳动 true为跳动，false为停止 * @param b */public void change_Status(boolean b){ status=b;}/**这里是为了实现点击一下控件就停止 * 拿到控件的状态 * @return */public boolean get_Status(){ // Log.i("smile","状态改变了吗？"); return status;}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); //拿到控件的宽高度,并动态计算柱子的宽度 height = View.MeasureSpec.getSize(heightMeasureSpec); width = View.MeasureSpec.getSize(widthMeasureSpec); // Log.i("dandy",""+height+" "+width); rect_w= (float) (width*0.9/6); random= (int) (height/5);}@Overrideprotected void onDraw(Canvas canvas) { if(status==true){ // 定义一个定时器 ，让画图每个0.5秒执行一次 new Timer().schedule(new TimerTask() { @Override public void run() { rect_t1=new Random().nextInt(random); rect_t2=new Random().nextInt(random); rect_t3=new Random().nextInt(random); rect_t4=new Random().nextInt(random); rect_t5=new Random().nextInt(random); // TODO Auto-generated method stub handler.sendEmptyMessage(0x1233); } }, 300); } else get_Status(); super.onDraw(canvas); Paint paint=new Paint(); paint.setColor(Color.YELLOW); paint.setStyle(Paint.Style.STROKE); paint.setColor(Color.BLACK); canvas.drawLine((float) (width*0.1), (float) (height*0.9), (float) (width*0.9), (float) (height*0.9), paint); //画柱状；动态图，就要改变柱状的top值 RectF r1=new RectF((float) (width*0.1),rect_t1*5,(float)( width*0.1+rect_w),(float) (height*0.9)); RectF r2=new RectF((float) (width*0.1+rect_w),rect_t2*5,(float)( width*0.1+rect_w*2),(float) (height*0.9)); RectF r3=new RectF((float) (width*0.1+rect_w*2),rect_t3*5,(float)( width*0.1+rect_w*3),(float) (height*0.9)); RectF r4=new RectF((float) (width*0.1+rect_w*3),rect_t4*5,(float)( width*0.1+rect_w*4),(float) (height*0.9)); RectF r5=new RectF((float) (width*0.1+rect_w*4),rect_t5*5,(float)( width*0.1+rect_w*5),(float) (height*0.9)); Paint paint1=new Paint(); paint1.setColor(Color.YELLOW); paint1.setStyle(Paint.Style.FILL); paint1.setAntiAlias(true); canvas.drawRect(r1,paint1); canvas.drawRect(r2,paint1); canvas.drawRect(r3,paint1); canvas.drawRect(r4,paint1); canvas.drawRect(r5,paint1);}}最后直接在布局文件里面用这个View就行了。
更多相关文章
- Chronometer android计时器组件Chronometer的使用，android通话时
- Android上实现柱状图表 可实现边框矩形 没填充色
- Android的几种布局方式
- Android开发 第五课 Android的几种布局方式
- Android之布局属性重点
- Android的GridView控件点击图片变暗效果
- Android之打开和关闭软键盘
- android 图片圆角 遮罩_安卓圆角、背景遮罩。覆盖实现方式（适用于
- 源码解析Android中View的measure量算过程