Android

关注公众号 jb51net

关闭
首页 > 软件编程 > Android > android实现侧滑菜单

代码分析Android实现侧滑菜单

投稿:mrr

现在app越来越注重用户体验,本文给大家分析android实现侧滑菜单的代码,代码简单易懂,感兴趣的朋友一起看看吧

Android 侧滑菜单的实现,参考网上的代码,实现侧滑菜单。最重要的是这个动画类UgcAnimations,如何使用动画类来侧滑的封装FlipperLayout。

1、实现效果

2、动画类UgcAnimations

package com.mmsx.base; 
import android.content.Context; 
import android.view.View; 
import android.view.ViewGroup.MarginLayoutParams; 
import android.view.animation.AlphaAnimation; 
import android.view.animation.Animation; 
import android.view.animation.AnimationSet; 
import android.view.animation.AnticipateInterpolator; 
import android.view.animation.OvershootInterpolator; 
import android.view.animation.RotateAnimation; 
import android.view.animation.ScaleAnimation; 
import android.view.animation.TranslateAnimation; 
import android.widget.ImageView; 
import android.widget.RelativeLayout; 
 
/** 
 * Path动画类 
 * 
 */ 
public class UgcAnimations { 
  private static int xOffset = 15; 
  private static int yOffset = -13; 
 
  public static void initOffset(Context context) { 
    xOffset = (int) (15 * context.getResources().getDisplayMetrics().density); 
    yOffset = -(int) (13 * context.getResources().getDisplayMetrics().density); 
  } 
 
  public static Animation getRotateAnimation(float fromDegrees, 
      float toDegrees, long durationMillis) { 
    RotateAnimation rotate = new RotateAnimation(fromDegrees, toDegrees, 
        Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 
        0.5f); 
    rotate.setDuration(durationMillis); 
    rotate.setFillAfter(true); 
    return rotate; 
  } 
 
  public static Animation getAlphaAnimation(float fromAlpha, float toAlpha, 
      long durationMillis) { 
    AlphaAnimation alpha = new AlphaAnimation(fromAlpha, toAlpha); 
    alpha.setDuration(durationMillis); 
    alpha.setFillAfter(true); 
    return alpha; 
  } 
 
  public static Animation getScaleAnimation(long durationMillis) { 
    ScaleAnimation scale = new ScaleAnimation(1.0f, 1.5f, 1.0f, 1.5f, 
        Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 
        0.5f); 
    scale.setDuration(durationMillis); 
    return scale; 
  } 
 
  public static Animation getTranslateAnimation(float fromXDelta, 
      float toXDelta, float fromYDelta, float toYDelta, 
      long durationMillis) { 
    TranslateAnimation translate = new TranslateAnimation(fromXDelta, 
        toXDelta, fromYDelta, toYDelta); 
    translate.setDuration(durationMillis); 
    translate.setFillAfter(true); 
    return translate; 
  } 
 
  public static void startOpenAnimation(RelativeLayout relativeLayout, 
      ImageView background, ImageView menu, long durationMillis) { 
    background.setVisibility(View.VISIBLE); 
    relativeLayout.setVisibility(View.VISIBLE); 
    background.startAnimation(getAlphaAnimation(0f, 1f, durationMillis)); 
    menu.startAnimation(getRotateAnimation(0, 90, durationMillis)); 
    for (int i = 0; i < relativeLayout.getChildCount(); i++) { 
      ImageView imageView = (ImageView) relativeLayout.getChildAt(i); 
      imageView.setVisibility(View.VISIBLE); 
      MarginLayoutParams params = (MarginLayoutParams) imageView 
          .getLayoutParams(); 
      AnimationSet set = new AnimationSet(true); 
      set.addAnimation(getRotateAnimation(-270, 0, durationMillis)); 
      set.addAnimation(getAlphaAnimation(0.5f, 1.0f, durationMillis)); 
      set.addAnimation(getTranslateAnimation( 
          -params.leftMargin + xOffset, 0f, params.bottomMargin 
              + yOffset, 0f, durationMillis)); 
      set.setFillAfter(true); 
      set.setDuration(durationMillis); 
      set.setStartOffset((i * 100) 
          / (-1 + relativeLayout.getChildCount())); 
      set.setInterpolator(new OvershootInterpolator(1f)); 
      imageView.startAnimation(set); 
    } 
  } 
  public static void startCloseAnimation(final RelativeLayout relativeLayout, 
      final ImageView background, ImageView menu, long durationMillis) { 
    background.startAnimation(getAlphaAnimation(1f, 0f, durationMillis)); 
    menu.startAnimation(getRotateAnimation(90, 0, durationMillis)); 
    for (int i = 0; i < relativeLayout.getChildCount(); i++) { 
      final ImageView imageView = (ImageView) relativeLayout 
          .getChildAt(i); 
      MarginLayoutParams params = (MarginLayoutParams) imageView 
          .getLayoutParams(); 
      AnimationSet set = new AnimationSet(true); 
      set.addAnimation(getRotateAnimation(0, -270, durationMillis)); 
      set.addAnimation(getAlphaAnimation(1.0f, 0.5f, durationMillis)); 
      set.addAnimation(getTranslateAnimation(0f, -params.leftMargin 
          + xOffset, 0f, params.bottomMargin + yOffset, 
          durationMillis)); 
      set.setFillAfter(true); 
      set.setDuration(durationMillis); 
      set.setStartOffset(((relativeLayout.getChildCount() - i) * 100) 
          / (-1 + relativeLayout.getChildCount())); 
      set.setInterpolator(new AnticipateInterpolator(1f)); 
      set.setAnimationListener(new Animation.AnimationListener() { 
        public void onAnimationStart(Animation arg0) { 
        } 
        public void onAnimationRepeat(Animation arg0) { 
        } 
        public void onAnimationEnd(Animation arg0) { 
          relativeLayout.setVisibility(View.GONE); 
          background.setVisibility(View.GONE); 
        } 
      }); 
      imageView.startAnimation(set); 
    } 
  } 
  public static Animation clickAnimation(long durationMillis) { 
    AnimationSet set = new AnimationSet(true); 
    set.addAnimation(getAlphaAnimation(1.0f, 0.3f, durationMillis)); 
    set.addAnimation(getScaleAnimation(durationMillis)); 
    set.setDuration(durationMillis); 
    return set; 
  } 
} 

3、封装使用动画类FlipperLayout

package com.mmsx.base; 
import android.content.Context; 
import android.util.AttributeSet; 
import android.util.TypedValue; 
import android.view.MotionEvent; 
import android.view.VelocityTracker; 
import android.view.View; 
import android.view.ViewConfiguration; 
import android.view.ViewGroup; 
import android.widget.Scroller; 
 
/** 
 * 自己重写的ViewGroup,用与滑动切换界面使用,代码不详解,慢点看的话应该能看懂的... 
 */ 
public class FlipperLayout extends ViewGroup { 
 
  private Scroller mScroller; 
  private VelocityTracker mVelocityTracker; 
  private int mWidth; 
 
  public static final int SCREEN_STATE_CLOSE = 0; 
  public static final int SCREEN_STATE_OPEN = 1; 
  public static final int TOUCH_STATE_RESTART = 0; 
  public static final int TOUCH_STATE_SCROLLING = 1; 
  public static final int SCROLL_STATE_NO_ALLOW = 0; 
  public static final int SCROLL_STATE_ALLOW = 1; 
  private int mScreenState = 0; 
  private int mTouchState = 0; 
  private int mScrollState = 0; 
  private int mVelocityValue = 0; 
  private boolean mOnClick = false; 
  private onUgcDismissListener mOnUgcDismissListener; 
  private onUgcShowListener mOnUgcShowListener; 
 
  public FlipperLayout(Context context) { 
    super(context); 
    mScroller = new Scroller(context); 
    mWidth = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 
        54, getResources().getDisplayMetrics()); 
 
  } 
 
  public FlipperLayout(Context context, AttributeSet attrs, int defStyle) { 
    super(context, attrs, defStyle); 
  } 
 
  public FlipperLayout(Context context, AttributeSet attrs) { 
    super(context, attrs); 
  } 
 
  protected void onLayout(boolean changed, int l, int t, int r, int b) { 
    for (int i = 0; i < getChildCount(); i++) { 
      View child = getChildAt(i); 
      int height = child.getMeasuredHeight(); 
      int width = child.getMeasuredWidth(); 
      child.layout(0, 0, width, height); 
    } 
  } 
 
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
    int width = MeasureSpec.getSize(widthMeasureSpec); 
    int height = MeasureSpec.getSize(heightMeasureSpec); 
    setMeasuredDimension(width, height); 
    for (int i = 0; i < getChildCount(); i++) { 
      getChildAt(i).measure(widthMeasureSpec, heightMeasureSpec); 
    } 
  } 
 
  public boolean dispatchTouchEvent(MotionEvent ev) { 
    obtainVelocityTracker(ev); 
    switch (ev.getAction()) { 
    case MotionEvent.ACTION_DOWN: 
      mTouchState = mScroller.isFinished() ? TOUCH_STATE_RESTART 
          : TOUCH_STATE_SCROLLING; 
      if (mTouchState == TOUCH_STATE_RESTART) { 
        int x = (int) ev.getX(); 
        int screenWidth = getWidth(); 
        if (x <= mWidth && mScreenState == SCREEN_STATE_CLOSE 
            && mTouchState == TOUCH_STATE_RESTART 
            || x >= screenWidth - mWidth 
            && mScreenState == SCREEN_STATE_OPEN 
            && mTouchState == TOUCH_STATE_RESTART) { 
          if (mScreenState == SCREEN_STATE_OPEN) { 
            mOnClick = true; 
          } 
          mScrollState = SCROLL_STATE_ALLOW; 
        } else { 
          mOnClick = false; 
          mScrollState = SCROLL_STATE_NO_ALLOW; 
        } 
      } else { 
        return false; 
      } 
      break; 
    case MotionEvent.ACTION_MOVE: 
      mVelocityTracker.computeCurrentVelocity(1000, 
          ViewConfiguration.getMaximumFlingVelocity()); 
      if (mScrollState == SCROLL_STATE_ALLOW 
          && getWidth() - (int) ev.getX() < mWidth) { 
        return true; 
      } 
      break; 
    case MotionEvent.ACTION_UP: 
      releaseVelocityTracker(); 
      if (mOnClick) { 
        mOnClick = false; 
        mScreenState = SCREEN_STATE_CLOSE; 
        mScroller.startScroll(getChildAt(1).getScrollX(), 0, 
            -getChildAt(1).getScrollX(), 0, 800); 
        invalidate(); 
      } 
      break; 
    } 
    return super.dispatchTouchEvent(ev); 
  } 
 
  public boolean onInterceptTouchEvent(MotionEvent ev) { 
    obtainVelocityTracker(ev); 
    switch (ev.getAction()) { 
    case MotionEvent.ACTION_DOWN: 
      mTouchState = mScroller.isFinished() ? TOUCH_STATE_RESTART 
          : TOUCH_STATE_SCROLLING; 
      if (mTouchState == TOUCH_STATE_SCROLLING) { 
        return false; 
      } 
      break; 
 
    case MotionEvent.ACTION_MOVE: 
      mOnClick = false; 
      mVelocityTracker.computeCurrentVelocity(1000, 
          ViewConfiguration.getMaximumFlingVelocity()); 
      if (mScrollState == SCROLL_STATE_ALLOW 
          && Math.abs(mVelocityTracker.getXVelocity()) > 200) { 
        return true; 
      } 
      break; 
 
    case MotionEvent.ACTION_UP: 
      releaseVelocityTracker(); 
      if (mScrollState == SCROLL_STATE_ALLOW 
          && mScreenState == SCREEN_STATE_OPEN) { 
        return true; 
      } 
      break; 
    } 
    return super.onInterceptTouchEvent(ev); 
  } 
 
  public boolean onTouchEvent(MotionEvent event) { 
    obtainVelocityTracker(event); 
    switch (event.getAction()) { 
    case MotionEvent.ACTION_DOWN: 
      mTouchState = mScroller.isFinished() ? TOUCH_STATE_RESTART 
          : TOUCH_STATE_SCROLLING; 
      if (mTouchState == TOUCH_STATE_SCROLLING) { 
        return false; 
      } 
      break; 
 
    case MotionEvent.ACTION_MOVE: 
      mVelocityTracker.computeCurrentVelocity(1000, 
          ViewConfiguration.getMaximumFlingVelocity()); 
      mVelocityValue = (int) mVelocityTracker.getXVelocity(); 
      getChildAt(1).scrollTo(-(int) event.getX(), 0); 
      break; 
 
    case MotionEvent.ACTION_UP: 
      if (mScrollState == SCROLL_STATE_ALLOW) { 
        if (mVelocityValue > 2000) { 
          mScreenState = SCREEN_STATE_OPEN; 
          mScroller 
              .startScroll( 
                  getChildAt(1).getScrollX(), 
                  0, 
                  -(getWidth() 
                      - Math.abs(getChildAt(1) 
                          .getScrollX()) - 
 
                  mWidth), 0, 250); 
          invalidate(); 
 
        } else if (mVelocityValue < -2000) { 
          mScreenState = SCREEN_STATE_CLOSE; 
          mScroller.startScroll(getChildAt(1).getScrollX(), 0, 
              -getChildAt(1).getScrollX(), 0, 250); 
          invalidate(); 
        } else if (event.getX() < getWidth() / 2) { 
          mScreenState = SCREEN_STATE_CLOSE; 
          mScroller.startScroll(getChildAt(1).getScrollX(), 0, 
              -getChildAt(1).getScrollX(), 0, 800); 
          invalidate(); 
        } else { 
          mScreenState = SCREEN_STATE_OPEN; 
          mScroller 
              .startScroll( 
                  getChildAt(1).getScrollX(), 
                  0, 
                  -(getWidth() 
                      - Math.abs(getChildAt(1) 
                          .getScrollX()) - 
 
                  mWidth), 0, 800); 
          invalidate(); 
        } 
      } 
      break; 
    } 
    return super.onTouchEvent(event); 
  } 
 
  public void open() { 
    mTouchState = mScroller.isFinished() ? TOUCH_STATE_RESTART 
        : TOUCH_STATE_SCROLLING; 
    if (mTouchState == TOUCH_STATE_RESTART) { 
      mScreenState = SCREEN_STATE_OPEN; 
      mScroller.startScroll(getChildAt(1).getScrollX(), 0, -(getWidth() 
          - Math.abs(getChildAt(1).getScrollX()) - 
 
      mWidth), 0, 800); 
      invalidate(); 
    } 
  } 
 
  //关闭当前的侧滑菜单,用view打开点击事件的页面 
  public void close(View view) { 
    mScreenState = SCREEN_STATE_CLOSE; 
    mScroller.startScroll(getChildAt(1).getScrollX(), 0, -getChildAt(1) 
        .getScrollX(), 0, 800); 
    invalidate(); 
    setContentView(view); 
  } 
 
  public void computeScroll() { 
    super.computeScroll(); 
    if (mScroller.computeScrollOffset()) { 
      getChildAt(1).scrollTo(mScroller.getCurrX(), mScroller.getCurrY()); 
      postInvalidate(); 
    } else { 
      if (mScreenState == SCREEN_STATE_OPEN) { 
        if (mOnUgcDismissListener != null) { 
          mOnUgcDismissListener.dismiss(); 
        } 
      } else if (mScreenState == SCREEN_STATE_CLOSE) { 
        if (mOnUgcShowListener != null) { 
          mOnUgcShowListener.show(); 
        } 
      } 
    } 
  } 
  private void obtainVelocityTracker(MotionEvent event) { 
    if (mVelocityTracker == null) { 
      mVelocityTracker = VelocityTracker.obtain(); 
    } 
    mVelocityTracker.addMovement(event); 
  } 
  private void releaseVelocityTracker() { 
    if (mVelocityTracker != null) { 
      mVelocityTracker.recycle(); 
      mVelocityTracker = null; 
    } 
  } 
  public int getScreenState() { 
    return mScreenState; 
  } 
  public void setContentView(View view) { 
    removeViewAt(1); 
    addView(view, 1, getLayoutParams()); 
  } 
  public interface OnOpenListener { 
    public abstract void open(); 
  } 
  public interface OnCloseListener { 
    public abstract void close(); 
  } 
  public interface onUgcDismissListener { 
    public abstract void dismiss(); 
  } 
  public interface onUgcShowListener { 
    public abstract void show(); 
  } 
  public void setOnUgcDismissListener( 
      onUgcDismissListener onUgcDismissListener) { 
    mOnUgcDismissListener = onUgcDismissListener; 
  } 
  public void setOnUgcShowListener(onUgcShowListener onUgcShowListener) { 
    mOnUgcShowListener = onUgcShowListener; 
  } 
} 

4、主界面MainActivity

package com.mmsx.activity;  
import com.mmsx.activity.SideslipMenu.onChangeViewListener; 
import com.mmsx.activity.SideslipOther.onDataListener; 
import com.mmsx.base.FlipperLayout; 
import com.mmsx.base.FlipperLayout.OnOpenListener; 
import com.mmsx.base.ViewUtil; 
import android.os.Bundle; 
import android.app.Activity; 
import android.view.ViewGroup.LayoutParams; 
import android.widget.Toast; 
 
public class MainActivity extends Activity implements OnOpenListener{ 
 
  //侧滑主要控制类,设置跟布局 
  private FlipperLayout mRoot; 
  //侧滑的默认界面,主界面 
  private SideslipHome mHome; 
  //侧滑的菜单,进行选择的 
  private SideslipMenu mSideslipMenu; 
  //其他菜单列表选择的效果 
  private SideslipOther mOther; 
  //退出时间间隔变量 
  private long mExitTime; 
  //时间间隔2s 
  private static final int INTERVAL = 2000; 
  //侧滑菜单选中的item 
  private int mViewPosition; 
  //侧滑传递的标题 
  private String mstrTitle; 
  @Override 
  protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
     //创建容器,并设置全屏大小 
    mRoot = new FlipperLayout(this); 
    //布局的参数 
    LayoutParams params = new LayoutParams(LayoutParams.FILL_PARENT, 
        LayoutParams.FILL_PARENT); 
    mRoot.setLayoutParams(params); 
    //创建菜单界面和内容首页界面,并添加到容器中,用于初始显示 
    mHome = new SideslipHome(this, this); 
    mSideslipMenu = new SideslipMenu(this); 
    mRoot.addView(mSideslipMenu.getView(), params); 
    mRoot.addView(mHome.getView(), params); 
    //设置跟布局 
    setContentView(mRoot); 
    //设置监听 
    setListener(); 
  } 
 
  //设置监听 
  private void setListener() { 
    mHome.setOnOpenListener(this); 
     //监听菜单界面切换显示内容(onChangeViewListener接口在SideslipMenu中定义) 
    mSideslipMenu.setOnChangeViewListener(new onChangeViewListener() { 
       
      public void onChangeView(int arg0) { 
        mViewPosition = arg0; 
        mOther = new SideslipOther(MainActivity.this); 
        switch (arg0) { 
        case ViewUtil.HOME: 
          mRoot.close(mHome.getView()); 
          break; 
        case ViewUtil.MESSAGE: 
          mstrTitle = "消息"; 
          //设置数据接口监听 
          mOther.setDataTitle(new DataTitle()); 
          mRoot.close(mOther.getView()); 
          break; 
        case ViewUtil.FRIENDS: 
          mstrTitle = "好友"; 
          mOther.setDataTitle(new DataTitle()); 
          mRoot.close(mOther.getView()); 
          break; 
        case ViewUtil.PHOTO: 
          mstrTitle = "照片"; 
          mOther.setDataTitle(new DataTitle()); 
          mRoot.close(mOther.getView()); 
          break; 
        case ViewUtil.VIEWED: 
          mstrTitle = "转帖"; 
          mOther.setDataTitle(new DataTitle()); 
          mRoot.close(mOther.getView()); 
          break; 
        case ViewUtil.GIFTS: 
          mstrTitle = "礼物"; 
          mOther.setDataTitle(new DataTitle()); 
          mRoot.close(mOther.getView()); 
          break; 
        case ViewUtil.RECOMMEND: 
          mstrTitle = "游戏"; 
          mOther.setDataTitle(new DataTitle()); 
          mRoot.close(mOther.getView()); 
          break; 
        case ViewUtil.LBS: 
          mstrTitle = "附近 "; 
          mOther.setDataTitle(new DataTitle()); 
          mRoot.close(mOther.getView()); 
          break; 
        default: 
          break; 
        } 
      } 
    }); 
  } 
   
  //传递数据到侧滑选中的页面 
  private class DataTitle implements onDataListener{ 
    @Override 
    public String getDataTitle() { 
      return mstrTitle; 
    } 
     
  } 
 
  @Override 
  public void open() { 
    if (mRoot.getScreenState() == FlipperLayout.SCREEN_STATE_CLOSE) { 
      mRoot.open(); 
    } 
  } 
   
  /** 
   * 返回键监听 
   */ 
  public void onBackPressed() { 
    /** 
     * 如果界面的path菜单没有关闭时,先将path菜单关闭,否则则判断两次返回时间间隔,小于两秒则退出程序 
     */ 
    if (mRoot.getScreenState() == FlipperLayout.SCREEN_STATE_OPEN) { 
      if (mSideslipMenu.getUgcIsShowing()) { 
        mSideslipMenu.closeUgc(); 
      } else { 
        exit(); 
      } 
    } else { 
      switch (mViewPosition) { 
      case ViewUtil.HOME: 
        if (mHome.getUgcIsShowing()) { 
          mHome.closeUgc(); 
        } else { 
          exit(); 
        } 
        break; 
      default: 
        exit(); 
        break; 
      } 
 
    } 
 
  }   
  /** 
   * 判断两次返回时间间隔,小于两秒则退出程序 
   */ 
  private void exit() { 
    if (System.currentTimeMillis() - mExitTime > INTERVAL) { 
      Toast.makeText(this, "再按一次返回键,可直接退出程序", Toast.LENGTH_SHORT).show(); 
      mExitTime = System.currentTimeMillis(); 
    } else { 
      finish(); 
      android.os.Process.killProcess(android.os.Process.myPid()); 
      System.exit(0); 
    } 
  } 
}

5、SideslipHome

package com.mmsx.activity; 
import com.mmsx.base.FlipperLayout.OnOpenListener; 
 
import android.app.Activity; 
import android.content.Context; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.widget.TextView; 
 
public class SideslipHome { 
  private Context mContext; 
  private Activity mActivity; 
  private View mHomeView; 
  private boolean mUgcIsShowing = false;  
  private OnOpenListener mOnOpenListener; 
  public SideslipHome(Context context, Activity activity) { 
    mContext = context; 
    mActivity = activity; 
    mHomeView = LayoutInflater.from(context).inflate(R.layout.sideslip_home, null); 
     
    initUI(); 
  } 
 
  private void initUI() { 
    TextView ivTitleName = (TextView)mHomeView.findViewById(R.id.ivTitleName);  
    ivTitleName.setText("主页动态"); 
     
  } 
   
  public void setOnOpenListener(OnOpenListener onOpenListener) { 
    mOnOpenListener = onOpenListener; 
  } 
 
  public View getView() { 
    return mHomeView; 
  } 
   
  /** 
   * 获取Path菜单显示状态 
   */ 
  public boolean getUgcIsShowing() { 
    return mUgcIsShowing; 
  } 
 
  /** 
   * 关闭Path菜单 
   */ 
  public void closeUgc() { 
    mUgcIsShowing = false; 
  } 
 
} 

好了,以上就是本文的全部叙述,希望大家喜欢。

您可能感兴趣的文章:
阅读全文