• 需求

    对ImageView进行相似于翻纸牌的动画
  • 解决

    各种Animator的组合

第一步动画:

动画代码文件1,card_flip_left_out.xml

  <?

xml version="1.0" encoding="utf-8"?

>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- 先缩小 -->
<objectAnimator
android:duration="200"
android:propertyName="scaleX"
android:valueFrom="1.0"
android:valueTo="0.8" />
<objectAnimator
android:duration="200"
android:propertyName="scaleY"
android:valueFrom="1.0"
android:valueTo="0.8" />
<!-- 再旋转 -->
<objectAnimator
android:duration="@integer/card_flip_time_full"
android:interpolator="@android:interpolator/accelerate_decelerate"
android:propertyName="rotationY"
android:startOffset="200"
android:valueFrom="0"
android:valueTo="90" />
<!-- 同一时候透明度变化 -->
<objectAnimator
android:duration="@integer/card_flip_time_full"
android:propertyName="alpha"
android:startOffset="200"
android:valueFrom="1.0"
android:valueTo="0.0" />
</set>

第二步动画

动画文件2:card_flip_left_out

<?

xml version="1.0" encoding="utf-8"?

>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- 马上设置为透明 -->
<objectAnimator
android:duration="0"
android:propertyName="alpha"
android:valueFrom="1.0"
android:valueTo="0.0" />
<!-- 旋转 -->
<objectAnimator
android:duration="@integer/card_flip_time_full"
android:interpolator="@android:interpolator/accelerate_decelerate"
android:propertyName="rotationY"
android:valueFrom="-90"
android:valueTo="0" />
<!-- 旋转一半的时间。逐渐显示 -->
<objectAnimator
android:duration="1"
android:propertyName="alpha"
android:startOffset="@integer/card_flip_time_half"
android:valueFrom="0.0"
android:valueTo="1.0" />
<!-- 最后放大 -->
<objectAnimator
android:duration="200"
android:propertyName="scaleX"
android:startOffset="@integer/card_flip_time_full"
android:valueFrom="0.8"
android:valueTo="1.0" />
<objectAnimator
android:duration="200"
android:propertyName="scaleY"
android:startOffset="@integer/card_flip_time_full"
android:valueFrom="0.8"
android:valueTo="1.0" />
</set>

以下就是写java代码啦,在第一个动画结束的时候,换图。

package com.example.android.animationsdemo;
import android.animation.Animator;
import android.animation.AnimatorInflater;
import android.animation.AnimatorListenerAdapter;
import android.animation.AnimatorSet;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView; /**
* @date 2015年3月18日 下午2:28:33
* @author Zheng Haibo
* @Description: 图片的翻转动画
*/
public class ImageFlipActivity extends Activity { private ImageView imageView;
private int clickCount = 0; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_image_flip);
imageView = (ImageView) findViewById(R.id.iv_show); imageView.setOnClickListener(new OnClickListener() { @Override
public void onClick(View v) {
playFlipAnimation2();
} });
} private void playFlipAnimation2() {
clickCount++;
AnimatorSet animatorSetOut = (AnimatorSet) AnimatorInflater
.loadAnimator(this, R.animator.card_flip_left_out); final AnimatorSet animatorSetIn = (AnimatorSet) AnimatorInflater
.loadAnimator(this, R.animator.card_flip_left_in); animatorSetOut.setTarget(imageView);
animatorSetIn.setTarget(imageView); animatorSetOut.addListener(new AnimatorListenerAdapter() { @Override
public void onAnimationEnd(Animator animation) {// 翻转90度之后,换图
if (clickCount % 2 == 0) {
imageView.setImageResource(R.drawable.image1);
} else {
imageView.setImageResource(R.drawable.image2);
}
animatorSetIn.start();
}
}); animatorSetIn.addListener(new AnimatorListenerAdapter() { @Override
public void onAnimationEnd(Animator animation) {
// TODO
}
});
animatorSetOut.start();
} }
  • 很多其它交流

Android开发联盟QQ群:272209595

android:3D垂直翻转动画-FlipAnimation的更多相关文章

  1. Android立体旋转动画实现与封装(支持以X、Y、Z三个轴为轴心旋转)

    本文主要介绍Android立体旋转动画,或者3D旋转,下图是我自己实现的一个界面 立体旋转分为以下三种: 1. 以X轴为轴心旋转 2. 以Y轴为轴心旋转 3. 以Z轴为轴心旋转--这种等价于andro ...

  2. 透过HT for Web 3D看动画Easing函数本质

    http://www.hightopo.com/guide/guide/plugin/form/examples/example_easing.html 50年前的这个月诞生了BASIC这门计算机语言 ...

  3. Android Animation(动画)

    前言 Android 平台提供实现动画的解决方案(三种) 一.3.0以前,android支持两种动画: (1)Frame Animation:顺序播放事先做好的图像,与gif图片原理类似,是一种逐帧动 ...

  4. 透过WebGL 3D看动画Easing函数本质

    50年前的这个月诞生了BASIC这门计算机语言,回想起自己喜欢上图形界面这行,还得归功于当年在win98下用QBASIC照葫芦画瓢敲了一段绘制奥运五环的代码,当带色彩的奥运五环呈现在自己面前时我已知道 ...

  5. Android 三种动画详解

    [工匠若水 http://blog.csdn.net/yanbober 转载请注明出处.点我开始Android技术交流] 1 背景 不能只分析源码呀,分析的同时也要整理归纳基础知识,刚好有人微博私信让 ...

  6. Android中的动画学习总结

    android中动画可分为三种:帧动画,补间动画,和属性动画.其中属性动画是google推荐的,它可以实现前面两种动画的效果,运用起来更加灵活. 帧动画:顾名思义,就是一帧一帧的图片,快速播放形成的动 ...

  7. android 巧用动画使您app风骚起来

    巧用Android的自定义动画,使你更加的有动感,是大多数Android开发人员的目标,那怎么做到这点.请听下文分解: 3.0以前,android支持两种动画模式,tween animation(幅间 ...

  8. Android中的动画使用总结

    android中动画可分为三种:帧动画,补间动画,和属性动画.其中属性动画是google推荐的,它可以实现前面两种动画的效果,运用起来更加灵活. 帧动画:顾名思义,就是一帧一帧的图片,快速播放形成的动 ...

  9. Android中矢量动画

    Android中矢量动画 Android中用<path> 标签来创建SVG,就好比控制着一支画笔,从一点到一点,动一条线. <path> 标签 支持一下属性 M = (Mx, ...

随机推荐

  1. 激光数据匹配(MATLAB Robotics System Toolbox)

    正态分布变换算法是一个配准算法,它应用于三维点的统计模型,使用标准最优化技术来确定两个点云间的最优的匹配,因为其在配准过程中不利用对应点的特征计算和匹配,所以时间比其他方法快.算法细节可以参考:NDT ...

  2. 整合ssm框架之配置文件

    原文:https://blog.csdn.net/zwyanqing/article/details/53039591 ssm整合 一.applicationContext.xml 1.配置数据源 & ...

  3. HDU 1069 Monkey and Banana(最大的单调递减序列啊 dp)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1069 Problem Description A group of researchers are d ...

  4. 在发送信息时应用PendingIntent.FLAG_UPDATE_CURRENT

    1. 连续发送两条信息时,出现bug.以下是bug现象描述. 发送第一条信息,sentReceiver弹出toast告知发送成功,同时在listview中的发送状态立即同步更新为发送成功. 继续发送第 ...

  5. 【php+微擎】微擎学习相关帮助推荐

    我刚接触微擎没多久,学习中遇到很多问题,走过很多弯路.遇到很多问题在网上也查不到,因此想把我自己的学习历程写出来供新手们参考(本人还是菜鸟一枚,文中错误之处,敬请指正!) 我以一个新手小白的角度来帮助 ...

  6. 【CAS单点登录视频教程】 第03集 -- 配置 tomcat的 ssl

    目录 ----------------------------------------- [CAS单点登录视频教程] 第06集[完] -- Cas认证 学习 票据认证FormsAuthenticati ...

  7. 阿里云k8s私有仓库registry操作管理

    1. 登录阿里云Docker Registry $ sudo docker login --username=*****技 registry.cn-hangzhou.aliyuncs.com 用于登录 ...

  8. (原)luarocks更新某个模块

    转载请注明出处: http://www.cnblogs.com/darkknightzh/p/6424398.html 参考网址: https://github.com/torch/nn/issues ...

  9. hihocoder第233周

    题目链接 题目描述 给定一个数组a[N],N小于1e5.把数组划分成若干个片段,每个片段的和都不为0,问有多少种划分方法? 方法描述 定义f(i)表示0~i共有多少种划分方式,则$f(j)=\sum_ ...

  10. 【DeepLearning】Exercise:Self-Taught Learning

    Exercise:Self-Taught Learning 习题链接:Exercise:Self-Taught Learning feedForwardAutoencoder.m function [ ...