[教学]简单实现Android图片翻转动画效果

[教学]简单实现Android图片翻转动画效果 简单实现Android图片翻转动画效果 不说废话，先看效果。 这是原始图片的样子 这是翻转后的效果图 如果是你想要的效果，那么继续往下看，如果不是，那可以跳过了。 这是一个动画，而不是用matrix实现的直接翻转图片。 可能网上有很多例子了，但我这是我自己实验过的，单纯的翻转一张图片。 我这个是根据APIDemo简单修改写的 需要一个Rotate3d 类，继承Animation public class Rotate3d 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 Rotate3d(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(); } @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); } } 这个类可以直接拷过去，不用做任何的修改。其中的方法自己找相关资料研究。 在main.xml里加个ImageView，如 > 这个不需要解释吧，都可以看懂的 最后，还需要一个activity类 如: public class TestRotate extends Activity implements OnClickListener{ private mageView imageview; private ViewGroup mContainer; /** *这个变量设置的是图片，如果是多张图片，那么可以用数组，如 *private static final int IMAGE = new int[]{ * R.drawable.ro, * R.drawable.icon *}; *有多少图片就放多少，我这里做的只是一张图片的翻转 * */ private static final int IMAGE = R.drawable.ro; /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); imageview = (ImageView) findViewById(R.id.image); mContainer = (ViewGroup) findViewById(R.id.container); /** * 设置最新显示的图片 * 如果是数组，那么可以写成IMAGE[int] * */ imageview.setImageResource(IMAGE); /** * * 设置ImageView的OnClickListener * */ imageview.setClickable(true); imageview.setFocusable(true); imageview.setOnClickListener(this); } private void applyRotation(int position, float start, float end) { // Find the center of the container final float centerX = mContainer.getWidth() / 2.0f; final float centerY = mContainer.getHeight() / 2.0f; final Rotate3d rotation = new Rotate3d(start, end, centerX, centerY, 310.0f, true); rotation.setDuration(500); rotation.setFillAfter(true); rotation.setInterpolator(new AccelerateInterpolator()); rotation.setAnimationListener(new DisplayNextView(position)); mContainer.startAnimation(rotation); } @Override public void onClick(View v) { // TODO Auto-generated method stub /** * * 调用这个方法，就是翻转图片 * 参数很简单，大家都应该看得懂 * 简单说下，第一个是位置，第二是开始的角度，第三个是结束的角度 * 这里需要说明的是，如果是要回到上一张 * 把第一个参数设置成-1就行了 * */ applyRotation(0,0,90); } private final class DisplayNextView implements Animation.AnimationListener { private final int mPosition; private DisplayNextView(int position) { mPosition = position; } public void onAnimationStart(Animation animation) { } public void onAnimationEnd(Animation animation) { mContainer.post(new SwapViews(mPosition)); } public void onAnimationRepeat(Animation animation) { } } /** * This class is responsible for swapping the views and start the second * half of the animation. */ private final class SwapViews implements Runnable { private final int mPosition; public SwapViews(int position) { mPosition = position; } public void run() { final float centerX = mContainer.getWidth() / 2.0f; final float centerY = mContainer.getHeight() / 2.0f; Rotate3d rotation; if (mPosition > -1) { imageview.setVisibility(View.VISIBLE); imageview.requestFocus(); rotation = new Rotate3d(90, 180, centerX, centerY, 310.0f, false); } else { imageview.setVisibility(View.GONE); rotation = new Rotate3d(90, 0, centerX, centerY, 310.0f, false); } rotation.setDuration(500); rotation.setFillAfter(true); rotation.setInterpolator(new DecelerateInterpolator()); mContainer.startAnimation(rotation); } } } 代码里主要的地方我都注释了，大家自己看看，其他的都是不需要改，但也可根据自己实际需要来修改 我这里比较适合一张图片的翻转，如果是多张图片，可以参考APIDemo里的例子，就是加个ArrayAdapter，还是简单的，也可以自己发挥修改，实现自己想要的。 这里的代码基本上可以直接运行项目了。 供大家参考，希望大家实现出更多更强大的效果。 我刚研究这个动画2天，还很多不会,如有不足之处，欢迎大家提出来一起研究。