`
thunder_yan
  • 浏览: 112467 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Android 3D图片切换

阅读更多

MainActivity

package org.wp.activity;

import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.LinearGradient;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.PorterDuff.Mode;
import android.graphics.PorterDuffXfermode;
import android.graphics.Shader.TileMode;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.DecelerateInterpolator;
import android.widget.ImageView;

public class MainActivity extends Activity {
	private ViewGroup mContainer;
	private ImageView myFrontIv;
	private ImageView myBackIv;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);

		mContainer = (ViewGroup) this.findViewById(R.id.mContainer);
		myFrontIv = (ImageView) this.findViewById(R.id.myFrontIv);
		myBackIv = (ImageView) this.findViewById(R.id.myBackIv);
		// 因为要旋转所以我们需要保存视图的缓存信息
		mContainer.setPersistentDrawingCache(ViewGroup.PERSISTENT_ANIMATION_CACHE);
	
		myFrontIv.setImageBitmap(createReflectedImage(((BitmapDrawable) getResources()
				.getDrawable(R.drawable.picture1)).getBitmap()));
		myBackIv.setImageBitmap(createReflectedImage(((BitmapDrawable) getResources()
				.getDrawable(R.drawable.picture2)).getBitmap()));
	}

	public void showBack(View view) {
		applyRotation(1, 0, 90);
	}

	public void showFront(View view) {
		applyRotation(-1, 0, -90);
	}

	private void applyRotation(int position, float start, float end) {
		final float centerX = mContainer.getWidth() / 2.0f;
		final float centerY = mContainer.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(position));

		mContainer.startAnimation(rotation);
	}

	private final class DisplayNextView implements Animation.AnimationListener {
		private final int mPosition;

		private DisplayNextView(int position) {
			mPosition = position;
		}

		@Override
		public void onAnimationStart(Animation arg0) {
		}

		@Override
		public void onAnimationEnd(Animation arg0) {
			mContainer.post(new SwapViews(mPosition));
		}

		@Override
		public void onAnimationRepeat(Animation arg0) {
		}
	}

	private final class SwapViews implements Runnable {
		private final int mPosition;

		public SwapViews(int position) {
			mPosition = position;
		}

		@Override
		public void run() {
			final float centerX = mContainer.getWidth() / 2.0f;
			final float centerY = mContainer.getHeight() / 2.0f;
			Rotate3dAnimation rotation = null;
			if (mPosition > -1) {
				myFrontIv.setVisibility(View.GONE);
				myBackIv.setVisibility(View.VISIBLE);
				myBackIv.requestFocus();

				rotation = new Rotate3dAnimation(-90, 0, centerX, centerY,
						310.0f, false);
			} else {
				myFrontIv.setVisibility(View.VISIBLE);
				myBackIv.setVisibility(View.GONE);
				myFrontIv.requestFocus();

				rotation = new Rotate3dAnimation(90, 0, centerX, centerY,
						310.0f, false);
			}

			rotation.setDuration(500);
			rotation.setFillAfter(true);
			// 动画插入器 减速
			rotation.setInterpolator(new DecelerateInterpolator());

			mContainer.startAnimation(rotation);
		}
	}
	
	private Bitmap createReflectedImage(Bitmap originalBitmap) {
		final int reflectionGap = 4;

		int width = originalBitmap.getWidth();
		int height = originalBitmap.getHeight();

		Matrix matrix = new Matrix();
		matrix.preScale(1, -1);
		Bitmap reflectionBitmap = Bitmap.createBitmap(originalBitmap, 0,
				height / 2, width, height / 2, matrix, false);
		Bitmap withReflectionBitmap = Bitmap.createBitmap(width, (height
				+ height / 2 + reflectionGap), Config.ARGB_8888);

		Canvas canvas = new Canvas(withReflectionBitmap);
		canvas.drawBitmap(originalBitmap, 0, 0, null);

		Paint defaultPaint = new Paint();
		canvas.drawRect(0, height, width, height + reflectionGap, defaultPaint);

		canvas.drawBitmap(reflectionBitmap, 0, height + reflectionGap, null);

		Paint paint = new Paint();
		LinearGradient shader = new LinearGradient(0, originalBitmap.getHeight(), 0,
				withReflectionBitmap.getHeight(), 0x70ffffff, 0x00ffffff,
				TileMode.MIRROR);
		paint.setShader(shader);
		paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));

		canvas.drawRect(0, height, width, withReflectionBitmap.getHeight(), paint);

		return withReflectionBitmap;
	}
}

 

Rotate3dAnimation

 

package org.wp.activity;

import android.view.animation.Animation;
import android.view.animation.Transformation;
import android.graphics.Camera;
import android.graphics.Matrix;

public class Rotate3dAnimation extends Animation {
	/** 开始旋转的角度 **/
	private final float mFromDegrees;
	/** 旋转结束的角度 **/
	private final float mToDegrees;
	/** 图片中心X坐标 **/
	private final float mCenterX;
	/** 图片中心Y坐标 **/
	private final float mCenterY;
	/** Z轴上的距离 **/
	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();
	}

	@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();
		// x轴 正值向右
		// y轴 正值向上
		// z轴 正值缩小
		if (mReverse) {
			// 由大变小
			camera.translate(0.0f, 0.0f, mDepthZ * interpolatedTime);
		} else {
			// 由小变大
			camera.translate(0.0f, 0.0f, mDepthZ * (1.0f - interpolatedTime));
		}

		// 围绕Y轴进行旋转
		camera.rotateY(degrees);
		camera.getMatrix(matrix);
		camera.restore();

		// 旋转矩阵运算会以图像的原点为变换中心点,如果想要以图片中心点为旋转的中心点
		// 就需要首先把整个View的中心移动到原点,矩阵运算完成后再把View移回原来的位置
		matrix.preTranslate(-centerX, -centerY);
		matrix.postTranslate(centerX, centerY);
	}
}

 

main.xml

<?xml version="1.0" encoding="utf-8"?>  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="fill_parent"   
    android:layout_height="fill_parent">  
    <LinearLayout android:layout_width="fill_parent"  
        android:layout_height="fill_parent"  
        android:id="@+id/mContainer">  
        <ImageView android:layout_width="fill_parent"  
            android:layout_height="fill_parent"  
            android:onClick="showBack"  
            android:id="@+id/myFrontIv" />  
        <ImageView android:layout_width="fill_parent"  
            android:layout_height="fill_parent"  
            android:onClick="showFront"  
            android:visibility="gone"  
            android:id="@+id/myBackIv" />      
    </LinearLayout>     
</LinearLayout>  
 
分享到:
评论

相关推荐

    Android 3D图片轮播.zip

    "Android 3D图片轮播"是一个高级的Android控件,它为开发者提供了一种独特的方式来展示图片,通过3D转换效果增加用户体验。这种3D轮播器通常用于应用的启动页、产品展示或者广告展示等场景,能够使用户的界面更加...

    Android高级图片滚动控件,3D版的图片轮播器Demo

    首先,我们要理解3D图片轮播器的核心特性。在2D平面上实现3D效果通常涉及视图的旋转和平移。在Android中,我们可以利用`Matrix`类来处理几何变换,通过设置`matrix.postRotate()`方法来实现旋转,`matrix....

    android 3d图片反转

    在Android开发中,3D图片反转是一种常见的动画效果,它能为用户界面带来生动和立体的感受。本篇文章将深入探讨如何在Android中实现这个功能,包括基本原理、关键技术和实战步骤。 首先,3D图片反转的实现基于...

    android canvas 3D旋转木马 图片立体展示

    总的来说,"android canvas 3D旋转木马 图片立体展示"是一个结合了Android图形编程、动画技术和用户交互的复杂项目。它需要开发者具备扎实的数学基础、良好的编程技巧以及对Android系统理解的深度。通过学习和实践这...

    3D切换动画效果

    在Android平台上实现3D切换动画效果,是一种提升用户体验和视觉吸引力的重要手段。这种技术主要涉及到Android的动画系统,包括视图动画(View Animation)和属性动画(Property Animation)。以下是关于这个主题的...

    Android 视频无缝切换&&图片花式切换

    在Android平台上,实现视频无缝切换和图片花式切换是一项技术挑战,但也是提升用户体验的关键因素。下面我们将深入探讨这两个主题,以及如何在Android应用中实现它们。 **视频无缝切换** 视频无缝切换通常涉及到多...

    Android高级图片滚动控件,3D版的图片轮播器Demo.zip

    本示例是一个高级版本的3D图片轮播器,它不仅提供了基本的图片切换功能,还增加了视觉上的立体效果,提升了用户体验。下面将详细探讨这个3D版的图片轮播器Demo所涉及的技术点和实现原理。 1. **3D翻转效果** - 在...

    android 3D旋转相册

    "android 3D旋转相册"指的是利用Android SDK中的图形库和动画API来创建一个具有立体感和动态旋转效果的图片浏览应用。这样的相册不仅能够展示图片,还可以通过3D翻转效果增加互动性和趣味性。 在实现3D旋转相册的...

    图片切换3D效果

    以下是一些关键的XML元素和属性,它们在创建3D图片切换效果时扮演着重要角色: 1. `&lt;ViewFlipper&gt;`:这是Android中的一个布局容器,可以用来实现动画效果,比如图片的3D翻转。通过设置适当的动画持续时间和动画类型...

    Android 3D相册图片滑动+倾斜+放大+倒影处理源码.rar

    这个"Android 3D相册图片滑动+倾斜+放大+倒影处理源码"提供了实现此类高级视觉效果的方法。下面将详细探讨这个源码中的关键知识点。 1. **3D相册效果**:此源码实现了3D翻转效果,让用户在浏览相册时仿佛在操作真实...

    Android 3D相册图片滑动+倾斜+放大+倒影处理源码

    在Android开发中,创建一个具有视觉吸引力的3D相册是一项挑战,但通过巧妙地结合各种技术,可以实现像标题中描述的那样——3D相册图片滑动、倾斜、放大以及倒影处理。这个源码项目正是为了解决这个问题,提供了一种...

    Android应用源码之Android高级图片滚动控件,3D版的图片轮播器Demo.zip

    3D图片轮播器通常通过矩阵变换实现图片的翻转效果,使得图片在切换时有类似翻书页的动态感觉。在Android中,这需要对OpenGL ES或者Canvas的绘图操作有深入的理解,涉及到矩阵运算、纹理映射以及视图转换等概念。...

    android相册3D源码

    4. **动画过渡**:为了提供流畅的用户体验,源码中可能包含了许多动画过渡效果,比如图片之间的切换、3D旋转等,这些通常通过ObjectAnimator或ValueAnimator实现。 5. **性能优化**:由于涉及到3D图形处理,性能...

    android ImageSwither实现3d图片轮播

    总结一下,实现`android ImageSwitcher`的3D图片轮播涉及以下几个关键点: 1. 使用`ImageSwitcher`作为基础视图切换器。 2. 创建自定义`GLSurfaceView`实现3D渲染和动画效果。 3. 集成`GestureDetector`和`...

    Android实现高级图片滚动控件,3D版的图片轮播器Demo_图片滚动展示.zip

    本项目“Android高级图片滚动控件,3D版的图片轮播器Demo”专注于提供一种独特且引人入胜的3D图片展示方式,让用户能够更加沉浸地浏览图片。 首先,我们要理解3D图片轮播器的核心概念。在传统的2D轮播器基础上,3D...

    Android3D画廊Gallery实现无限循环和自动跳转

    在Android开发中,3D Gallery是一种独特且引人入胜的图像展示方式,它通过模拟3D空间中的图片浏览,给用户带来更加生动的交互体验。本教程将深入讲解如何在Android应用中实现一个3D画廊(Gallery)组件,支持无限...

    android 超炫图片游览器

    4. **动画效果**:Android的动画系统(如Property Animation或View Animation)是实现图片切换效果的关键。开发者可以创建自定义动画,比如淡入淡出、旋转、缩放等,来增加用户交互的流畅性和视觉吸引力。 接下来,...

    Android 自定义 ViewPager 打造千变万化的图片切换效果

    "Android 自定义 ViewPager 打造千变万化的图片切换效果"这个主题,主要是探讨如何通过扩展Android的ViewPager或者使用像Jazzy ViewPager这样的第三方库,来创建更具视觉吸引力的图片滑动体验。 首先,自定义...

    Android应用源码3D相册.zip

    5. **触摸事件处理**:为了实现3D相册的交互功能,如滑动切换图片、捏合手势缩放等,源码中会包含对触摸事件的处理逻辑,这涉及Android的MotionEvent类和GestureDetector类。 6. **动画框架**:Android提供的...

Global site tag (gtag.js) - Google Analytics