作者:itfitness
# 目录
# 效果展示
# 关键知识点
这个三维(三维的缩写)翻转效果的核心其实就是旋转3丹麦信息这个自定义的动画类。
公共类旋转3丹麦信息扩展了动画{ private int mCenterX,mCenterY私人相机麦卡梅拉;私有浮点毫微微度,毫微微度私有AnimationUpdateListener更新listener;private int mWidthpublic AnimationUpdateListener getUpdateListener(){ return updateListener;} public void setUpdateListener(AnimationUpdateListener updateListener){ this。updateListener=updateListener} public Rotate3DAnimation(float MFR omm degrees,float MTO degrees){ this。MFR omm degrees=MFR omm degrees;这个。毫托度数=毫托度数;} @覆盖公共void initialize(int width,int height,int parentWidth,int parent八字){ super.initialize(宽度、高度、parentWidth、parent八字);mWidth=宽度;mCenterX=宽度/2;mCenterY=高度/2;mCamera=新camera();} @覆盖受保护的void applyttransformation(float插值时间,Transformation t){ float degress=mfrommdegrees(插值时间*(MTO degrees-mfromDegrees));if(updateListener!=null){ updatelistener。onprogressupdate(插值时间,度数);}矩阵矩阵=t . getmatrix();麦卡梅拉。save();//让旋转90度的时候不显的太大如果(插值时间=0.5){ mCamera.translate(0,0),(Math.abs(插值时间-1)/0.5f)* mWidth/2);}else { mCamera.translate(0,0),(插值时间/0.5f)* mWidth/2);} //图形绕Y轴旋转mCamera.rotateY(学位);mCamera.getMatrix(矩阵);//将原点移动到中心处矩阵。预翻译(-McEntrex,-McEntrey);矩阵。后置翻译(McEntrex,McEntrey);麦卡梅拉。restore();super.applyTransformation(插值时间,t);}/ * 动画更新的回调 */ public interface AnimationUpdateListener{ /*进度回调*/void OnProgreSupdate(浮点进度,浮点值
); }}我们这里主要是通过对android.graphics.Camera的操作来实现3D的变化,Camera的坐标系为三维左手坐标系,因此我们可以通过操作它来实现一些3D的效果。
接下来我对各段代码进行详细说明。
下面这段代码是为了防止当图像旋转到90度的时候,图像的侧面刚好朝着我们导致看起来过大的问题,因此我们需要将图像沿着Z轴移动一下,就相当于一辆车从你身后往前开你会感觉车越来越小一个道理。
//让旋转90度的时候不显的太大if(interpolatedTime >= 0.5){ mCamera.translate(0,0,(Math.abs(interpolatedTime - 1) / 0.5f) * mWidth / 2);}else { mCamera.translate(0,0,(interpolatedTime / 0.5f) * mWidth / 2);}
不使用此段代码
使用此段代码后
下面这段代码是实现了图像旋转。
//图形绕Y轴旋转mCamera.rotateY(degress);
下面这段代码是为了将原点移动到图像的中心点。
//将原点移动到中心处matrix.preTranslate(-mCenterX,-mCenterY);matrix.postTranslate(mCenterX,mCenterY);
如果不将图像移动到中心点则图像会沿着图像的左边旋转如下:
这里还有一点要注意的是,我们需要将旋转后展示的页面(效果图的反面)提前先反转,这样在旋转后展示反面的时候就不会出现展示镜像的问题了,这里我通过继承FrameLayout并在dispatchDraw增加如下逻辑来实现的。
@Overrideprotected void dispatchDraw(Canvas canvas) { //将整个页面水平翻转,目的是为了抵消外布局翻转后的左右倒置现象 mCamera.save(); canvas.save(); //镜像反转 mCamera.rotateY(180); Matrix matrix = new Matrix(); mCamera.getMatrix(matrix); matrix.preTranslate(-getWidth()/2,-getHeight()/2); matrix.postTranslate(getWidth()/2,getHeight()/2); canvas.setMatrix(matrix); mCamera.restore(); super.dispatchDraw(canvas); canvas.restore();}
# 3D翻转控件的使用方法
Rotate3DLayout内必需包含DefaultLayout(默认展示的页面)和ReverseLayout(翻转后展示的页面),然后以在DefaultLayout和ReverseLayout中进行自己的布局即可。
通过rotate3D方法即可实现翻转。
public class MainActivity extends AppCompatActivity { private Button btRotate; private Rotate3DLayout rlRotate; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); btRotate = (Button) findViewById(R.id.bt_rotate); rlRotate = (Rotate3DLayout) findViewById(R.id.rl_rotate); //点击后翻转 btRotate.setOnClickListener(v->rlRotate.rotate3D()); }}
# 案例源码
_https://gitee.com/itfitness/rotate3d-layout_
# 最后
在这里就还分享一份由大佬亲自收录整理的 Android学习PDF+架构视频+面试文档+源码笔记 ,
高级架构技术进阶脑图、Android开发面试专题资料,高级进阶架构资料
这些都是我现在闲暇时还会反复翻阅的精品资料。里面对近几年的大厂面试高频知识点都有详细的讲解。相信可以有效地帮助大家掌握知识、理解原理,帮助大家在未来取得一份不错的答卷。
当然,你也可以拿去查漏补缺,提升自身的竞争力。
真心希望可以帮助到大家,Android路漫漫,共勉!
如果你有需要的话,只需 私信我【进阶】即可获取