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);
}
}
}