Android编程实现3D立体旋转效果的实例代码

说明:之前在网上到处搜寻类似的旋转效果 但搜到的结果都不是十分满意 原因不多追述(如果有人找到过相关 比较好的效果 可以发一下连接 一起共同进步)

一 效果展示 :

如非您所需要的效果 也希望能给些微帮助

具体操作以及实现 效果 请看项目例子

二 使用方式

此空间继承与FrameLayout

子空间直接添加如同framelayout 相同 如要如图效果 唯一要求子空间必须位于父控件中心且宽高等大小 为了方便扩展而做 如有其他需求可自行更改 (注 所有子控件 最好添加上背景 由于绘制机制和动画原因 没有背景会有部分重贴) 内部子view 可为 任意ViewGroup 。 弱使用过程中遇见任何BUG 欢迎提出。

三 实现原理

实现原理由Camera 与Maxtrix 组合修改View的绘制而得 具体Camera 与Maxtrix 的变换 过程请自行搜索。 在此不班门弄斧。

具体修改有

@Override
protected void dispatchDraw(Canvas canvas) {
 int indexleft = getWidth() / 2;//中间显示视图 ----左边的位置
 int postTranslateX = rotationX * childWith / 2 / rotation;//设-----定边移动 距离
 //定点 又称顶点
 // chilDrawforCamera(canvas, postTranslateX, indexleft, 3);//预绘制 的 县绘制 防止遮挡
 for (int i = 0; i < 4; i++)
 chilDrawforCamera(canvas, postTranslateX, indexleft, i);
 if (!isTouch)
 handler.sendEmptyMessageDelayed(1, 100);
}

重新编写 dispathDraw() 从而达到 不必要去修改子view的内容 而添加扩展性

具体变换包括

private void chilDrawforCamera(Canvas canvas, int postTranslateX, int indexleft, int i) {
 canvas.save();
 mCamera.save();
 mMaxtrix.reset();
 mCamera.translate(postTranslateX, 0, 0);
 mCamera.rotateY(rotationX);
 mCamera.translate(postTranslateX, 0, 0);
 if (postTranslateX == 0) {
 if (isright)
 setCameraChange(childWith, rotation, i);
 else
 setCameraChange(-childWith, -rotation, i);
 } else if (postTranslateX > 0) {
 setCameraChange(childWith, rotation, i);
 } else if (postTranslateX < 0) {
 setCameraChange(-childWith, -rotation, i);
 }
 mCamera.getMatrix(mMaxtrix);
 mCamera.restore();
 mMaxtrix.preTranslate(-indexleft, -getHeight() / 2);//指定在 屏幕上 运行的棱 是哪一条
 mMaxtrix.postTranslate(indexleft, getHeight() / 2);//运行路径
 canvas.concat(mMaxtrix);
 //绘制
 View childAt = getChildAt((swithView(i) + 2 * getChildCount()) % getChildCount());
 drawChild(canvas, childAt, 0);
 canvas.restore();
}

指定需要绘制的子view 先后顺序以及哪些子view

private int swithView(int i) {
 int k = 0;
 switch (i) {
 case 0:
 if (isright)
 k = index - 2;
 else
 k = index + 2;
 break;
 case 1:
 if (isright)
 k = index + 1;
 else
 k = index - 1;
 break;
 case 2:
 if (isright)
 k = index - 1;
 else
 k = index + 1;
 break;
 case 3:
 k = index;
 break;
 }
 return k;

具体的网上其他 类似效果到底有什么不同于优势在此不多做描述 实现方式上有哪些不同 嗯 下次有空再细说(由于需要大量图文描述 3D的变换过程才讲的清楚,有些间隔的时间也稍长 只记得大概的思路过程)。

private void setCameraChange(int translate, int roat, int i) {
 switch (i) {
 case 0:
 //预绘制 的VIEW
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.rotateY(-roat);
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.rotateY(-roat);
 mCamera.translate(-translate / 2, 0, 0);
 break;
 //当前位置两侧的View
 case 1:
 mCamera.translate(translate / 2, 0, 0);
 mCamera.rotateY(roat);
 mCamera.translate(translate / 2, 0, 0);
 break;
 case 2:
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.rotateY(-roat);
 mCamera.translate(-translate / 2, 0, 0);
 break;
 //最后绘制 当前显示位置 防止 被遮挡
 case 3:
 mCamera.rotateY(0);
 break;
 }
}

其他剩下的就是 index 选中切换 以及滑动内容 和分发修改等。demo下载 有分的相关小伙伴就下载提供一些 没有的就github 下载吧。

整个类复制也可以

package com.burning.foethedog;
import android.content.Context;
import android.graphics.Camera;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.FrameLayout;
/**
 * Created by burning on 2017/5/2.
 * When I wrote this, only God and I understood what I was doing
 * Now, God only knows
 * -------------------------//┏┓   ┏┓
 * -------------------------//┏┛┻━━━┛┻┓
 * -------------------------//┃       ┃
 * -------------------------//┃   ━   ┃
 * -------------------------//┃ ┳┛ ┗┳ ┃
 * -------------------------//┃       ┃
 * -------------------------//┃   ┻   ┃
 * -------------------------//┃       ┃
 * -------------------------//┗━┓   ┏━┛
 * -------------------------//┃   ┃ 神兽保佑
 * -------------------------//┃   ┃ 代码无BUG!
 * -------------------------//┃   ┗━━━┓
 * -------------------------//┃       ┣┓
 * -------------------------//┃       ┏┛
 * -------------------------//┗┓┓┏━┳┓┏┛
 * -------------------------// ┃┫┫ ┃┫┫
 * -------------------------// ┗┻┛ ┗┻┛
 */
public class Rota3DSwithView extends FrameLayout {
 Camera mCamera;
 Matrix mMaxtrix;
 public Rota3DSwithView(Context context) {
 super(context);
 initRoat3D();
 }
 private void initRoat3D() {
 mCamera = new Camera();
 mMaxtrix = new Matrix();
 setWillNotDraw(false);
 }
 public Rota3DSwithView(Context context, AttributeSet attrs) {
 super(context, attrs);
 initRoat3D();
 }
 public Rota3DSwithView(Context context, AttributeSet attrs, int defStyleAttr) {
 super(context, attrs, defStyleAttr);
 initRoat3D();
 }
 public Rota3DSwithView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
 super(context, attrs, defStyleAttr, defStyleRes);
 initRoat3D();
 }
 int childWith;
 @Override
 protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
 childWith = getChildAt(0).getMeasuredWidth();
 super.onLayout(changed, left, top, right, bottom);
 }
 //摄像机 为点光源 正真的直角 反而看起来 并不是直角
 static int rotation = 60;// 设定外角
 int rotationX = 00;
 int index = 0;
 @Override
 protected void dispatchDraw(Canvas canvas) {
 int indexleft = getWidth() / 2;//中间显示视图 ----左边的位置
 int postTranslateX = rotationX * childWith / 2 / rotation;//设-----定边移动 距离
 //定点 又称顶点
 // chilDrawforCamera(canvas, postTranslateX, indexleft, 3);//预绘制 的 县绘制 防止遮挡
 for (int i = 0; i < 4; i++)
 chilDrawforCamera(canvas, postTranslateX, indexleft, i);
 if (!isTouch)
 handler.sendEmptyMessageDelayed(1, 100);
 }
 private void setCameraChange(int translate, int roat, int i) {
 switch (i) {
 case 0:
 //预绘制 的VIEW
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.rotateY(-roat);
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.rotateY(-roat);
 mCamera.translate(-translate / 2, 0, 0);
 break;
 //当前位置两侧的View
 case 1:
 mCamera.translate(translate / 2, 0, 0);
 mCamera.rotateY(roat);
 mCamera.translate(translate / 2, 0, 0);
 break;
 case 2:
 mCamera.translate(-translate / 2, 0, 0);
 mCamera.rotateY(-roat);
 mCamera.translate(-translate / 2, 0, 0);
 break;
 //最后绘制 当前显示位置 防止 被遮挡
 case 3:
 mCamera.rotateY(0);
 break;
 }
 }
 boolean isright = false;
 Handler handler = new Handler() {
 @Override
 public void handleMessage(Message msg) {
 switch (msg.what) {
 case 1:
  if (isTouch)
  return;
  if (isright)
  rotationX++;
  else
  rotationX--;
  if (Math.abs(rotationX) == rotation) {
  rotationX = 0;
  index = index % getChildCount();
  if (isright)
  index--;
  else
  index++;
  }
  Rota3DSwithView.this.invalidate();
  break;
 }
 }
 };
 private void chilDrawforCamera(Canvas canvas, int postTranslateX, int indexleft, int i) {
 canvas.save();
 mCamera.save();
 mMaxtrix.reset();
 mCamera.translate(postTranslateX, 0, 0);
 mCamera.rotateY(rotationX);
 mCamera.translate(postTranslateX, 0, 0);
 if (postTranslateX == 0) {
 if (isright)
 setCameraChange(childWith, rotation, i);
 else
 setCameraChange(-childWith, -rotation, i);
 } else if (postTranslateX > 0) {
 setCameraChange(childWith, rotation, i);
 } else if (postTranslateX < 0) {
 setCameraChange(-childWith, -rotation, i);
 }
 mCamera.getMatrix(mMaxtrix);
 mCamera.restore();
 mMaxtrix.preTranslate(-indexleft, -getHeight() / 2);//指定在 屏幕上 运行的棱 是哪一条
 mMaxtrix.postTranslate(indexleft, getHeight() / 2);//运行路径
 canvas.concat(mMaxtrix);
 //绘制
 View childAt = getChildAt((swithView(i) + 2 * getChildCount()) % getChildCount());
 drawChild(canvas, childAt, 0);
 canvas.restore();
 }
 private int swithView(int i) {
 int k = 0;
 switch (i) {
 case 0:
 if (isright)
  k = index - 2;
 else
  k = index + 2;
 break;
 case 1:
 if (isright)
  k = index + 1;
 else
  k = index - 1;
 break;
 case 2:
 if (isright)
  k = index - 1;
 else
  k = index + 1;
 break;
 case 3:
 k = index;
 break;
 }
 return k;
 }
 boolean isTouch = false;
 int downX = 0;
 public boolean dispatchTouchEvent(MotionEvent event) {
 //这里我们就 就只分发给当前index子View
 isTouch = event.getAction() == MotionEvent.ACTION_MOVE;
 if (!onInterceptTouchEvent(event)) {
 index = index % getChildCount();
 return getChildAt((index + getChildCount()) % getChildCount()).dispatchTouchEvent(event);
 }
 return super.dispatchTouchEvent(event);
 }
 int thisRx = 0;
 int thisindex;
 @Override
 public boolean onInterceptTouchEvent(MotionEvent event) {
 switch (event.getAction()) {
 case MotionEvent.ACTION_DOWN:
 downX = (int) event.getX();
 thisindex = index;
 thisRx = rotationX;
 break;
 case MotionEvent.ACTION_MOVE:
 if (Math.abs(event.getX() - downX) > 50) {
  return true /*onTouchEvent(event)*/;
 }
 break;
 }
 return false;
 }
 @Override
 public boolean onTouchEvent(MotionEvent event) {
 int moveX = 0;
 switch (event.getAction()) {
 case MotionEvent.ACTION_DOWN:
 downX = (int) event.getX();
 break;
 case MotionEvent.ACTION_MOVE:
 handler.removeCallbacksAndMessages(null);
 // isTouch = true;
 moveX = (int) event.getX() - downX;
 int moveRx = thisRx + moveX * rotation * 2 / (getWidth() + 100);
 isright = (moveRx > 0) ? true : false;
 int addindex = moveRx / rotation;
 index = thisindex - addindex;
 rotationX = moveRx % rotation;
 System.out.println("===thisRx===" + thisRx + "===moveRx===" + moveRx + "=========addindex=" + addindex);
 Rota3DSwithView.this.invalidate();
 break;
 case MotionEvent.ACTION_UP:
 System.out.println("===ACTION_UP===");
 // isTouch = false;
 handler.removeCallbacksAndMessages(null);
 Rota3DSwithView.this.invalidate();
 break;
 }
 return true;
 }
 public void destory() {
 handler.removeCallbacksAndMessages(null);
 handler = null;
 }
}

附上demo地址

github下载地址

如有疑问可私信交流^_^

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对我们的支持。

(0)

相关推荐

  • android开发教程之listview使用方法

    首先是布局文件,这里需要两个布局文件,一个是放置列表控件的Activity对应的布局文件 main.xml,另一个是ListView中每一行信息显示所对应的布局  list_item.xml    这一步需要注意的问题是ListView 控件的id要使用Android系统内置的 android:id="@android:id/list"   [注意形式] main.xml 复制代码 代码如下: <?xml version="1.0" encoding=&quo

  • Android TV开发:使用RecycleView实现横向的Listview并响应点击事件的代码

    本文讲述了Android TV开发:使用RecycleView实现横向的Listview并响应点击事件的代码.分享给大家供大家参考,具体如下: 1.先贴出自己的效果图(可横向滚动,并响应item点击事件): 2.关于点击事件的实现细节 核心:使用接口回调 在adapter中自己定义了个接口,然后在onBindViewHolder中去为holder.itemView去设置相应的监听最后回调我们设置的监听. class HomeAdapter extends RecyclerView.Adapter

  • Android TV开发:实现3D仿Gallery效果的实例代码

    本文讲述了Android TV开发:实现3D仿Gallery效果的实例代码.分享给大家供大家参考,具体如下: 1.实现效果: 滚动翻页+ 页面点击+页码指示器+焦点控制 2.实现这个效果之前必须要了解 Android高级图片滚动控件实现3D版图片轮播器这篇文章,我是基于他的代码进行修改的,主要为了移植到电视上做了按键事件和焦点控制. 3.具体代码: public class Image3DSwitchView extends LinearLayout { private int currentP

  • android开发之横向滚动/竖向滚动的ListView(固定列头)

    由于项目需要,我们需要一个可以横向滚动的,又可以竖向滚动的 表格.而且又要考虑大数据量(行)的展示视图.经过几天的研究终于搞定,做了一个演示.贴图如下:      好吧.让我们看思路是什么样的: 1. 上下滚动直接使用 listView来实现. 2. 左右滚动使用HorizontalScrollView,来处理滚动.我写一个类MyHScrollView继承 自它. 2.1 . ListView里的每行(row)分为 两部分,不滚动的和可滚动的区域.比如本demo的第一列,就是静态的.而后面的所有

  • Android酷炫动画效果之3D星体旋转效果

    在Android中,如果想要实现3D动画效果一般有两种选择:一是使用Open GL ES,二是使用Camera.Open GL ES使用起来太过复杂,一般是用于比较高级的3D特效或游戏,并且这个也不是开源的,像比较简单的一些3D效果,使用Camera就足够了. 一些熟知的Android 3D动画如对某个View进行旋转或翻转的 Rotate3dAnimation类,还有使用Gallery( Gallery目前已过时,现在都推荐使用 HorizontalScrollView或 RecyclerVi

  • Android使用Rotate3dAnimation实现3D旋转动画效果的实例代码

    利用Android的ApiDemos的Rotate3dAnimation实现了个图片3D旋转的动画,围绕Y轴进行旋转,还可以实现Z轴的缩放.点击开始按钮开始旋转,点击结束按钮停止旋转. 代码如下:: Rotate3dAnimation.java public class Rotate3dAnimation extends Animation { private final float mFromDegrees; private final float mToDegrees; private fi

  • Android RecycleView使用(CheckBox全选、反选、单选)

    本文实例为大家分享了CheckBox全选.反选.单选的具体代码,供大家参考,具体内容如下 MainActiivity package com.bwie.day06; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.Recyc

  • Android编程实现3D立体旋转效果的实例代码

    说明:之前在网上到处搜寻类似的旋转效果 但搜到的结果都不是十分满意 原因不多追述(如果有人找到过相关 比较好的效果 可以发一下连接 一起共同进步) 一 效果展示 : 如非您所需要的效果 也希望能给些微帮助 具体操作以及实现 效果 请看项目例子 二 使用方式 此空间继承与FrameLayout 子空间直接添加如同framelayout 相同 如要如图效果 唯一要求子空间必须位于父控件中心且宽高等大小 为了方便扩展而做 如有其他需求可自行更改 (注 所有子控件 最好添加上背景 由于绘制机制和动画原因

  • Android编程实现3D滑动旋转效果的方法

    本文实例讲述了Android编程实现3D滑动旋转效果的方法.分享给大家供大家参考,具体如下: 这里我们通过代码实现一些滑动翻页的动画效果. Animation实现动画有两个方式:帧动画(frame-by-frame animation)和补间动画(tweened animation) 本示例通过继承Animation自定义Rotate3D,实现3D翻页效果.效果图如下: 1.Rotate3D(Animation) 首先,自定义Animation的3D动画类Rotate3D public clas

  • Android编程实现3D旋转效果实例

    本文实例讲述了Android编程实现3D旋转效果的方法.分享给大家供大家参考,具体如下: 下面的示例是在Android中实现图片3D旋转的效果. 实现3D效果一般使用OpenGL,但在Android平台下可以不直接使用OpenGL,而是使用Camera实现,Camera中原理最终还是使用OpenGL,不过使用Camera比较方便. Camera类似一个摄像机,当物体不动时,我们带着摄像机四处移动,在摄像机里面的画面就会有立体感,就可以从其它的角度观看这个物体.废话不多说,直接看示例. 运行效果如

  • Android利用Flutter实现立体旋转效果

    目录 前言 ImageShader 简介 构建 ui.Image对象 使用 ImageShader 填充形状 立体旋转效果实现 总结 前言 之前我们提到了 CustomPaint er 的 Paint 可以使用渐变(GradientShader)来填充绘制的图形,本篇我们来介绍使用图片填充,并且配合动画实现“立体”旋转效果,之所以给“立体”加上引号,是因为实际是通过填充图片自身的光影效果旋转后看起来像是立体效果一样.下面是实现的效果图. ImageShader 简介 ImageShader 的定

  • Android高仿QQ6.0侧滑删除实例代码

    推荐阅读: 先给大家分享一下,侧滑删除,布局也就是前面一个item,然后有两个隐藏的按钮(TextView也可以),然后我们可以向左侧滑动,然后显示出来,然后对delete(删除键)实现监听,就可以了哈.好了那就来看看代码怎么实现的吧. 首先和之前一样 自定义View,初始化ViewDragHelper: package com.example.removesidepull; import android.content.Context; import android.support.v4.wi

  • Android 中隐藏虚拟按键的方法实例代码

    下面通过一段代码给大家讲解android 隐藏虚拟按键的方法,废话不多说了,大家多多看看代码和注释吧,具体代码如下所示: /** * 隐藏虚拟按键,并且全屏 */ protected void hideBottomUIMenu() { //隐藏虚拟按键,并且全屏 if (Build.VERSION.SDK_INT > 11 && Build.VERSION.SDK_INT < 19) { // lower api View v = this.getWindow().getDec

  • Android判断是否有拍照权限的实例代码

    下面一段代码给大家介绍android判断是否有拍照权限,具体代码如下所示: /** * 返回true 表示可以使用 返回false表示不可以使用 */ public boolean cameraIsCanUse() { boolean isCanUse = true; Camera mCamera = null; try { mCamera = Camera.open(); Camera.Parameters mParameters = mCamera.getParameters(); //针对

  • Android 删除指定包名的App实例代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: /** * check and delete the old package app if it exists. */ private void checkOldPackage() { String packageName = "xxx.xxx.xxx.xxx"; if (isAvilible(this, packageName)) { Intent uninstall_intent = new Intent(); uninstal

  • Android实现空心圆角矩形按钮的实例代码

    页面上有时会用到背景为空心圆角矩形的Button,可以通过xml绘制出来. drawrable文件夹下bg_red_hollow_rectangle.xml <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle&qu

  • Android开发模仿qq视频通话悬浮按钮(实例代码)

    模仿qq视频通话的悬浮按钮的实例代码,如下所示: public class FloatingWindowService extends Service{ private static final String TAG="OnTouchListener"; private static View mView = null; private static WindowManager mWindowManager = null; private static Context mContext

随机推荐