Android動畫——佈局聯動

業務情景：界面的某一部分佈局在可控的情況下實現伸縮效果，同時與此佈局相關聯的佈局隨着伸縮的進行而運動。

知識準備：

1）一個添加伸縮動畫的控件的大小不隨伸縮動畫的進行而改變，改變的只是顯示效果，其他控件的位置不會隨該控件的顯示效果的改變而改變，因爲它的大小都沒變，該規則同樣適用於佈局（如：RelativeLayout）

2）一個添加平移動畫的控件的位置不隨平移動畫的進行而改變，改變的只是顯示效果，其他控件的位置不會隨該控件的顯示效果的改變而改變，因爲它的位置都沒變，該規則同樣適用於佈局（如：RelativeLayout）

實現方案：

1）當上面的控件開始收縮動畫時，下面的控件開始向上移動的動畫，直到頂部與上面的控件的頂部對齊。

2）當上面的控件開始伸展動畫時，下面的控件開始向下移動的動畫，直到頂部與上面的控件的底部對齊。

代碼：

MainActivity.java

package com.example.testanoication;

import com.example.testanoication.zoom.VerticalZoom;

import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.app.Activity;

public class MainActivity extends Activity {
	
	public boolean isShow = true;
	
	private RelativeLayout layout = null;
	private ImageView button = null;
	
	private VerticalZoom zoom = null;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        layout = (RelativeLayout)findViewById(R.id.relativelayout);
        button = (ImageView)findViewById(R.id.button);
        
        zoom = new VerticalZoom(layout, button);
    }
    
	public void onButton(View v)
    {
    	if(isShow)
    	{
    		isShow = false;
    		
    		zoom.shrinkUpView();
    	}
    	else
    	{
    		isShow = true;
    		
    		zoom.extendUpView();
    	}
    }
	
}

Vertical.java

/**
 *@PROJECT:TestAnoication
 *@PACKAGE：com.example.testanoication.zoom
 *@FILE:Vertical.java
 *@TIME:2013-9-14 上午8:44:10
 *@AUTHOR:
 *@TODO:
 */
package com.example.testanoication.zoom;

import android.annotation.SuppressLint;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.view.animation.Animation.AnimationListener;
import android.widget.RelativeLayout;
import android.widget.RelativeLayout.LayoutParams;

@SuppressLint("NewApi")
public class VerticalZoom {

	private View _upview = null;
	private View _downview = null;
	
	private boolean _isupviewshow = true;
	private int _upviewheight = 0;
	
	public VerticalZoom(View upview, View downview)
	{
		_upview = upview;
		_downview = downview;
	}
	
	/**
	 * 收縮上視圖
	 * */
	public void shrinkUpView()
	{
		initUpViewHeight();
		
		if(_isupviewshow)
		{
			_isupviewshow = false;
			
			ScaleAnimation sanimation = new ScaleAnimation(1.0f, 1.0f, 1.0f, 0.0f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.0f);
    		sanimation.setDuration(500);
    		sanimation.setFillAfter(true);
    		
    		TranslateAnimation tanimation = new TranslateAnimation(_downview.getX(),  _downview.getX(), 0.0f, -_upviewheight);
    		tanimation.setDuration(500);
    		tanimation.setFillAfter(true);
    		tanimation.setAnimationListener(new DownViewListener());
    		
    		_upview.startAnimation(sanimation);
    		_downview.startAnimation(tanimation);
		}
	}
	
	/**
	 * 展開上視圖
	 * */
	public void extendUpView()
	{
		initUpViewHeight();
		
		if(!_isupviewshow)
		{
			_isupviewshow = true;
			
			ScaleAnimation sanimation = new ScaleAnimation(1.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.0f);
    		sanimation.setDuration(500);
    		sanimation.setFillAfter(true);
    		
    		TranslateAnimation tanimation = new TranslateAnimation(_downview.getX(), _downview.getX(), 0.0f, _upviewheight);
    		tanimation.setDuration(500);
    		tanimation.setFillAfter(true);
    		tanimation.setAnimationListener(new DownViewListener());
    		
    		_upview.startAnimation(sanimation);
    		_downview.startAnimation(tanimation);
		}
	}
	
	private void initUpViewHeight()
	{
		if(_upviewheight == 0)
		{
			_upviewheight = _upview.getHeight();
		}
	}
	
	private class DownViewListener implements AnimationListener
	{
		public void onAnimationEnd(Animation animation) {
			LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT,_downview.getHeight());
			if(_isupviewshow)
			{
				params.addRule(RelativeLayout.BELOW, _upview.getId());
			}
			else 
			{
				params.addRule(RelativeLayout.ALIGN_TOP, _upview.getId());
			}
			_downview.setLayoutParams(params);
			_upview.clearAnimation();
			_downview.clearAnimation();
		}

		public void onAnimationRepeat(Animation animation) {
		}

		public void onAnimationStart(Animation animation) {
		}
	}
	
}

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    
    <RelativeLayout 
        android:id="@+id/relativelayout"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_alignParentTop="true">
        
        <ImageView 
            android:id="@+id/image"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:layout_alignParentTop="true"
            android:src="@drawable/kedugen"/>
        
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:layout_below="@id/image"
            android:text="@string/hello_world"
            android:textSize="16sp"
            android:textColor="#3d3e40"
            android:gravity="center"/>
    </RelativeLayout>

    <ImageView
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/relativelayout"
        android:src="@drawable/kedugen"
        android:onClick="onButton" />
</RelativeLayout>