AnimWelcome引导页面VS图片切换动画效果

LensFocusActivity

package com.example.animwelcome;

import android.app.Activity;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.Animation.AnimationListener;
import android.widget.ImageView;
import android.widget.TextView;


public class LensFocusActivity extends Activity{

	
	private ImageView imageView_pic;
	private TextView textView_desc ;
	
	/**
	 * 三个切换的动画
	 */
	private Animation mFadeIn;
	private Animation mFadeInScale;
	private Animation mFadeOut;
	
	/**
	 * 三个图片
	 */
	private Drawable mPicture_1;
	private Drawable mPicture_2;
	private Drawable mPicture_3;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_splash_lens_focus);
		initView();
		setListener();
	}

	public void initView() {
		imageView_pic = (ImageView) findViewById(R.id.imageView_pic);
		textView_desc = (TextView) findViewById(R.id.textView_desc);
		init();
	}

	private void init() {
		initAnim();
		initPicture();
		/**
		 * 界面刚开始显示的内容
		 */
		imageView_pic.setImageDrawable(mPicture_1);
		textView_desc.setText("儿时的我们...");
		// public void startAnimation(Animation animation)
		imageView_pic.startAnimation(mFadeIn);
	}

	
	
	/**
	 * 初始化动画
	 */
	private void initAnim() {
		mFadeIn = AnimationUtils.loadAnimation(this,R.anim.welcome_fade_in);
		mFadeIn.setDuration(1000);
		mFadeInScale = AnimationUtils.loadAnimation(this,R.anim.welcome_fade_in_scale);
		mFadeInScale.setDuration(6000);
		mFadeOut = AnimationUtils.loadAnimation(this,R.anim.welcome_fade_out);
		mFadeOut.setDuration(1000);
	}

	/**
	 * 初始化图片
	 */
	
	private void initPicture() {
		mPicture_1 = getResources().getDrawable(R.drawable.pic_01);
		mPicture_2 = getResources().getDrawable(R.drawable.pic_02);
		mPicture_3 = getResources().getDrawable(R.drawable.pic_03);
	}
	
	
    /**
	 * 监听事件
	 */
	public void setListener() {
		/**
		 * 动画切换原理:开始时是用第一个渐现动画,当第一个动画结束时开始第二个放大动画,当第二个动画结束时调用第三个渐隐动画,
		 * 第三个动画结束时修改显示的内容并且重新调用第一个动画,从而达到循环效果
		 */
		mFadeIn.setAnimationListener(new AnimationListener() {

			public void onAnimationStart(Animation animation) {

			}

			public void onAnimationRepeat(Animation animation) {

			}

			public void onAnimationEnd(Animation animation) {
				imageView_pic.startAnimation(mFadeInScale);
			}
		});
		mFadeInScale.setAnimationListener(new AnimationListener() {

			public void onAnimationStart(Animation animation) {

			}

			public void onAnimationRepeat(Animation animation) {

			}

			public void onAnimationEnd(Animation animation) {
				imageView_pic.startAnimation(mFadeOut);
			}
		});
		mFadeOut.setAnimationListener(new AnimationListener() {

			public void onAnimationStart(Animation animation) {

			}

			public void onAnimationRepeat(Animation animation) {

			}

			public void onAnimationEnd(Animation animation) {
				/**
				 * 这里其实有些写的不好,还可以采用更多的方式来判断当前显示的是第几个,从而修改数据,
				 * 我这里只是简单的采用获取当前显示的图片来进行判断。
				 */
				if (imageView_pic.getDrawable().equals(mPicture_1)) {
					textView_desc.setText("懵懂的我们...");
					imageView_pic.setImageDrawable(mPicture_2);
				} else if (imageView_pic.getDrawable().equals(mPicture_2)) {
					textView_desc.setText("少年的我们...");
					imageView_pic.setImageDrawable(mPicture_3);
				} else if (imageView_pic.getDrawable().equals(mPicture_3)) {
					textView_desc.setText("儿时的我们...");
					imageView_pic.setImageDrawable(mPicture_1);
				}
				imageView_pic.startAnimation(mFadeIn);
			}
		});
		
	}

}

activity_splash_lens_focus.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/imageView_pic"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:scaleType="fitXY" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:paddingTop="50dip"
            android:orientation="vertical">

            <TextView
                android:id="@+id/textView_desc"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="left"
                android:paddingLeft="10dip"
                android:layout_marginBottom="32.0dip"
                android:gravity="center"
                android:textColor="#FFFFFF"
                android:textSize="28.0sp"
                android:textStyle="bold" />
        </LinearLayout>
    </RelativeLayout>

</FrameLayout>

welcome_fade_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <alpha
        android:fromAlpha="0.0"
        android:toAlpha="1.0" />
</set>

welcome_fade_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <scale
        android:fillAfter="false"
        android:fromXScale="1.1"
        android:fromYScale="1.1"
        android:interpolator="@android:anim/decelerate_interpolator"
        android:pivotX="50.0%"
        android:pivotY="50.0%"
        android:toXScale="1.1"
        android:toYScale="1.1" />

    <alpha
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />

</set>

welcome_fade_in_scale.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <scale
        android:fillAfter="false"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:interpolator="@android:anim/decelerate_interpolator"
        android:pivotX="50.0%"
        android:pivotY="50.0%"
        android:toXScale="1.1"
        android:toYScale="1.1"/>

</set>

*************************************************图片切换动画效果************************************************

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" >

    <com.example.zhy_jazzyviewpager.MyJazzyViewPager
        android:id="@+id/id_viewPager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</RelativeLayout>

MainActivity

package com.example.zhy_jazzyviewpager;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;

public class MainActivity extends Activity {
	private int[] mImgIds;
	private MyJazzyViewPager mViewPager;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		mImgIds = new int[] { R.drawable.a, R.drawable.b, R.drawable.c,
				R.drawable.d };
		mViewPager = (MyJazzyViewPager) findViewById(R.id.id_viewPager);
		mViewPager.setAdapter(new PagerAdapter() {

			@Override
			public boolean isViewFromObject(View arg0, Object arg1) {
				return arg0 == arg1;
			}

			@Override
			public void destroyItem(ViewGroup container, int position,
					Object object) {
				container.removeView((View) object);
			}

			@Override
			public Object instantiateItem(ViewGroup container, int position) {
				ImageView imageView = new ImageView(MainActivity.this);
				imageView.setImageResource(mImgIds[position]);
				imageView.setScaleType(ScaleType.CENTER_CROP);
				container.addView(imageView);
				mViewPager.setObjectForPosition(imageView, position);
				return imageView;
			}

			@Override
			public int getCount() {
				return mImgIds.length;
			}
		});

	}

}

MyJazzyViewPager

package com.example.zhy_jazzyviewpager;

import java.util.HashMap;
import java.util.LinkedHashMap;

import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

import com.nineoldandroids.view.ViewHelper;

public class MyJazzyViewPager extends ViewPager {
	private float mTrans;
	private float mScale;
	/**
	 * 最大的缩小比例
	 */
	private static final float SCALE_MAX = 0.5f;
	/**
	 * 保存position与对于的View
	 */
	private HashMap<Integer, View> mChildrenViews = new LinkedHashMap<Integer, View>();
	private View mLeft;
	private View mRight;

	/************* 构造器 *****************/
	public MyJazzyViewPager(Context context, AttributeSet attrs) {
		super(context, attrs);
	}

	@Override
	public void onPageScrolled(int position, float positionOffset,
			int positionOffsetPixels) {

		// 获取左边的View
		mLeft = mChildrenViews.get(position);
		// 获取右边的View
		mRight = mChildrenViews.get(position+1);

		// 添加切换动画效果
		animateStack(mLeft, mRight, positionOffset, positionOffsetPixels);
		super.onPageScrolled(position, positionOffset, positionOffsetPixels);
	}

	public void setObjectForPosition(View view, int position) {
		mChildrenViews.put(position, view);
	}


	protected void animateStack(View left, View right, float effectOffset,
			int positionOffsetPixels) {
		if (right != null) {
			/**
			 * 缩小比例 如果手指从右到左的滑动(切换到后一个):0.0~1.0,即从一半到最大
			 * 如果手指从左到右的滑动(切换到前一个):1.0~0,即从最大到一半
			 */
			mScale = (1 - SCALE_MAX) * effectOffset + SCALE_MAX;
			/**
			 * x偏移量: 如果手指从右到左的滑动(切换到后一个):0-720 如果手指从左到右的滑动(切换到前一个):720-0
			 */
			mTrans = -getWidth() - getPageMargin() + positionOffsetPixels;
			ViewHelper.setScaleX(right, mScale);
			ViewHelper.setScaleY(right, mScale);
			ViewHelper.setTranslationX(right, mTrans);
		}
		if (left != null) {
			left.bringToFront();
		}
	}
}

*******************************************************谷歌方法*********************************************

mViewPager.setPageTransformer(true, new DepthPageTransformer());
mViewPager.setPageTransformer(true, new ZoomOutPageTransformer());


DepthPageTransformer

package com.zhy.view;

import android.annotation.SuppressLint;
import android.support.v4.view.ViewPager;
import android.view.View;

public class DepthPageTransformer implements ViewPager.PageTransformer {
	private static final float MIN_SCALE = 0.75f;

	@SuppressLint("NewApi")
	public void transformPage(View view, float position) {
		int pageWidth = view.getWidth();

		if (position < -1) { // [-Infinity,-1)
			// This page is way off-screen to the left.
			view.setAlpha(0);

		} else if (position <= 0) { // [-1,0]
			// Use the default slide transition when moving to the left page
			view.setAlpha(1);
			view.setTranslationX(0);
			view.setScaleX(1);
			view.setScaleY(1);

		} else if (position <= 1) { // (0,1]
			// Fade the page out.
			view.setAlpha(1 - position);

			// Counteract the default slide transition
			view.setTranslationX(pageWidth * -position);

			// Scale the page down (between MIN_SCALE and 1)
			float scaleFactor = MIN_SCALE + (1 - MIN_SCALE)
					* (1 - Math.abs(position));
			view.setScaleX(scaleFactor);
			view.setScaleY(scaleFactor);

		} else { // (1,+Infinity]
			// This page is way off-screen to the right.
			view.setAlpha(0);
		}
	}
}


ZoomOutPageTransformer

package com.zhy.view;  
  
import android.annotation.SuppressLint;  
import android.support.v4.view.ViewPager;  
import android.util.Log;  
import android.view.View;  
  
public class ZoomOutPageTransformer implements ViewPager.PageTransformer  
{  
    private static final float MIN_SCALE = 0.85f;  
    private static final float MIN_ALPHA = 0.5f;  
  
    @SuppressLint("NewApi")  
    public void transformPage(View view, float position)  
    {  
        int pageWidth = view.getWidth();  
        int pageHeight = view.getHeight();  
  
        Log.e("TAG", view + " , " + position + "");  
  
        if (position < -1)  
        { // [-Infinity,-1)  
            // This page is way off-screen to the left.  
            view.setAlpha(0);  
  
        } else if (position <= 1) //a页滑动至b页 ; a页从 0.0 -1 ;b页从1 ~ 0.0  
        { // [-1,1]  
            // Modify the default slide transition to shrink the page as well  
            float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position));  
            float vertMargin = pageHeight * (1 - scaleFactor) / 2;  
            float horzMargin = pageWidth * (1 - scaleFactor) / 2;  
            if (position < 0)  
            {  
                view.setTranslationX(horzMargin - vertMargin / 2);  
            } else  
            {  
                view.setTranslationX(-horzMargin + vertMargin / 2);  
            }  
  
            // Scale the page down (between MIN_SCALE and 1)  
            view.setScaleX(scaleFactor);  
            view.setScaleY(scaleFactor);  
  
            // Fade the page relative to its size.  
            view.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE)  
                    / (1 - MIN_SCALE) * (1 - MIN_ALPHA));  
  
        } else  
        { // (1,+Infinity]  
            // This page is way off-screen to the right.  
            view.setAlpha(0);  
        }  
    }  
}  


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值