欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android绘制音乐播放器示波器

程序员文章站 2024-03-04 10:20:35
示波器是在大学的时候老师教的,但是出来工作一直没有用到过,渐渐的也就忘记了,现在重新学习一下。来看看效果图: 这里是一个自定义的柱状图,然后有一个按钮,点击按钮的时候...

示波器是在大学的时候老师教的,但是出来工作一直没有用到过,渐渐的也就忘记了,现在重新学习一下。来看看效果图:

Android绘制音乐播放器示波器

这里是一个自定义的柱状图,然后有一个按钮,点击按钮的时候,这里柱子会不停的运动,类似于音乐播放器里示波器的跳动。

跟前面几个自定义view的方式类似,重写了onsizechange()方法ondraw()方法
先列一下我们要用到的变量:

 /**画笔*/
 private paint mpaint;
 /**控件的宽度*/
 private float mwidth;
 /**单个柱子的宽度*/
 private float mrectwidth;
 /**单个柱子的高度*/
 private float mrectheight;
 /**柱子的总个数*/
 private float mrectcount = 10;
 /**柱子之间的间隔*/
 private int offsets = 2;
 /**android中的线性渐变*/
 private lineargradient mlineargradient;
 /**随机的柱子的高度*/
 private double mrandom;

所有的变量都在这里了

下面给画笔初始化

 /**
  * 初始化画笔
  */
 private void initview() {
  mpaint = new paint();
  mpaint.setantialias(true);
 }

然后在onsizechange()里面给变量赋值

 @override
 protected void onsizechanged(int w, int h, int oldw, int oldh) {
  super.onsizechanged(w, h, oldw, oldh);
  mwidth = getwidth();
  mrectheight = getheight();
  mrectwidth = (int) (mwidth * 0.6 / mrectcount);
  mlineargradient = new lineargradient(0, 0, mrectwidth, mrectheight,
    color.yellow, color.blue, shader.tilemode.clamp);
  mpaint.setshader(mlineargradient);

 }

最后绘制柱状图

 @override
 protected void ondraw(canvas canvas) {
  super.ondraw(canvas);
  for (int i = 0; i < mrectcount; i++) {
   mrandom = math.random();
   float currentheight = (float) (mrectheight * mrandom);
   canvas.drawrect(
     (float) (mwidth * 0.4 / 2 + mrectwidth * i + offsets),
     currentheight, (float) (mwidth * 0.4 / 2 + mrectwidth
       * (i + 1)), mrectheight, mpaint);
  }

 }

这个时候,一个音乐播放器的示波器已经完成了,但是,这个是静态的,接下来,向外面暴露一个方法,用于刷新view,实现动态的效果。

    public void onstart() {
        postinvalidatedelayed(300);
    }

每间隔300ms对view进行重绘,就可以有一个比较好的视觉效果了。

好了,最后我贴上全部的代码:

public class musicline extends view {
 private paint mpaint;
 private float mwidth;
 private float mrectwidth;
 private float mrectheight;
 private float mrectcount = 10;
 private int offsets = 2;
 private lineargradient mlineargradient;
 private double mrandom;

 public musicline(context context, attributeset attrs, int defstyle) {
  super(context, attrs, defstyle);

  initview();
 }

 public musicline(context context, attributeset attrs) {
  super(context, attrs);
  initview();
 }

 public musicline(context context) {
  super(context);
  initview();
 }

 /**
  * 初始化工具类
  */
 private void initview() {
  mpaint = new paint();
  mpaint.setantialias(true);
 }

 @override
 protected void onsizechanged(int w, int h, int oldw, int oldh) {
  super.onsizechanged(w, h, oldw, oldh);
  mwidth = getwidth();
  mrectheight = getheight();
  mrectwidth = (int) (mwidth * 0.6 / mrectcount);
  mlineargradient = new lineargradient(0, 0, mrectwidth, mrectheight,
    color.yellow, color.blue, shader.tilemode.clamp);
  mpaint.setshader(mlineargradient);

 }

 @override
 protected void ondraw(canvas canvas) {
  super.ondraw(canvas);
  for (int i = 0; i < mrectcount; i++) {
   mrandom = math.random();
   float currentheight = (float) (mrectheight * mrandom);
   canvas.drawrect(
     (float) (mwidth * 0.4 / 2 + mrectwidth * i + offsets),
     currentheight, (float) (mwidth * 0.4 / 2 + mrectwidth
       * (i + 1)), mrectheight, mpaint);
  }

 }

 public void onstart() {
  postinvalidatedelayed(300);
 }

}

至此,全部完成了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。