标签:
Android动画有3类:帧动画、视图动画、属性动画。帧动画和视图动画又统称为补间动画。Android 3.0(API LEVEL 11)开始支持属性动画。
帧动画是针对Drawable资源的动画。其本质是一系列Drawable资源的连续变化,其本质是AnimationDrawable对象。其使用方法如下:
资源中用到了表示天气的三张图片
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="@mipmap/ic_sunny" android:duration="200" />
<item android:drawable="@mipmap/ic_slight_drizzle" android:duration="200" />
<item android:drawable="@mipmap/ic_haze" android:duration="200" />
</animation-list>
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initViews();
}
private void initViews() {
ImageView sampleIv= (ImageView)findViewById(R.id.iv_sample);
sampleIv.setBackgroundResource(R.drawable.wether_list);
final AnimationDrawable animationDrawable = (AnimationDrawable)sampleIv.getBackground();
sampleIv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
animationDrawable.start();
}
});
}
点击图片之后就会连续变换不同的图片出来
视图动画是对视图控件(View)应用动画,其本质是连续修改View的属性来展现变化。主要有Scale,Rotate,Translate,Alpha。使用方法如下:
旋转动画
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
/>
透明度动画
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:fromAlpha="0"
android:toAlpha="1">
</alpha>
位移动画
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="-100%"
android:toXDelta="0"
android:fromYDelta="-20%"
android:toYDelta="0">
</translate>
组合动画
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:fromAlpha="0.2"
android:toAlpha="1">
</alpha>
<scale
android:fromXScale="0%"
android:fromYScale="0%"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="100%"
android:toYScale="100%"/>
<rotate
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="360"
/>
</set>
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initViews();
}
private void initViews() {
final ImageView sampleIv= (ImageView)findViewById(R.id.iv_sample);
final Animation animation = AnimationUtils.loadAnimation(this,R.anim.roate360);
animation.setDuration(1500);
animation.setInterpolator(this,android.R.anim.linear_interpolator);
animation.setRepeatCount(Animation.INFINITE);
sampleIv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
sampleIv.startAnimation(animation);
}
});
}
接下来重点讲属性动画。
属性动画不仅仅针对视图(View),它几乎可以应用到任何对象。你可以定义属性动画来改变任意对象的属性,不管这个对象是否会在屏幕上呈现出来。属性动画的本质是在一定时间段内连续地改变对象的属性。
showView.setAlpha(0f);
showView.setVisibility(View.VISIBLE);
showView.animate()
.alpha(1f)
.setDuration(300/*ms*/)
.setListener(null);
hideView.animate()
.alpha(0f)
.setDuration(mShortAnimationDuration)
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
hideView.setVisibility(View.GONE);
}
});
下面展示如何在切换Fragmeng时应用翻转动画
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_card_flip);
if (savedInstanceState == null) {
// 如果没有实例,则将CardFrontFragment添加到Activity
//否则表明之前已经添加Fragment了
getFragmentManager()
.beginTransaction()
.add(R.id.container, new CardFrontFragment())
.commit();
} else {
mShowingBack = (getFragmentManager().getBackStackEntryCount() > 0);
}
// 监控返回栈的变化,以便正确地显示操作图标
getFragmentManager().addOnBackStackChangedListener(this);
}
@Override
public void onBackStackChanged() {
mShowingBack = (getFragmentManager().getBackStackEntryCount() > 0);
// 当返回栈发生变化,更新菜单显示
invalidateOptionsMenu();
}
private void flipCard() {
//如果返回栈中有实例,直接返回当前一个Fragment
if (mShowingBack) {
getFragmentManager().popBackStack();
return;
}
//指示可以返回上一个Fragment
mShowingBack = true;
//添加CarBackFragment
getFragmentManager()
.beginTransaction()
// 自定义Frameng切换时的动画
//包括切换当当前Fragment和返回到上一个Fragment的动画
//这样当按返回按钮时也会有动画效果
.setCustomAnimations(
R.animator.card_flip_right_in/*enter*/, R.animator.card_flip_right_out/*exit*/,
R.animator.card_flip_left_in/*popEnter*/, R.animator.card_flip_left_out/*popExit*/)
// 替换Fragment
.replace(R.id.container, new CardBackFragment())
// 将该事务添加到返回栈,这样才能响应返回按钮操作
.addToBackStack(null)
// 提交事务
.commit();
// 延迟更新菜单
mHandler.post(new Runnable() {
@Override
public void run() {
invalidateOptionsMenu();
}
});
}
car_flip_right_in.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 在旋转动画之前,立刻将apha 设为0,注意duration=0 -->
<objectAnimator
android:valueFrom="1.0"
android:valueTo="0.0"
android:propertyName="alpha"
android:duration="0" />
<!-- 旋转动画 -->
<objectAnimator
android:valueFrom="180"
android:valueTo="0"
android:propertyName="rotationY"
android:interpolator="@android:interpolator/accelerate_decelerate"
android:duration="300" />
<!-- 在旋转动画执行到二分之一的时候,立刻将alpha设为1,使之可见,注意 startOffset = 150. -->
<objectAnimator
android:valueFrom="0.0"
android:valueTo="1.0"
android:propertyName="alpha"
android:startOffset="150"
android:duration="1" />
</set>
card_flip_right_out.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 旋转 -->
<objectAnimator
android:valueFrom="0"
android:valueTo="-180"
android:propertyName="rotationY"
android:interpolator="@android:interpolator/accelerate_decelerate"
android:duration="@integer/card_flip_time_full" />
<!-- 旋转一半的时候设置透明度为1,使之可见. -->
<objectAnimator
android:valueFrom="1.0"
android:valueTo="0.0"
android:propertyName="alpha"
android:startOffset="@integer/card_flip_time_half"
android:duration="1" />
</set>
card_flip_left_in.xml 和car_flip_right_in.xml差不多,只是rotationY动画的起止角度 valueFrom=”-180”,valueTo=”0”.
card_flip_left_out.xml 和car_flip_right_out.xml差不多,只是rotationY动画的起止角度 valueFrom=”0”,valueTo=”180”.
下面展示有何在ViewPager切换Page的时候应用动画
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_screen_slide);
//实例化ViewPager和PagerAdapter对象
mPager = (ViewPager) findViewById(R.id.pager);
mPagerAdapter = new ScreenSlidePagerAdapter(getFragmentManager());
mPager.setAdapter(mPagerAdapter);
mPager.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
@Override
public void onPageSelected(int position) {
invalidateOptionsMenu();
}
});
}
菜单操作
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
//...
case R.id.action_zoom:
//设置缩放动画,在切换page的时候会看到效果
mPager.setPageTransformer(false,new ZoomPageTransformer());
return true;
case R.id.action_depth:
mPager.setPageTransformer(false,new DepthPageTransformer());
return true;
case R.id.action_default:
//恢复默认动画
mPager.setPageTransformer(false,null);
return true;
}
return super.onOptionsItemSelected(item);
}
DepthPageTransformer.java
public class DepthPageTransformer implements ViewPager.PageTransformer {
@Override
public void transformPage(View page, float position) {
int pageWidth = page.getWidth();
if(position <= -1){
//当不在屏幕显示范围时,恢复所有属性
page.setAlpha(1);
page.setTranslationX(0);
page.setScaleX(1);
page.setScaleY(1);
}else if(position < 0){
//屏幕左侧page
page.setTranslationX(-position*pageWidth);
page.setScaleX(position*0.3f+1f);
page.setScaleY(position*0.3f+1f);
page.setAlpha(1+position*0.8f);
}else if(position < 1) {
//屏幕右侧page
page.setTranslationX(0);
page.setScaleX(1);
page.setScaleY(1);
page.setAlpha(1);
}else{
//当不在屏幕显示范围时,恢复所有属性
page.setAlpha(1);
page.setTranslationX(0);
page.setScaleX(1);
page.setScaleY(1);
}
}
}
ZoomPageTransformer.java
public class ZoomPageTransformer implements ViewPager.PageTransformer {
@Override
public void transformPage(View page, float position) {
if(position <= -1){
//当不在屏幕显示范围时,恢复所有属性
page.setScaleX(1);
page.setScaleY(1);
page.setTranslationX(0);
page.setAlpha(1);
}else if(position < 1){
//在屏幕上显示的page
float pageWidth = page.getWidth();
float pageHeight = page.getHeight();
float scaleFactor = Math.max(0.85f,1 -Math.abs(position));
page.setScaleX(scaleFactor);
page.setScaleY(scaleFactor);
page.setAlpha(scaleFactor);
float verticalMargin = pageHeight*(1-scaleFactor)/2;
float horizonMargin = pageWidth*(1-scaleFactor)/2;
if(position < 0){
page.setTranslationX(horizonMargin-verticalMargin/2);
}else {
page.setTranslationX(-horizonMargin+verticalMargin/2);
}
}else{
//当不在屏幕显示范围时,恢复所有属性
page.setScaleX(1);
page.setScaleY(1);
page.setTranslationX(0);
page.setAlpha(1);
}
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_zoom);
mImageRcv = (RecyclerView)findViewById(R.id.rcv_images);
mAdapter = new ImageAdapter(this);
mAdapter.setOnItemClickListener(new ImageAdapter.OnItemClickListener() {
@Override
public void onItemClicked(View view, int pos) {
zoomImageFromThumb(view,mAdapter.getItemData(pos));
}
});
mImageRcv.setAdapter(mAdapter);
mImageRcv.setLayoutManager(new GridLayoutManager(this,3,
LinearLayoutManager.VERTICAL,false));
mShortAnimationDuration = getResources()
.getInteger(android.R.integer.config_shortAnimTime);
}
/**
* 动画执行关键代码
**/
private void zoomImageFromThumb(final View thumbView, int imageResId) {
// 取消上一个动画
if (mCurrentAnimator != null) {
mCurrentAnimator.cancel();
}
// 加载高清图片
final ImageView expandedImageView = (ImageView) findViewById(R.id.expanded_image);
expandedImageView.setImageResource(imageResId);
// 计算尺寸,以便精准动画
final Rect startBounds = new Rect();
final Rect finalBounds = new Rect();
final Point globalOffset = new Point();
// 获取屏幕绝对坐标
thumbView.getGlobalVisibleRect(startBounds);
findViewById(R.id.container).getGlobalVisibleRect(finalBounds, globalOffset);
startBounds.offset(-globalOffset.x, -globalOffset.y);
finalBounds.offset(-globalOffset.x, -globalOffset.y);
//
float startScale;
if ((float) finalBounds.width() / finalBounds.height()
> (float) startBounds.width() / startBounds.height()) {
startScale = (float) startBounds.height() / finalBounds.height();
} else {
startScale = (float) startBounds.width() / finalBounds.width();
}
//隐藏缩略图并开始动画显示高清图
thumbView.setAlpha(0f);
expandedImageView.setVisibility(View.VISIBLE);
// 设置动画的中心为坐标原点
expandedImageView.setPivotX(0f);
expandedImageView.setPivotY(0f);
// 构造动画
AnimatorSet set = new AnimatorSet();
set
.play(ObjectAnimator.ofFloat(expandedImageView, View.X, startBounds.left,
finalBounds.left))
.with(ObjectAnimator.ofFloat(expandedImageView, View.Y, startBounds.top,
finalBounds.top))
.with(ObjectAnimator.ofFloat(expandedImageView, View.SCALE_X, startScale, 1f))
.with(ObjectAnimator.ofFloat(expandedImageView, View.SCALE_Y, startScale, 1f));
set.setDuration(mShortAnimationDuration);
set.setInterpolator(new DecelerateInterpolator());
set.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
mCurrentAnimator = null;
}
@Override
public void onAnimationCancel(Animator animation) {
mCurrentAnimator = null;
}
});
set.start();
mCurrentAnimator = set;
//再次点击还原,逆过程
final float startScaleFinal = startScale;
expandedImageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (mCurrentAnimator != null) {
mCurrentAnimator.cancel();
}
AnimatorSet set = new AnimatorSet();
set
.play(ObjectAnimator.ofFloat(expandedImageView, View.X, startBounds.left))
.with(ObjectAnimator.ofFloat(expandedImageView, View.Y, startBounds.top))
.with(ObjectAnimator
.ofFloat(expandedImageView, View.SCALE_X, startScaleFinal))
.with(ObjectAnimator
.ofFloat(expandedImageView, View.SCALE_Y, startScaleFinal));
set.setDuration(mShortAnimationDuration);
set.setInterpolator(new DecelerateInterpolator());
set.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
thumbView.setAlpha(1f);
expandedImageView.setVisibility(View.GONE);
mCurrentAnimator = null;
}
@Override
public void onAnimationCancel(Animator animation) {
thumbView.setAlpha(1f);
expandedImageView.setVisibility(View.GONE);
mCurrentAnimator = null;
}
});
set.start();
mCurrentAnimator = set;
}
});
}
以上就是动画相关的知识。
Android 知识要点整理(12)----Animation(动画)
标签:
原文地址:http://blog.csdn.net/znatest/article/details/51440260