android:QQ多种側滑菜单的实现

在这篇文章中写了

自己定义HorizontalScrollView实现qq側滑菜单

然而这个菜单效果仅仅是普通的側拉效果 我们还能够实现抽屉式側滑菜单 就像这样

第一种效果

另外一种效果

第三种效果

第四种效果

其他代码都和上篇文章同样,仅仅是在MyHorizontalScrollView.class重写onScrollChanged这种方法

第一种的側滑效果代码非常easy

	@Override
	protected void onScrollChanged(int l, int t, int oldl, int oldt) {
		// TODO Auto-generated method stub
		super.onScrollChanged(l, t, oldl, oldt);
		ViewHelper.setTranslationX(mMenu, l);
	}

通过setTranslationX方法设置mMenu的x坐标偏移量 当中的l=getScrollX()

设置完这些就能实现这种側滑效果

另外一种側滑效果代码和第一种类似。仅仅只是是对mMenu的x坐标的偏移量再添加1倍,使得mMenu菜单仿佛从右边出来一样

	@Override
	protected void onScrollChanged(int l, int t, int oldl, int oldt) {
		// TODO Auto-generated method stub
		super.onScrollChanged(l, t, oldl, oldt);
		ViewHelper.setTranslationX(mMenu, 2*l);
	}

第三种側滑效果,我们发现用到了缩放动画,所以要有个0~1的变化率,因为初始的l=getScrollX()=mMenuWidth 。终于的l=0 所以从这里我们能够得到

		//scale 1~0的变化率
		float scale = l*1.0f/mMenuWidth;

代码例如以下

	@Override
	protected void onScrollChanged(int l, int t, int oldl, int oldt) {
		// TODO Auto-generated method stub
		super.onScrollChanged(l, t, oldl, oldt);
		//scale 1~0的变化率
		float scale = l*1.0f/mMenuWidth;
		//Content的缩放比例1~0.7
		float rightScale=scale*0.3f+0.7f;
		//设置缩放中心
		ViewHelper.setPivotX(mContent,0);
		ViewHelper.setPivotY(mContent,mContent.getHeight()/2);
		//进行缩放
		ViewHelper.setScaleX(mContent, rightScale);
		ViewHelper.setScaleY(mContent, rightScale);

	}

至于这里我为什么设置缩放中心为mContent  x=0 y=height/2 是为了在側滑后 mContent左側离屏幕右側的距离不变 否则 距离也会进行缩放

第四种效果我们会发现相比着第三种 不过左側的mMenu的效果不同  会发现 进行了缩放 和透明

代码例如以下

	@Override
	protected void onScrollChanged(int l, int t, int oldl, int oldt) {
		// TODO Auto-generated method stub
		super.onScrollChanged(l, t, oldl, oldt);
		//scale 1~0的变化率
		float scale = l*1.0f/mMenuWidth;
		//Content的缩放比例1~0.7
		float rightScale=scale*0.3f+0.7f;
		//Menu的透明度变化0~1
		float leftAlpha=1.0f-scale;
		//Menu的缩放变化0.3-1.0
		float leftScale=1.0f-scale*0.7f;
		//mContent设置缩放中心
		ViewHelper.setPivotX(mContent,0);
		ViewHelper.setPivotY(mContent,mContent.getHeight()/2);
		//mContent进行缩放
		ViewHelper.setScaleX(mContent, rightScale);
		ViewHelper.setScaleY(mContent, rightScale);

		/*
		 * 对mMenu进行缩放和设置透明度
		 * */
		ViewHelper.setScaleX(mMenu, leftScale);
		ViewHelper.setScaleY(mMenu, leftScale);
		ViewHelper.setAlpha(mMenu, leftAlpha);
	}

就实现了这种效果

这两天我也尝试着进行矩形翻转的效果  模拟器上成功了 在真机上就不行了  就不帖上了 感觉浪费了好多时间  o(︶︿︶)o 唉

关于qqv6.2.3的側拉效果是

我们仅仅要降低mMenu的x坐标的偏移量就能实现  代码例如以下

	@Override
	protected void onScrollChanged(int l, int t, int oldl, int oldt) {
		// TODO Auto-generated method stub
		super.onScrollChanged(l, t, oldl, oldt);
		ViewHelper.setTranslationX(mMenu, l*0.6f);
	}

效果如图:

这几个动画 可能在别人看来非常easy  我想了好久啊啊  一天半的光阴啊啊 万恶的矩阵切换。,。~~NN、DFAGDAJFHJK

看到qq才想起来 今天是我生日  都不敢想它  今年才大二就这么大了 o(︶︿︶)o 唉

生日快乐。

參考:慕课网课程  qq5.0側滑菜单

时间: 2024-11-13 20:23:57

android:QQ多种側滑菜单的实现的相关文章

android側滑菜单-DrawerLayout的基本使用

眼下主流App开发中,部分是以側滑菜单为主布局架构,曾经做android側滑菜单时.大多选择使用github上的第三方开源框架SildingMenu,可是这个框架还是稍显笨重.好消息是google已经开源了一个側滑菜单布局组件:DrawerLayout.DrawerLayout是V4包中的组件.也是直接继承于ViewGroup类.所以这个类也是一个容器类.使用DrawerLayout能够轻松的实现抽屉效果,使用DrawerLayout的步骤有下面1几点: 1)在DrawerLayout中,第一个

Android 使用DrawerLayout高速实现側滑菜单

一.概述 DrawerLayout是一个能够方便的实现Android側滑菜单的组件,我近期开发的项目中也有一个側滑菜单的功能.于是DrawerLayout就派上用场了.假设你从未使用过DrawerLayout.那么本篇博客将使用一个简单的案例带你迅速掌握DrawerLayout的使用方法. 二.效果图 三.代码实现 主布局activity_main.xml <? xml version="1.0" encoding="utf-8"? > <Line

【案例分享】仿QQ5.0側滑菜单ResideMenu

本文由孙国威 原创.如需转载,请注明出处! 为了兴许对这个项目进行优化,比方透明度动画.背景图的位移动画.以及性能上的优化. 我把这个项目上传到github上面,请大家随时关注. github地址https://github.com/sunguowei 近期项目要做一个QQ5.0的側滑菜单效果.和传统的側滑菜单存在着一些差异. 想必大家都已经见识过了. 为了不反复发明轮子,先去github上面搜索了一番. 发现了几个相似的,可是还是有一些不同. 以下是搜索到的相似的开源项目. RESideMen

iOS分组通讯录效果+側滑菜单(MMDrawerController)

前言的废话-能够忽略 自从学会了使用Cocoapod,就欲罢不能了!由于太简单太赞了,不用再把源代码粘到project里了! 參见戴维营博客中的解说:Cocoapod 安装以及使用 先上一下效果图,请原谅我手残录的效果不是非常理想,大致就是这个意思 接下来上代码! 1.通讯录 通讯录基本的就是建立索引栏和section的关联,其次是初始化索引栏数据和每一个section的title.关于索引栏数据,假设写接口的小哥人好的话就会直接帮你返回ABCD-假设非常不幸,接口小哥不给你返回索引栏数据,那就

android:QQ多种侧滑菜单的实现

在这篇文章中写了 自定义HorizontalScrollView实现qq侧滑菜单 然而这个菜单效果只是普通的侧拉效果 我们还可以实现抽屉式侧滑菜单 就像这样 第一种效果 第二种效果 第三种效果 第四种效果 其它代码都和上篇文章相同,只是在MyHorizontalScrollView.class重写onScrollChanged这个方法 第一种的侧滑效果代码很简单 @Override protected void onScrollChanged(int l, int t, int oldl, in

【GitHub-SwipeMenuListView】针对ListView item的側滑菜单

项目地址:https://github.com/baoyongzhang/SwipeMenuListView Usage Step 1:import swipemenulistview.jar Step 2:add activity_main.xml in layout xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://sc

高仿QQ6.0之側滑删除

前两天已经完毕了高仿QQ6.0側滑和优化,今天来看下側滑删除的实现吧,假设有兴趣,能够去看下之前的两篇,仿QQ6.0側滑之ViewDragHelper的使用(一)和高仿QQ6.0側滑菜单之滑动优化(二),好了不多说,開始今天的内容了. 假设看过之前的两篇的话,想必今天的非常好实现的.我们来分析一下哈,側滑删除,布局也就是前面一个item.然后有两个隐藏的button(TextView也能够),然后我们能够向左側滑动,然后显示出来,然后对delete(删除键)实现监听.就能够了哈.好了那就来看看代

Android学习之仿QQ側滑功能的实现

如今项目越来越多的应用了滑动删除的功能,Android本来遵循的是长按删除,IOS定制的是滑动删除,不可否认滑动删除确实在客户体验上要好一点,所以看了非常多关于仿QQ滑动删除的样例,还是感觉代码家的Android Swipe Layout要好一点,至于为何好,以下我给大家实验一下大家就知道了 老规矩.贴上效果图.这样大家才干更近距离的了解 这是代码家的效果图,效果非常多,支持listview.gridview,当然recylerview也是支持的. 可是呢,有个问题,代码家的效果非常多.可是我们

Android自己定义组件系列【3】——自己定义ViewGroup实现側滑

有关自己定义ViewGroup的文章已经非常多了,我为什么写这篇文章,对于刚開始学习的人或者对自己定义组件比較生疏的朋友尽管能够拿来主义的用了,可是要一步一步的实现和了解当中的过程和原理才干真真脱离别人的代码,举一反三却不easy,非常多博主事实上不愿意一步一步的去写,这样非常耗时,可是假设能对读者有帮助,能从这篇文章中学会自己定义组件就达到我的目的了. 第一步:搭建框架来实现一个3/5和2/5分屏的界面,效果例如以下: 最外层是一个自己定义的ViewGroup布局文件例如以下: package