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>