效果:
播放、暂停、进度条、循环播放
attrs.xml:
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="GramophoneView"> <attr name="picture_radiu" format="dimension"/>//中间图片的半径 <attr name="src" format="reference"/>//图片 <attr name="disk_rotate_speed" format="float"/>//唱片旋转的速度 </declare-styleable> </resources>GramophoneView:
public class GramophoneView extends View { private final float DEFUALT_DISK_ROTATE_SPEED = 1f; //磁盘旋转的速度 private final float DEFUALT_PICTURE_RAUID = 200; //中间图片默认半径 private final float DEFUALT_PAUSE_NEEDLE_DEGREE = -45; //暂停状态时唱针的旋转角度 private final float DEFUALT_PLAYING_NEEDLE_DEGREE = -15; //播放状态时唱针的旋转角度 private int pictrueRadio; //中间图片的半径 //指针 private int smallCircleRadiu = 10; //唱针顶部小圆半径,减小了一半 private int bigCircleRadiu = 15; //唱针顶部大圆半径,减小了一半 private int shortArmLength; private int longArmleLength; // 唱针手臂,较长那段的长度 private int shortHeadLength; // 唱针的头,较短那段的长度 private int longHeadLength; private Paint needlePaint; //唱片 private float halfMeasureWidth; private int diskRingWidth; // 黑色圆环宽度 private float diskRotateSpeed; // 唱片旋转速度 private Bitmap pictureBitmap; private Paint diskPaint; //状态控制 private boolean isPlaying; private float currentDiskDegree; // 唱片旋转角度 private float currentNeddleDegree = DEFUALT_PLAYING_NEEDLE_DEGREE; public GramophoneView(Context context) { super(context, null); } public GramophoneView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); needlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);//抗锯齿 diskPaint = new Paint(Paint.ANTI_ALIAS_FLAG); TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.GramophoneView); //拿到xml中的图片和图片半径和,旋转的度数 pictrueRadio = (int) typedArray.getDimension(R.styleable.GramophoneView_picture_radiu, DEFUALT_PICTURE_RAUID); diskRotateSpeed = typedArray.getFloat(R.styleable.GramophoneView_disk_rotate_speed, DEFUALT_DISK_ROTATE_SPEED); Drawable drawable = typedArray.getDrawable(R.styleable.GramophoneView_src); if (drawable == null) { pictureBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_launcher); } else { pictureBitmap = ((BitmapDrawable)drawable).getBitmap(); } //初始化唱片的变量 diskRingWidth = pictrueRadio >> 1; //图片半径和黑色圆环的和 等于 指针的总长度 shortHeadLength = (pictrueRadio + diskRingWidth) / 15; longHeadLength = shortHeadLength << 1; //左移相当于乘以2 shortArmLength = longHeadLength << 1; longArmleLength = shortArmLength << 1; } public GramophoneView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); int width = (pictrueRadio+diskRingWidth)*2; int hight = (pictrueRadio+diskRingWidth)*2+longArmleLength; //根据我们理想的宽和高 和xml中设置的宽高,按resolveSize规则做最后的取舍 //resolveSize规则 1、精确模式,按 int measurewidth = resolveSize(width,widthMeasureSpec); int measurehight = resolveSize(hight,heightMeasureSpec); setMeasuredDimension(measurewidth,measurehight);//设置测量的长度 } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); halfMeasureWidth = getMeasuredWidth() >> 1; drawDisk(canvas); //画唱片 drawNeedle(canvas);//画指针 if (currentNeddleDegree > DEFUALT_PAUSE_NEEDLE_DEGREE) { invalidate(); } } private void drawNeedle(Canvas canvas) { canvas.save();//保存 //移动坐标原点,画指针第一段 canvas.translate(halfMeasureWidth, 0); canvas.rotate(currentNeddleDegree); needlePaint.setColor(Color.parseColor("#C0C0C0")); needlePaint.setStrokeWidth(10); canvas.drawLine(0, 0, 0, longArmleLength, needlePaint); //画指针第二段 canvas.translate(0, longArmleLength); canvas.rotate(-30);// needlePaint.setStrokeWidth(10); canvas.drawLine(0, 0, 0, shortArmLength, needlePaint); //画指针第三段 canvas.translate(0, shortArmLength); needlePaint.setStrokeWidth(15); canvas.drawLine(0, 0, 0, longHeadLength, needlePaint); //画指针的第四段 canvas.translate(0, longHeadLength); needlePaint.setStrokeWidth(25); canvas.drawLine(0, 0, 0, shortHeadLength, needlePaint); canvas.restore(); //画指针的支点 canvas.save(); canvas.translate(halfMeasureWidth, 0); needlePaint.setColor(Color.parseColor("#8A8A8A")); needlePaint.setStyle(Paint.Style.FILL); canvas.drawCircle(0, 0, bigCircleRadiu, needlePaint); needlePaint.setColor(Color.parseColor("#C0C0C0")); canvas.drawCircle(0, 0, smallCircleRadiu, needlePaint); canvas.restore(); if (isPlaying) { if (currentNeddleDegree < DEFUALT_PLAYING_NEEDLE_DEGREE) { currentNeddleDegree += 3; } } else { if (currentNeddleDegree > DEFUALT_PAUSE_NEEDLE_DEGREE) { currentNeddleDegree -= 3; } } } private void drawDisk(Canvas canvas) { currentDiskDegree = currentDiskDegree % 360 + diskRotateSpeed; canvas.save(); canvas.translate(halfMeasureWidth, longArmleLength + diskRingWidth + pictrueRadio); canvas.rotate(currentDiskDegree); diskPaint.setColor(Color.BLACK); diskPaint.setStyle(Paint.Style.STROKE); diskPaint.setStrokeWidth(pictrueRadio / 2); //diskPaint.setStrokeWidth(20); canvas.drawCircle(0, 0, pictrueRadio + diskRingWidth / 2, diskPaint); Path path = new Path(); path.addCircle(0, 0, pictrueRadio, Path.Direction.CW); canvas.clipPath(path); Rect src = new Rect(); src.set(0, 0, pictureBitmap.getWidth(), pictureBitmap.getHeight()); Rect dst = new Rect(); dst.set(-pictrueRadio, -pictrueRadio, pictrueRadio, pictrueRadio); canvas.drawBitmap(pictureBitmap, src, dst, null); canvas.restore(); } public void pauseOrstart(){ isPlaying =!isPlaying; invalidate(); } /** * 设置图片半径 */ public void setPictureRadius(int pictureRadius) { this.pictrueRadio = pictureRadius; } /** * 设置唱片旋转速度 */ public void setDiskRotateSpeed(float diskRotateSpeed) { this.diskRotateSpeed = diskRotateSpeed; } /** * 设置图片资源id */ public void setPictureRes(int resId) { pictureBitmap = BitmapFactory.decodeResource(getContext().getResources(), resId); invalidate(); } }
MainActivity:
public class MainActivity extends BaseActivity<MainPresenter> implements IMainView, View.OnClickListener { private GramophoneView gramophone; private SeekBar seek_bar; private Button btn_play; private Button btn_dan; private boolean flag=false; private boolean isOne=true; private MediaPlayer player; private Handler handler=new Handler(){ @Override public void handleMessage(Message msg) { super.handleMessage(msg); switch (msg.what){ case 0: seek_bar.setProgress(getMusicCurrentPosition()); handler.sendEmptyMessageDelayed(0,500); break; case 1: //设置按钮状态 btn_play.setBackgroundResource(R.drawable.play); //停止同步进度条与音乐进度 handler.removeMessages(0); //控制圆盘停止 gramophone.pauseOrstart(); //初始化进度条 seek_bar.setProgress(0); //初始为重新播放 isOne=true; break; } } }; @Override void initView() { gramophone = findViewById(R.id.gramophone); seek_bar = findViewById(R.id.seek_bar); btn_play = findViewById(R.id.btn_play); btn_dan = findViewById(R.id.btn_dan); btn_play.setOnClickListener(this); btn_dan.setOnClickListener(this); } @Override void initData() { player = new MediaPlayer(); } @Override public void onClick(View v) { switch (v.getId()){ case R.id.btn_play: if (isOne){ try { //重置资源 ***** player.reset(); //加载音乐资源3:加载assets目录下的音乐资源 AssetFileDescriptor openFd = getAssets().openFd("aaa.mp3"); player.setDataSource(openFd.getFileDescriptor(), openFd.getStartOffset(), openFd.getLength()); //3.准备 player.prepareAsync();//异步的准备 //4.播放 //准备完成的监听 player.setOnPreparedListener(new MediaPlayer.OnPreparedListener() { @Override public void onPrepared(MediaPlayer mp) { player.start();//开始播放 //设置按钮状态 btn_play.setBackgroundResource(R.drawable.pause); //控制圆盘转动 gramophone.pauseOrstart(); //设置最大进度为音乐长度 seek_bar.setMax(getMusicDuration()); //设置拖动进度条监听,播放结束监听 setProgressListener(); //同步进度条与音乐进度 handler.sendEmptyMessage(0); } }); } catch (Exception e) { e.printStackTrace(); } isOne=false; }else { if (flag) {//处于暂停状态 player.start();//继续播放 //设置按钮状态 btn_play.setBackgroundResource(R.drawable.pause); //同步进度条与音乐进度 handler.sendEmptyMessage(0); //控制圆盘转动 gramophone.pauseOrstart(); //更改状态值 flag=false; } else { if (player!=null&&player.isPlaying()) { player.pause();//暂停播放 //设置按钮状态 btn_play.setBackgroundResource(R.drawable.play); //停止同步进度条与音乐进度 handler.removeMessages(0); //控制圆盘停止 gramophone.pauseOrstart(); //更改状态值 flag=true; } } } break; case R.id.btn_dan: if (player != null&&player.isPlaying()) { //设置是否单曲循环播放 player.setLooping(!player.isLooping()); if (player.isLooping()){ Toast.makeText(this, "开始单曲循环", Toast.LENGTH_SHORT).show(); }else { Toast.makeText(this, "关闭单曲循环", Toast.LENGTH_SHORT).show(); } Log.e("myMessage", "handleMessage: "+player.isLooping()); } break; } } private void setProgressListener() { seek_bar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() { @Override public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { if (fromUser){ //设置播放进度 seekTo(progress); } } @Override public void onStartTrackingTouch(SeekBar seekBar) { } @Override public void onStopTrackingTouch(SeekBar seekBar) { } }); player.setOnCompletionListener(new MediaPlayer.OnCompletionListener() { @Override public void onCompletion(MediaPlayer mp) { if (!player.isLooping()){ handler.sendEmptyMessage(1); } } }); } //获取歌曲长度 public int getMusicDuration() { int rtn = 0; if (player != null) { rtn = player.getDuration(); } return rtn; } //获取当前播放进度 public int getMusicCurrentPosition() { int rtn = 0; if (player != null) { rtn = player.getCurrentPosition(); } return rtn; } public void seekTo(int position) { if (player != null) { player.seekTo(position); } } @Override public void onSuccess(Object o) { } @Override MainPresenter initPresenter() { return new MainPresenter(); } @Override int setChildContentView() { return R.layout.activity_main; } @Override protected void onDestroy() { super.onDestroy(); if (player!=null) { player.release();//释放音乐资源 player=null; } getPresenter().detachView(); } }activity_main.xml:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:background="@drawable/bei" tools:context=".view.activity.MainActivity"> <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="3" android:gravity="center_horizontal"> <com.example.kaoshi.view.customview.GramophoneView android:id="@+id/gramophone" app:src="@drawable/n" app:picture_radiu="150dp" app:disk_rotate_speed="1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:orientation="vertical"> <SeekBar android:id="@+id/seek_bar" android:layout_width="match_parent" android:max="100" android:layout_height="wrap_content" /> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" android:gravity="center"> <Button android:id="@+id/btn_pre" android:layout_width="50dp" android:layout_height="50dp" android:background="@drawable/pre"/> <Button android:id="@+id/btn_play" android:layout_width="50dp" android:layout_height="50dp" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:background="@drawable/play" /> <Button android:id="@+id/btn_next" android:layout_width="50dp" android:layout_height="50dp" android:background="@drawable/next" /> <Button android:id="@+id/btn_dan" android:layout_width="wrap_content" android:layout_height="50dp" android:text="单曲循环" /> </LinearLayout> </LinearLayout> </LinearLayout>