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側滑菜单
最新文章
- 【Unity3d游戏开发】Unity3D中的3D数学基础---向量
- 判断ecshop未付款添加去付款按钮
- 数据结构--栈 codevs 1107 等价表达式
- windows下 更新 android studio SDK 到最新版本 解决方案
- Factorial Trailing Zeroes
- Android:ImageView应用之图片浏览器
- MongoDb的“not master and slaveok=false”错误及解决方法,读写分离
- (转载)oracle的v$sqlarea表
- poi 读取word文档
- 代理IP爬取,计算,发放自动化系统
- [Java算法分析与设计]--线性结构与顺序表(List)的实现应用
- Linux权限管理(week1_day5)--技术流ken
- JavaBean,POJO,VO,DTO的区别和联系
- 大牛的IT经验,方法【跟,帮】
- 使用highlightjs自定义markdown代码高亮
- <;转>;jmeter(十)参数化
- 完整的Django入门指南学习笔记4
- win10关机之后自动重启(系统更新之后出现这个问题)
- fsck 工具 &mdash;&mdash;检查 与修复 Linux系统上的文件系统
- linux中安装typecho的pathinfo配置