对于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>
- 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();
- }
- }
运行实例:
喜欢的朋友关注我!谢谢