Android实战简易教程-第六十三枪（动画实现唱片播放界面）
对于Android动画的使用，唱片播放是十分经典的一例，我们通过实现唱片播放效果来对Android动画进行学习，具有很高的趣味性和实用性。
1.首先我们定义一下布局文件-pan_layout.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/layout_pan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginTop="30dp"
android:gravity="center"
android:orientation="vertical" >
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/game_title" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="歌曲"
android:textColor="@color/white"
android:textSize="20sp" />
</FrameLayout>
<FrameLayout
android:layout_width="260dp"
android:layout_height="wrap_content" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="@drawable/game_disc" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="@drawable/game_disc_light" />
<ImageButton
android:id="@+id/btn_play_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/play_button_icon" />
<ImageView
android:id="@+id/imageView2"
android:layout_width="50sp"
android:layout_height="140sp"
android:layout_gravity="right"
android:src="@drawable/index_pin" /><!-- 拨杆 -->
</FrameLayout>
</LinearLayout>
这里我们广泛使用了FrameLayout布局，可以进行嵌套。
2.定义动画文件，这里我们共使用了三个动画问价
a.rotate.xml(中间盘片的旋转动画)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- 一次2400毫秒，重复3次 -->
<rotate
android:duration="2400"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="3"
android:toDegrees="359" />
</set>
b.rotate_45.xml(拨杆进入盘片动画):
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<rotate
android:duration="300"
android:fromDegrees="0"
android:pivotX="45%"
android:pivotY="10%"
android:repeatCount="0"
android:toDegrees="20" />
</set>
c.rotate_d_45.xml(拨杆离开盘片动画):
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<rotate
android:duration="300"
android:fromDegrees="20"
android:pivotX="45%"
android:pivotY="10%"
android:repeatCount="0"
android:toDegrees="0" />
</set>3.MainActivity.java:
package com.yayun.guessmusic.ui;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.view.animation.LinearInterpolator;
import android.widget.ImageButton;
import android.widget.ImageView;
import com.yayun.guessmusic.R;
public class MainActivity extends Activity {
// 唱片相关动画
private Animation mPanAnim;
private LinearInterpolator mPanLin;//动画匀速播放
private Animation mBarInAnim;
private LinearInterpolator mBarInLin;//动画匀速播放
private Animation mBarOutAnim;
private LinearInterpolator mBarOutLin;//动画匀速播放
// 唱片控件
private ImageView mViewPan;
// 拨杆控件
private ImageView mViewPanBar;
// Play 按键事件
private ImageButton mBtnPlayStart;
// 当前动画是否正在运行
private boolean mIsRunning = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mBtnPlayStart = (ImageButton)findViewById(R.id.btn_play_start);
mBtnPlayStart.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View arg0) {
handlePlayButton();
}
});
mViewPanBar = (ImageView)findViewById(R.id.imageView2);
mPanLin = new LinearInterpolator();
mPanAnim.setInterpolator(mPanLin);
mPanAnim.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
// 拨杆开始动画
mViewPanBar.startAnimation(mBarOutAnim);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
mBarInAnim = AnimationUtils.loadAnimation(this, R.anim.rotate_45);
mBarInLin = new LinearInterpolator();
mBarInAnim.setFillAfter(true);
mBarInAnim.setInterpolator(mBarInLin);
mBarInAnim.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
// 唱片动画
mViewPan.startAnimation(mPanAnim);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
mBarOutAnim = AnimationUtils.loadAnimation(this, R.anim.rotate_d_45);
mBarOutLin = new LinearInterpolator();
mBarOutAnim.setFillAfter(true);
mBarOutAnim.setInterpolator(mBarOutLin);
mBarOutAnim.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
// 整套动画播放完毕
mIsRunning = false;
mBtnPlayStart.setVisibility(View.VISIBLE);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
}
/**
* 处理圆盘中间的播放按钮，就是开始播放音乐
*/
private void handlePlayButton() {
if (mViewPanBar != null) {
if (!mIsRunning) {
mIsRunning = true;
// 拨杆进入动画，开始按钮不可见
mViewPanBar.startAnimation(mBarInAnim);
mBtnPlayStart.setVisibility(View.INVISIBLE);
}
}
}
@Override
public void onPause() {
mViewPan.clearAnimation();
super.onPause();
}
}
运行实例：
源码下载
喜欢的朋友关注我！谢谢