Android仿網易用戶端實現抽屜式拖拉菜單介面,android仿網易
前面有寫過一篇文章使用DrawerLayout實現Android仿網易用戶端抽屜模式,昨天從群裡看一哥們問抽屜式拖拉,從主介面的下方出現,而使用DrawerLayout實現的是覆蓋掉主介面,今天我們就來實現一下主介面下方脫出菜單介面,先,方便觀看
啊哦,圖片好大,開始今天的實現
1.繼承HorizontalScrollView,實現自訂控制項
package com.sdufe.thea.guo.view;import com.nineoldandroids.view.ViewHelper;import android.content.Context;import android.util.AttributeSet;import android.util.DisplayMetrics;import android.util.TypedValue;import android.view.MotionEvent;import android.view.ViewGroup;import android.view.WindowManager;import android.widget.HorizontalScrollView;import android.widget.LinearLayout;public class SlidingMenu extends HorizontalScrollView {private LinearLayout mWapper;private ViewGroup mMenu;private ViewGroup mContent;/** * 螢幕寬度 */private int mSreenWidth;/** * 菜單距離右側的寬度,單位dp */private int mMenuRightPadding=100;/** * 菜單寬度 */private int mMenuWidth;/** * 確定onMeasure只繪製一次 */private boolean once;public SlidingMenu(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);WindowManager windowManager = (WindowManager) context.getSystemService(context.WINDOW_SERVICE);DisplayMetrics outMetrics=new DisplayMetrics();windowManager.getDefaultDisplay().getMetrics(outMetrics);mSreenWidth=outMetrics.widthPixels;/** * 把dp轉化成px */mMenuRightPadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 100, getResources().getDisplayMetrics());}public SlidingMenu(Context context, AttributeSet attrs) {this(context, attrs, 0);}public SlidingMenu(Context context) {this(context, null);}/** * 確定寬高 */@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);if (!once) {mWapper=(LinearLayout) getChildAt(0);mMenu=(ViewGroup) mWapper.getChildAt(0);mContent=(ViewGroup) mWapper.getChildAt(1);/** * 菜單設定寬度 */mMenuWidth=mMenu.getLayoutParams().width=mSreenWidth-mMenuRightPadding;/** * 內容設定寬度 */mContent.getLayoutParams().width=mSreenWidth;once=true;}}/** * 設定位移量,隱藏menu */@Overrideprotected void onLayout(boolean changed, int l, int t, int r, int b) {super.onLayout(changed, l, t, r, b);if (changed) {/** * 瞬間完成隱藏 */this.scrollTo(mMenuWidth, 0);}}@Overridepublic boolean onTouchEvent(MotionEvent ev) {switch (ev.getAction()) {case MotionEvent.ACTION_UP:/** * 隱藏部分寬度 */int scroll=getScrollX();if (scroll>mMenuWidth/2) {/** * 動畫實現隱藏 */smoothScrollTo(mMenuWidth, 0);}else {/** * 動畫實現顯示 */smoothScrollTo(0, 0);}return true;}return super.onTouchEvent(ev);}/** * 通過onScrollChanged實現抽屜式滑動 */@Overrideprotected void onScrollChanged(int l, int t, int oldl, int oldt) {super.onScrollChanged(l, t, oldl, oldt);ViewHelper.setTranslationX(mMenu, l);}}
在建構函式中獲得螢幕的寬度以及將dp為單位的mMenuRightPadding轉化為px
onMeasure中給寬高賦值
onLayout中確定位置
onTouch中控制手勢
onScrollChanged實現抽屜式動畫,這裡引用了nineold動畫包,相容3.0一下版本
剩餘的部分代碼中注釋都說的很清楚了,這裡就不在扯淡了,到此差不多就實現了,下面就是使用了,
<com.sdufe.thea.guo.view.SlidingMenu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" > <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" > <include layout="@layout/layout_menu" /> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/monkey" android:orientation="vertical" > </LinearLayout> </LinearLayout></com.sdufe.thea.guo.view.SlidingMenu>
ok,結束,以上代碼修改自鴻洋的qq側滑,略有不同而已
代碼:http://download.csdn.net/detail/elinavampire/8276537