第六十三枪(动画实现唱片播放界面)

对于Android动画的使用,唱片播放是十分经典的一例,我们通过实现唱片播放效果来对Android动画进行学习,具有很高的趣味性和实用性。

1.首先我们定义一下布局文件-pan_layout.xml:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns: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" ><FrameLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content" ><ImageViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@drawable/game_title" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:text="歌曲"android:textColor="@color/white"android:textSize="20sp" /></FrameLayout><FrameLayoutandroid:layout_width="260dp"android:layout_height="wrap_content" ><ImageViewandroid:id="@+id/imageView1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:src="@drawable/game_disc" /><ImageViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:src="@drawable/game_disc_light" /><ImageButtonandroid: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" /><ImageViewandroid: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="" ><!– 一次2400毫秒,重复3次 –><rotateandroid: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="" ><rotateandroid: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="" ><rotateandroid: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;@Overrideprotected 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() {@Overridepublic void onClick(View arg0) {handlePlayButton();}});mViewPanBar = (ImageView)findViewById(R.id.imageView2);mPanLin = new LinearInterpolator();mPanAnim.setInterpolator(mPanLin);mPanAnim.setAnimationListener(new AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {}@Overridepublic void onAnimationEnd(Animation animation) {// 拨杆开始动画mViewPanBar.startAnimation(mBarOutAnim);}@Overridepublic 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() {@Overridepublic void onAnimationStart(Animation animation) {}@Overridepublic void onAnimationEnd(Animation animation) {// 唱片动画mViewPan.startAnimation(mPanAnim);}@Overridepublic 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() {@Overridepublic void onAnimationStart(Animation animation) {}@Overridepublic void onAnimationEnd(Animation animation) {// 整套动画播放完毕mIsRunning = false;mBtnPlayStart.setVisibility(View.VISIBLE);}@Overridepublic void onAnimationRepeat(Animation animation) {}});}/*** 处理圆盘中间的播放按钮,就是开始播放音乐*/private void handlePlayButton() {if (mViewPanBar != null) {if (!mIsRunning) {mIsRunning = true;// 拨杆进入动画,开始按钮不可见mViewPanBar.startAnimation(mBarInAnim);mBtnPlayStart.setVisibility(View.INVISIBLE);}}}@Overridepublic void onPause() {mViewPan.clearAnimation();super.onPause();}}

运行实例:人生有一半掌握在上帝那里,另一半攥在自己的手中。

第六十三枪(动画实现唱片播放界面)

相关文章:

你感兴趣的文章:

标签云: