前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >笔记73 | 实现音乐转盘的旋转和暂停效果

笔记73 | 实现音乐转盘的旋转和暂停效果

作者头像
项勇
发布2018-06-19 16:32:45
1.5K0
发布2018-06-19 16:32:45
举报
文章被收录于专栏:项勇项勇

RotateAnimation实现转动动画:

代码语言:javascript
复制
package com.jikexueyuan.rotateanimation;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.RotateAnimation;

public class MainActivity extends Activity {


    private RotateAnimation ra;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ra = new RotateAnimation(
                0 //fromDegrees起始角度
                , 360 //toDegrees旋转角度
                , Animation.RELATIVE_TO_SELF, 0.5f,//pivotXType 旋转中心的X轴
                //RELATIVE_TO_SELF:相对自身
                Animation.RELATIVE_TO_SELF, 0.5f//pivotXValue 旋转中心的Y轴
                );
        ra.setDuration(1000);

        findViewById(R.id.btnRotateMe).setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View arg0) {
                arg0.startAnimation(ra);
            }
        });
    }
}

在ra.xml中实现动画:

代码语言:javascript
复制
package com.jikexueyuan.rotateanimation;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.AnimationUtils;
import android.view.animation.RotateAnimation;

public class MainActivity extends Activity {


    private RotateAnimation ra;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        findViewById(R.id.btnRotateMe).setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View arg0) {
                arg0.startAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.ra));
            }
        });
    }
}

ra.xml:

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:toDegrees="360"
    android:duration="1000"
    android:pivotX="50%"
    android:pivotY="50%" >

</rotate>

使用RotateAnimation实现旋转暂停

代码语言:javascript
复制
package com.even.Demo;

import android.animation.ObjectAnimator;
import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.animation.LinearInterpolator;
import android.view.animation.RotateAnimation;
import android.widget.ImageView;

public class rotateImageView_ro extends ImageView{

    public static final int STATE_PLAYING =1;//正在播放
    public static final int STATE_PAUSE =2;//暂停
    public static final int STATE_STOP =3;//停止
    public int state;

    private float angle;//记录RotateAnimation中受插值器数值影响的角度
    private float angle2;//主要用来记录暂停时停留的角度,即View初始旋转角度
    private int viewWidth;
    private int viewHeight;
    private MusicAnim musicAnim;

    public rotateImageView_ro(Context context) {
        super(context);
        init();
    }

    public rotateImageView_ro(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public rotateImageView_ro(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init(){
        state = STATE_STOP;
        angle = 0;
        angle2 = 0;
        viewWidth = 0;
        viewHeight = 0;
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        viewWidth = getMeasuredWidth();
        viewHeight = getMeasuredHeight();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.rotate(angle2,viewWidth/2,viewHeight/2);
        super.onDraw(canvas);
    }

    public class MusicAnim extends RotateAnimation{
        public MusicAnim(float fromDegrees, float toDegrees, float pivotX, float pivotY) {
            super(fromDegrees, toDegrees, pivotX, pivotY);
        }

        @Override
        protected void applyTransformation(float interpolatedTime, Transformation t) {
            super.applyTransformation(interpolatedTime, t);
            angle = interpolatedTime * 360;
        }
    }

    public void playMusic(){
        if(state == STATE_PLAYING){
            angle2 = (angle2 + angle)%360;//可以取余也可以不取,看实际的需求
            musicAnim.cancel();
            state = STATE_PAUSE;
            invalidate();
        }else {
            musicAnim = new MusicAnim(0,360,viewWidth/2,viewHeight/2);
            musicAnim.setDuration(3000);
            musicAnim.setInterpolator(new LinearInterpolator());//动画时间线性渐变
            musicAnim.setRepeatCount(ObjectAnimator.INFINITE);
            startAnimation(musicAnim);
            state = STATE_PLAYING;
        }
    }

    public void stopMusic(){
        angle2 = 0;
        clearAnimation();
        state = STATE_STOP;
        invalidate();
    }
}

使用ObjectAnimator实现旋转暂停:

代码语言:javascript
复制
public class rotateImageView_ob extends ImageView{

    ObjectAnimator rotateanimation;
    public static int PLAY = 1;
    public static int PAUSE = 2;
    public static int STOP = 3;


    public rotateImageView_ob(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init();
    }

    public rotateImageView_ob(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public rotateImageView_ob(Context context) {
        super(context);
        init();
    }

    public int statics = 0;
    private void init(){
        statics = PAUSE;
        rotateanimation = ObjectAnimator.ofFloat(this, "rotation", 0f , 360f);
        rotateanimation.setDuration(12000);
        rotateanimation.setInterpolator(new LinearInterpolator());
        rotateanimation.setRepeatCount(ObjectAnimator.INFINITE);
        rotateanimation.setRepeatMode(ObjectAnimator.RESTART);
    }

    public void Play(){
        if (statics == STOP) {
            rotateanimation.start();
            statics = PLAY;
        }else if(statics == PAUSE){
            rotateanimation.resume();
            statics = PLAY;
        }else if (statics == PLAY) {
            rotateanimation.pause();
            statics = PAUSE;
        }
    }

    public void stop(){
        rotateanimation.end();
        statics = STOP;
    }
}
本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2018-05-11,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 项勇 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • RotateAnimation实现转动动画:
  • 使用RotateAnimation实现旋转暂停
  • 使用ObjectAnimator实现旋转暂停:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档