设为首页 加入收藏

TOP

Android 3D滑动菜单完全解析,实现推拉门式的立体特效
2014-11-24 02:36:33 来源: 作者: 【 】 浏览:2
Tags:Android 滑动 菜单 完全 解析 实现 推拉 立体 特效

本文来自:http://blog.csdn.net/guolin_blog/article/detals/10471245


这样说来的话,大家心里会不会痒痒的呢?虽然学习了Camera的用法,但却没有按照自己的理解来实现一套非常炫酷的3D效果。不要着急,今天我就带着大家一起来实现一种3D推拉门式的滑动菜单,而且完全不会借助任何API Demos里面的代码。


关于滑动菜单的文章我也已经写过好几篇了,相信看过的朋友对滑动菜单的实现方式应该都已经比较熟悉了,那么本篇文章的重点就在于,如何在传统滑动菜单的基础上加入推拉门式的立体效果。还不了解滑动菜单如何实现的朋友,可以去翻一翻我之前的文章。


本文示例源码下载


具体下载目录在 /2013年资料/10月/4日/Android 3D滑动菜单完全解析,实现推拉门式的立体特效


首先来讲一下这次的实现原理吧,其实传统的滑动菜单功能就是把菜单部分放在了下面,主布局放在了上面,然后根据手指滑动的距离来偏移主布局,让菜单部分得以显示出来就行了。不过我们这次既然要做推拉门式的立体效果,就需要将传统的思维稍微转变一下,可以先让菜单部分隐藏掉,但却复制一个菜单的镜像并生成一张图片,然后在手指滑动的时候对这张图片进行三维操作,让它产生推拉门式的效果,等滑动操作结束的时候,才让真正的菜单显示出来,然后将这个图片隐藏。原理示意图如下所示:


Android 3D滑动菜单完全解析,实现推拉门式的立体特效


那么下面我们就开始动手实现吧,首先新建一个Android项目,起名叫做ThreeDSlidingLayoutDemo。


然后新建一个Image3dView类继承自View,用于生成镜像图片,以及完成三维操作,代码如下所示:


public class Image3dView extends View {


/**
* 源视图,用于生成图片对象。
*/
private View sourceView;


/**
* 根据传入的源视图生成的图片对象。
*/
private Bitmap sourceBitmap;


/**
* 源视图的宽度。
*/
private float sourceWidth;


/**
* Matrix对象,用于对图片进行矩阵操作。
*/
private Matrix matrix = new Matrix();


/**
* Camera对象,用于对图片进行三维操作。
*/
private Camera camera = new Camera();


/**
* Image3dView的构造函数
*
* @param context
* @param attrs
*/
public Image3dView(Context context, AttributeSet attrs) {
super(context, attrs);
}


/**
* 提供外部接口,允许向Image3dView传入源视图。
*
* @param view
* 传入的源视图
*/
public void setSourceView(View view) {
sourceView = view;
sourceWidth = sourceView.getWidth();
}


/**
* 清除掉缓存的图片对象。
*/
public void clearSourceBitmap() {
if (sourceBitmap != null) {
sourceBitmap = null;
}
}


@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (sourceBitmap == null) {
getSourceBitmap();
}
// 计算图片需要旋转的角度
float degree = 90 - (90 / sourceWidth) * getWidth();
camera.save();
camera.rotateY(degree);
camera.getMatrix(matrix);
camera.restore();
// 将旋转的中心点移动到屏幕左边缘的中间位置
matrix.preTranslate(0, -getHeight() / 2);
matrix.postTranslate(0, getHeight() / 2);
canvas.drawBitmap(sourceBitmap, matrix, null);
}


/**
* 获取源视图对应的图片对象。
*/
private void getSourceBitmap() {
if (sourceView != null) {
sourceView.setDrawingCacheEnabled(true);
sourceView.layout(0, 0, sourceView.getWidth(), sourceView.getHeight());
sourceView.buildDrawingCache();
sourceBitmap = sourceView.getDrawingCache();
}
}


}


相关阅读:


】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
分享到: 
上一篇Java单例模式的简单应用例子 下一篇百度2014校园招聘-研发工程师笔试..

评论

帐  号: 密码: (新用户注册)
验 证 码:
表  情:
内  容: