Android动画之3D翻转效果实现函数分析

Android中的翻转动画效果的实现,首先看一下运行效果如上图所示.
Android中并没有提供直接做3D翻转的动画,所以关于3D翻转的动画效果需要我们自己实现,那么我们首先来分析一下Animation 和 Transformation。

Animation动画的主要接口,其中主要定义了动画的一些属性比如开始时间,持续时间,是否重复播放等等。而Transformation中则包含一个矩阵和alpha值,矩阵是用来做平移,旋转和缩放动画的,而alpha值是用来做alpha动画的,要实现3D旋转动画我们需要继承自Animation类来实现,我们需要重载getTransformation和applyTransformation,在getTransformation中Animation会根据动画的属性来产生一系列的差值点,然后将这些差值点传给applyTransformation,这个函数将根据这些点来生成不同的Transformation。下面是具体实现:
复制代码 代码如下:
package com.example.textviewtest;
import android.graphics.Camera;
import android.graphics.Matrix;
import android.view.animation.Animation;
import android.view.animation.Transformation;
public class Rotate3dAnimation extends Animation {
// 开始角度
private final float mFromDegrees;
// 结束角度
private final float mToDegrees;
// 中心点
private final float mCenterX;
private final float mCenterY;
private final float mDepthZ;
// 是否需要扭曲
private final boolean mReverse;
// 摄像头
private Camera mCamera;
public Rotate3dAnimation(float fromDegrees, float toDegrees, float centerX,
float centerY, float depthZ, boolean reverse) {
mFromDegrees = fromDegrees;
mToDegrees = toDegrees;
mCenterX = centerX;
mCenterY = centerY;
mDepthZ = depthZ;
mReverse = reverse;
}
@Override
public void initialize(int width, int height, int parentWidth,
int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
mCamera = new Camera();
}
// 生成Transformation
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
final float fromDegrees = mFromDegrees;
// 生成中间角度
float degrees = fromDegrees
+ ((mToDegrees - fromDegrees) * interpolatedTime);
final float centerX = mCenterX;
final float centerY = mCenterY;
final Camera camera = mCamera;
final Matrix matrix = t.getMatrix();
camera.save();
if (mReverse) {
camera.translate(0.0f, 0.0f, mDepthZ * interpolatedTime);
} else {
camera.translate(0.0f, 0.0f, mDepthZ * (1.0f - interpolatedTime));
}
camera.rotateY(degrees);
// 取得变换后的矩阵
camera.getMatrix(matrix);
camera.restore();
matrix.preTranslate(-centerX, -centerY);
matrix.postTranslate(centerX, centerY);
}
}

其中包括了旋转的开始和结束角度,中心点、是否扭曲、和一个Camera,这里我们主要分析applyTransformation函数,其中第一个参数就是通过getTransformation函数传递的差指点,然后我们根据这个差值通过线性差值算法计算出一个中间角度degrees,Camera类是用来实现绕Y轴旋转后透视投影的,因此我们首先通过t.getMatrix()取得当前的矩阵,然后通过camera.translate来对矩阵进行平移变换操作,camera.rotateY进行旋转。这样我们就可以很轻松的实现3D旋转效果了。

下面是布局文件main.xml:
复制代码 代码如下:
View Code
<LinearLayout 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"
android:background="@drawable/main_screen_bg"
android:gravity="center_horizontal"
android:orientation="vertical"
tools:context=".MainActivity" >
<Button
android:id="@+id/next_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dip"
android:drawableTop="@drawable/qiangpiao_dropdown"
android:text="下一个" />
<TextView
android:id="@+id/tv"
android:layout_width="300dip"
android:layout_height="300dip"
android:layout_gravity="center"
android:background="@drawable/call_show_frame_safe"
android:gravity="center"
android:textColor="#ffffff"
android:textSize="15sp" />
</LinearLayout>

MainActivity的代码如下:
复制代码 代码如下:
View Code
package com.example.textviewtest;
import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.DecelerateInterpolator;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends Activity {
private TextView tv;
private Button btn;
private int count = 1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv = (TextView) findViewById(R.id.tv);
tv.setText(String.valueOf(count));
btn = (Button) findViewById(R.id.next_btn);
applyRotation(0, 90);
btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
applyRotation(0, 90);
}
});
}
private void applyRotation(float start, float end) {
// 计算中心点
final float centerX = tv.getWidth() / 2.0f;
final float centerY = tv.getHeight() / 2.0f;
final Rotate3dAnimation rotation = new Rotate3dAnimation(start, end,
centerX, centerY, 310.0f, true);
rotation.setDuration(500);
rotation.setFillAfter(true);
rotation.setInterpolator(new AccelerateInterpolator());
// 设置监听
rotation.setAnimationListener(new DisplayNextView());
tv.startAnimation(rotation);
}
private final class DisplayNextView implements Animation.AnimationListener {
public void onAnimationStart(Animation animation) {
}
// 动画结束
public void onAnimationEnd(Animation animation) {
tv.post(new SwapViews());
}
public void onAnimationRepeat(Animation animation) {
}
}
private final class SwapViews implements Runnable {
public void run() {
final float centerX = tv.getWidth() / 2.0f;
final float centerY = tv.getHeight() / 2.0f;
Rotate3dAnimation rotation = null;
tv.requestFocus();
rotation = new Rotate3dAnimation(90, 0, centerX, centerY, 310.0f,
false);
rotation.setDuration(500);
rotation.setFillAfter(true);
rotation.setInterpolator(new DecelerateInterpolator());
// 开始动画
tv.startAnimation(rotation);
tv.setText(String.valueOf(count++));
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
}

看懂了吗?呵呵。

时间: 2024-09-11 02:40:45

Android动画之3D翻转效果实现函数分析的相关文章

PowerPoint设计 制作3D翻转效果教程

  PowerPoint演示文稿,之所以叫演示,就是因为要做给人看的,至于看完的效果如何,就要看制作者的用心设计呢,一个好演示文稿,除了图片与文字的相得益彰,动画过渡的完美组合,音乐与歌词的同步进行,内容与动画的相互呼应!PowerPoint的生动就在于动画演绎的完美,下面教大家一个3D翻转效果,希望大家在制作的过程能起到作用! 1.打开PowerPoint软件,找到插入. 2.按住ctrl插入多张图片. 3.插入之后按ctrl+a选中所有图片.( 注:一般情况下,刚插入之后都是全选状态) 4.

css3的图形3d翻转效果应用示例

css3的图形3d翻转效果应用示例  代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html" charset="utf-8" /> <title>css3 3d rotate</title> <style type="text/css&quo

Android动画之雷达扫描效果

我们首先看一下效果图,有个整体的印象 好了,为了便于理解,这里就按照动画所见内容依次展开来说 准备 这里决定采用canvas(画布)和paint(画笔)实现了这个简单动画控件. 由图片可以看到有两条交叉的十字线.几个圆圈和一些白点,那么首先定义一下所需的画笔,画布及一些数据 setBackgroundColor(Color.TRANSPARENT); //宽度=5,抗锯齿,描边效果的白色画笔 mPaintLine = new Paint(); mPaintLine.setStrokeWidth(

JS实现六边形3D拖拽翻转效果的方法_javascript技巧

效果图 实例代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&q

Android利用Camera实现中轴3D卡牌翻转效果_Android

在Android系统API中,有两个Camera类: android.graphics.Camera android.hardware.Camera 第二个应用于手机硬件中的相机相关的操作,本文讲述的是利用第一个Camera类实现中轴3D转换的卡牌翻转效果,开始之前,先看一下Android系统中的坐标系: 对应于三维坐标系中的三个方向,Camera提供了三种旋转方法: rotateX() rotateY() rotateX() 调用这三种方法,传入旋转角度参数,即可实现视图沿着坐标轴旋转的功能.

Android利用Camera实现中轴3D卡牌翻转效果

在Android系统API中,有两个Camera类: android.graphics.Camera android.hardware.Camera 第二个应用于手机硬件中的相机相关的操作,本文讲述的是利用第一个Camera类实现中轴3D转换的卡牌翻转效果,开始之前,先看一下Android系统中的坐标系: 对应于三维坐标系中的三个方向,Camera提供了三种旋转方法: rotateX() rotateY() rotateX() 调用这三种方法,传入旋转角度参数,即可实现视图沿着坐标轴旋转的功能.

Android 动画效果怎么样叠加效果

问题描述 Android 动画效果怎么样叠加效果 我想实现的是,一个控件上面同事拥有两种或者两种以上的动画效果.比如说我给一个ImageView设置了一个移动的动画效果,但是我还想让这个控件在移动的同时进行旋转.这个该怎么做?跪求懂得大神指点 解决方案 AnimationSet as; Animation bs; TranslateAnimation ta; ScaleAnimation sa; RotateAnimation ra; AlphaAnimation aa; ta=new Tran

《Android和PHP开发最佳实践》一2.9 Android动画效果

2.9 Android动画效果 适当地使用动画效果可以很好地提升Android应用或游戏的操作体验.目前Android系统支持的动画效果主要有两种,即逐帧动画(Frame Animation)和补间动画(Tween Animation).虽然,在Android 3.0以后的版本中还引入了新的动画系统,但是目前最主流的动画效果还是这两种. 2.9.1 逐帧动画(Frame Animation) 逐帧动画类似于GIF动画图片,即按照顺序播放图片.我们通常会在Android项目的res/drawabl

android 动画效果的实现问题

问题描述 android 动画效果的实现问题 背景: 有三个activity,A和B,在A中有个小图片.在B中有个大的图片(和A中的小图片一样,只是大小不一样) 在B中的大图片的父节点是用HorizontalScrollView,显示超出一个屏幕. 问题: 现在要实现的效果是:点击A后,小图片能平滑并慢慢的放大成B.动画过程尽量的平滑. 现在的实现是: 在A中直接放大小图片,放大成B中的大图片大小后就显示B.但是这样有两个问题没解决: 1)A中图片的pivotX和pivotY的取点 2)在A中怎