码迷,mamicode.com
首页 > 移动开发 > 详细

Android实战简易教程-第六十三枪(动画实现唱片播放界面)

时间:2015-10-08 11:47:28      阅读:210      评论:0      收藏:0      [点我收藏+]

标签: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();
    }
	
}



运行实例:

技术分享

源码下载

喜欢的朋友关注我!谢谢



版权声明:本文为博主原创文章,未经博主允许不得转载。

Android实战简易教程-第六十三枪(动画实现唱片播放界面)

标签:android   动画   唱片播放   

原文地址:http://blog.csdn.net/yayun0516/article/details/48969401

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!