做一个音乐类APP的过程中,遇到一个实现类似网易云音乐转盘转动的界面,作为一款比较喜欢的音乐播放器,自然兴趣十足,希望可以学到一分吧。
主要用ObjectAnimator实现,代码量也很少,下面直接贴出来吧
先贴出效果图吧
MainActivity
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
private ImageView disc,needle,playingPre,playingPlay,playingNext;
private ObjectAnimator discAnimation,needleAnimation;
private boolean isPlaying = true;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initViews();
setAnimations();
}
private void initViews() {
playingPre = (ImageView) findViewById(R.id.playing_pre);
playingPlay = (ImageView) findViewById(R.id.playing_play);
playingNext = (ImageView) findViewById(R.id.playing_next);
disc = (ImageView) findViewById(R.id.disc);
needle = (ImageView) findViewById(R.id.needle);
playingPre.setOnClickListener(this);
playingPlay.setOnClickListener(this);
playingNext.setOnClickListener(this);
}
//动画设置
private void setAnimations() {
discAnimation = ObjectAnimator.ofFloat(disc, "rotation", 0, 360);
discAnimation.setDuration(20000);
discAnimation.setInterpolator(new LinearInterpolator());
discAnimation.setRepeatCount(ValueAnimator.INFINITE);
needleAnimation = ObjectAnimator.ofFloat(needle, "rotation", 0, 25);
needle.setPivotX(0);
needle.setPivotY(0);
needleAnimation.setDuration(800);
needleAnimation.setInterpolator(new LinearInterpolator());
}
@Override
public void onClick(View v) {
int id = v.getId();
switch (id) {
//前一曲
case R.id.playing_pre:
if (discAnimation != null) {
discAnimation.end();
playing();
}
break;
//播放中
case R.id.playing_play:
if (isPlaying){
playing();
}else {
if (needleAnimation != null) {
needleAnimation.reverse();
needleAnimation.end();
}
if (discAnimation != null && discAnimation.isRunning()) {
discAnimation.cancel();
float valueAvatar = (float) discAnimation.getAnimatedValue();
discAnimation.setFloatValues(valueAvatar, 360f + valueAvatar);
}
playingPlay.setImageResource(R.drawable.play_btn_play);
isPlaying = true;
}
break;
//下一曲
case R.id.playing_next:
if (discAnimation != null) {
discAnimation.end();
playing();
}
break;
default:
break;
}
}
//播放时动画设置和图片切换
private void playing(){
needleAnimation.start();
discAnimation.start();
playingPlay.setImageResource(R.drawable.play_btn_pause);
isPlaying = false;
}
}
xml文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/music_play_background"
tools:context="com.peng.cp.easemusicdiscexample.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<ImageView
android:id="@+id/playing_pre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/play_btn_prev" />
<ImageView
android:id="@+id/playing_play"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/play_btn_play" />
<ImageView
android:id="@+id/playing_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/play_btn_next" />
</LinearLayout>
<ImageView
android:id="@+id/disc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/play_album"
android:layout_marginTop="50dp"
android:layout_centerHorizontal="true" />
<ImageView
android:id="@+id/needle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/play_needle"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
当然源码我也上传了,用Android Studio2.2编译的
这里是地址:http://download.youkuaiyun.com/detail/u011710991/9644212
最后欢迎大家指正。