android用最简略的方法实现QQ5.0的侧边栏滑动效果

android用最简单的方法实现QQ5.0的侧边栏滑动效果

先看个效果

android用最简略的方法实现QQ5.0的侧边栏滑动效果


使用两个开源项目

开源侧边栏 :me.tangke.slidemenu 

开源动画:nineoldandroids-2.4.0.jar

在项目里我使用的是左边activity,右边activity的样式,activityGroup的方式,如果全用Fragment也是一样的,只要获取Fragment的rootView即可;

滑动时用me.tangke.slidemenu是为获取拖动屏幕的比例,其他的菜单栏也可以使用,只是加个动画;


界面所有逻辑代码不动,使用nineoldandroids为菜单栏添加类似QQ5.0的侧边栏滑动效果的动画;


获取侧边栏滑动比例,我用的这个菜单栏,出现侧边栏到菜单栏消失,比例为0.000.. -> 1.000..,所以在其滑动过程中添加个动画,一切OK;

主要代码如下:

	mSlideMenu.setOnSlideStateChangeListener(new OnSlideStateChangeListener() {
			
			@Override
			public void onSlideStateChange(int slideState) {
				switch (slideState) {
				default:
				case SlideMenu.STATE_CLOSE:
					isMenuShowing=false;
					break;
				case SlideMenu.STATE_OPEN_LEFT:
				case SlideMenu.STATE_OPEN_RIGHT:
					isMenuShowing=true;//here drag
					break;
				case SlideMenu.STATE_DRAG:
					break;
				case SlideMenu.STATE_SCROLL:
					break;
				}
			}
			
			@Override
			public void onSlideOffsetChange(float offsetPercent) {
				//添加动画效果
				ViewHelper.setAlpha(mSlideMenuView, 0.7f + 0.3f * offsetPercent);
				ViewHelper.setScaleX(mSlideMenuView, offsetPercent*0.1f+0.9f);
				ViewHelper.setScaleY(mSlideMenuView, offsetPercent*0.1f+0.9f);
				ViewHelper.setTranslationX(mSlideMenuView, -(1-offsetPercent)*100);

				ViewHelper.setPivotX(mSlideContentView, 0);
				ViewHelper.setScaleX(mSlideContentView, 0.5f - offsetPercent*0.3f+0.5f);
				ViewHelper.setPivotY(mSlideContentView, mSlideContentView.getHeight()/2.0f);
				ViewHelper.setScaleY(mSlideContentView, 0.5f - offsetPercent*0.3f+0.5f);
			}
		});

主界面布局:

我这里是随便加的一个灰色的作为背景

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:slidemenu="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root_View"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/text_gray_lite" >

    <me.tangke.slidemenu.SlideMenu
        android:id="@+id/slideMenu"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>
有很多侧边栏的源码是在OnMeasure里面和 onScroll 里面去做,效果都差不多,项目毕竟稳定了,在原有代码上加个小外壳,不破坏原有逻辑,这样比较保险一点,当然了也很省事..;