android用最簡單的方法實現QQ5.0的側邊欄滑動效果

標籤：android仿qq5.0   android滑動側邊欄   android   android滑動   android側邊欄   

先看個效果

使用兩個開源項目

開源側邊欄 :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() {@Overridepublic 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 dragbreak;case SlideMenu.STATE_DRAG:break;case SlideMenu.STATE_SCROLL:break;}}@Overridepublic 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 裡面去做,效果都差不多,項目畢竟穩定了,在原有代碼上加個小外殼,不破壞原有邏輯,這樣比較保險一點,當然了也很省事..;

android用最簡單的方法實現QQ5.0的側邊欄滑動效果