android:3D垂直翻转动画-FlipAnimation
- 需求
对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的更多相关文章
- Android立体旋转动画实现与封装(支持以X、Y、Z三个轴为轴心旋转)
本文主要介绍Android立体旋转动画,或者3D旋转,下图是我自己实现的一个界面 立体旋转分为以下三种: 1. 以X轴为轴心旋转 2. 以Y轴为轴心旋转 3. 以Z轴为轴心旋转--这种等价于andro ...
- 透过HT for Web 3D看动画Easing函数本质
http://www.hightopo.com/guide/guide/plugin/form/examples/example_easing.html 50年前的这个月诞生了BASIC这门计算机语言 ...
- Android Animation(动画)
前言 Android 平台提供实现动画的解决方案(三种) 一.3.0以前,android支持两种动画: (1)Frame Animation:顺序播放事先做好的图像,与gif图片原理类似,是一种逐帧动 ...
- 透过WebGL 3D看动画Easing函数本质
50年前的这个月诞生了BASIC这门计算机语言,回想起自己喜欢上图形界面这行,还得归功于当年在win98下用QBASIC照葫芦画瓢敲了一段绘制奥运五环的代码,当带色彩的奥运五环呈现在自己面前时我已知道 ...
- Android 三种动画详解
[工匠若水 http://blog.csdn.net/yanbober 转载请注明出处.点我开始Android技术交流] 1 背景 不能只分析源码呀,分析的同时也要整理归纳基础知识,刚好有人微博私信让 ...
- Android中的动画学习总结
android中动画可分为三种:帧动画,补间动画,和属性动画.其中属性动画是google推荐的,它可以实现前面两种动画的效果,运用起来更加灵活. 帧动画:顾名思义,就是一帧一帧的图片,快速播放形成的动 ...
- android 巧用动画使您app风骚起来
巧用Android的自定义动画,使你更加的有动感,是大多数Android开发人员的目标,那怎么做到这点.请听下文分解: 3.0以前,android支持两种动画模式,tween animation(幅间 ...
- Android中的动画使用总结
android中动画可分为三种:帧动画,补间动画,和属性动画.其中属性动画是google推荐的,它可以实现前面两种动画的效果,运用起来更加灵活. 帧动画:顾名思义,就是一帧一帧的图片,快速播放形成的动 ...
- Android中矢量动画
Android中矢量动画 Android中用<path> 标签来创建SVG,就好比控制着一支画笔,从一点到一点,动一条线. <path> 标签 支持一下属性 M = (Mx, ...
随机推荐
- 激光数据匹配(MATLAB Robotics System Toolbox)
正态分布变换算法是一个配准算法,它应用于三维点的统计模型,使用标准最优化技术来确定两个点云间的最优的匹配,因为其在配准过程中不利用对应点的特征计算和匹配,所以时间比其他方法快.算法细节可以参考:NDT ...
- 整合ssm框架之配置文件
原文:https://blog.csdn.net/zwyanqing/article/details/53039591 ssm整合 一.applicationContext.xml 1.配置数据源 & ...
- HDU 1069 Monkey and Banana(最大的单调递减序列啊 dp)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1069 Problem Description A group of researchers are d ...
- 在发送信息时应用PendingIntent.FLAG_UPDATE_CURRENT
1. 连续发送两条信息时,出现bug.以下是bug现象描述. 发送第一条信息,sentReceiver弹出toast告知发送成功,同时在listview中的发送状态立即同步更新为发送成功. 继续发送第 ...
- 【php+微擎】微擎学习相关帮助推荐
我刚接触微擎没多久,学习中遇到很多问题,走过很多弯路.遇到很多问题在网上也查不到,因此想把我自己的学习历程写出来供新手们参考(本人还是菜鸟一枚,文中错误之处,敬请指正!) 我以一个新手小白的角度来帮助 ...
- 【CAS单点登录视频教程】 第03集 -- 配置 tomcat的 ssl
目录 ----------------------------------------- [CAS单点登录视频教程] 第06集[完] -- Cas认证 学习 票据认证FormsAuthenticati ...
- 阿里云k8s私有仓库registry操作管理
1. 登录阿里云Docker Registry $ sudo docker login --username=*****技 registry.cn-hangzhou.aliyuncs.com 用于登录 ...
- (原)luarocks更新某个模块
转载请注明出处: http://www.cnblogs.com/darkknightzh/p/6424398.html 参考网址: https://github.com/torch/nn/issues ...
- hihocoder第233周
题目链接 题目描述 给定一个数组a[N],N小于1e5.把数组划分成若干个片段,每个片段的和都不为0,问有多少种划分方法? 方法描述 定义f(i)表示0~i共有多少种划分方式,则$f(j)=\sum_ ...
- 【DeepLearning】Exercise:Self-Taught Learning
Exercise:Self-Taught Learning 习题链接:Exercise:Self-Taught Learning feedForwardAutoencoder.m function [ ...