第3例：仿QQ滑动菜单

核心思想知识点：
1）、 自定义view的基本流程
2）、getScrollX()方法的理解以及使用

效果图如下

GIF.gif

功能实现过程

1、left_menu.xml（左侧菜单布局）

btn_bg.xml

2、QQMenu.java（自定义HorizontalScrollView）

public class QQMenu extends HorizontalScrollView {

    private static final String TAG = QQMenu.class.getSimpleName();
    private LinearLayout mScrollView;            //定义横向滚动条布局
    private ViewGroup mMenu;                 //定义菜单区域
    private ViewGroup mContent;             //定义主显示区域
    private int mScreenWidth;              //定义屏幕宽度
    private int mMenuRightPadding = 50;   //定义菜单右边距为50dp
    private boolean call;                   //定义只设置一次自己和子视图的宽和高
    private int mMenuWidth;                 //定义菜单宽度

    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, 50,
                context.getResources().getDisplayMetrics());

    }


    //设置滚动视图与子视图的宽和高
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        Log.d(TAG,"onMeasure==============");
        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;

            Log.d(TAG,"mScreenWidth========="+mScreenWidth);
            Log.d(TAG,"mMenuWidth========="+mMenuWidth);
        }
        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) {
            Log.d(TAG,"onLayout==============");
            //默认的布局：隐藏菜单栏、显示主内容区域
            this.scrollTo(mMenuWidth, 0);    //滚动条向右移动，主显示区域向左移动
        }
    }



    //判断手指抬起时隐藏菜单还是显示菜单
    //理解getScrollX()方法的含义：https://blog.csdn.net/znouy/article/details/51338256
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        int action = ev.getAction();
        switch (action) {
            case MotionEvent.ACTION_UP:
                Log.d(TAG,"onTouchEvent========MotionEvent.ACTION_UP=======");
                int scrollX = getScrollX();                 //隐藏左边的宽度
                Log.d(TAG,"scrollX========="+scrollX);
                Log.d(TAG,"mMenuWidth / 2========="+mMenuWidth / 2);
                if (scrollX >= mMenuWidth / 2) {             //如果隐藏左边的宽度大于菜单宽度的1/2时
                    this.smoothScrollTo(mMenuWidth, 0);        //隐藏菜单
                    Log.d(TAG,"隐藏菜单=============");
                } else {
                    this.smoothScrollTo(0, 0);              //显示菜单
                    Log.d(TAG,"显示菜单=============");
                }
                return true;
        }
        return super.onTouchEvent(ev);
    }

}

3、activity_main.xml（主布局文件）

4、MainActivity.java

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

对getScrollX()的分析

结合上面代码的Log代码，注意看scrollX数值的变化，从而理解getScrollX()方法的含义

image.png

理解getScrollX()方法的参考文章

https://blog.csdn.net/znouy/article/details/51338256