仿QQ侧滑菜单

一. 实例说明

image.png

二. 关键技术

   使用自定义类 QQMenu 类中的构造方法，View类中的 onMeasure() 方法，onLayout() 方法，用于测量与移动。

• 继承 HorizontalScrollView 类，构造方法初始化计算边距，数值初始化。
• 重写 onMeasure() 设置滚动视图与子视图的宽高。
• 重写 onLayout() 设置初始状态。
• 重写 onTouchEvent() 设置滑动状态。

三. 代码

    private int mScreenWidth;
    private int mMenuRightPadding;
    private int mMenuWidth;
    boolean call = false;
    private LinearLayout mScrollView;
    private ViewGroup mMenu, mContent;


    public QQMenu(Context context, AttributeSet attrs) {
        super(context, attrs);
        //获取窗口管理器服务
        WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
        //创建显示尺寸对象
        DisplayMetrics outMetrics = new DisplayMetrics();
        //获取当前屏幕的宽高
        wm.getDefaultDisplay().getMetrics(outMetrics);
        //为屏幕宽高赋值
        mScreenWidth = outMetrics.widthPixels;
        //将50dp边距转为像素（px）
        mMenuRightPadding = (int) TypedValue.applyDimension(
                TypedValue.COMPLEX_UNIT_DIP, 180,
                context.getResources().getDisplayMetrics());
    }

    //设置滚动视图与子视图的宽高
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        if(!call){                                               //用于设置一次尺寸
            mScrollView = (LinearLayout) getChildAt(0);     //获取滚动视图中的子视图
            mMenu = (ViewGroup) mScrollView.getChildAt(0);  //获取菜单区域
            mContent = (ViewGroup) mScrollView.getChildAt(1);//获取主显示区域
            //设置菜单宽度
            mMenuWidth = mMenu.getLayoutParams().width = mScreenWidth - mMenuRightPadding;
            //设置主主显示区高度
            mContent.getLayoutParams().width = mScreenWidth;
            call = true;
        }
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    protected 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);       //滚动条向右移动，主显示区向左移动
        }
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        int action = ev.getAction();
        switch (action){
            case MotionEvent.ACTION_UP:     //手指抬起
                int scrollX = getScrollX();
                if (scrollX>=mMenuWidth/2){
                    this.scrollTo(mMenuWidth, 0);
                }else{
                    this.scrollTo(0,0);
                }
                return true;
        }
        return super.onTouchEvent(ev);
    }
}

https://github.com/Frioa/My200Application/tree/master/qqmenu