侧滑菜单的功能实现

来源:互联网 发布:狼雨seo官网 编辑:程序博客网 时间:2024/06/04 19:14

当我们在做一些项目的时候,经常会需要用到侧滑菜单的功能,当但是对于一些刚做android开发的同学来说,有时候会碰到些困难,我写下自己的一些心得,如果有些有缘的同学看到,希望可以给予一点启发。

1 首先我们需要下载一个jar包。
这里写图片描述

2 然后放到我们项目的libs文件夹中,然后 add as library,这样就把这个jar包添加到我们的项目中了,我们就可以使用了

3 然后再我们需要使用侧滑功能的布局文件的根节点处使用SlidingMenu控件。。如图
这里写图片描述

4 然后定义我们的侧滑菜单的布局文件。

5 然后将侧滑菜单的布局文件添加到主布局中,
这里写图片描述
这样就已经成功的将我们的侧滑菜单加入到我们打主布局中了

6 最后自定义我们自己的SlidingMenu这个类
我仅将自己的代码做个示例

    package com.chitongsoft.fbdj.ui.widget;import android.content.Context;import android.content.res.TypedArray;import android.util.AttributeSet;import android.util.TypedValue;import android.view.MotionEvent;import android.view.ViewGroup;import android.widget.HorizontalScrollView;import android.widget.LinearLayout;import com.chitongsoft.fbdj.R;import com.chitongsoft.fbdj.utils.ScreenUtils;import com.nineoldandroids.view.ViewHelper;public class SlidingMenu extends HorizontalScrollView {    /**     * 屏幕宽度     */    private int mScreenWidth;    /**     * dp     */    private int mMenuRightPadding;    /**     * 菜单的宽度     */    private int mMenuWidth;    private int mHalfMenuWidth;    private boolean isOpen;    private boolean once;    private ViewGroup mMenu;    private ViewGroup mContent;    public SlidingMenu(Context context, AttributeSet attrs) {        this(context, attrs, 0);    }    public SlidingMenu(Context context, AttributeSet attrs, int defStyle) {        super(context, attrs, defStyle);        mScreenWidth = ScreenUtils.getScreenWidth(context);        TypedArray a = context.getTheme().obtainStyledAttributes(attrs,                R.styleable.SlidingMenu, defStyle, 0);        int n = a.getIndexCount();        for (int i = 0; i < n; i++) {            int attr = a.getIndex(i);            switch (attr) {                case R.styleable.SlidingMenu_rightPadding:                    // 默认50                    mMenuRightPadding = a.getDimensionPixelSize(attr,                            (int) TypedValue.applyDimension(                                    TypedValue.COMPLEX_UNIT_DIP, 50f,                                    getResources().getDisplayMetrics()));// 默认为10DP                    break;            }        }        a.recycle();    }    public SlidingMenu(Context context) {        this(context, null, 0);    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        /**         * 显示的设置一个宽度         */        if (!once) {            LinearLayout wrapper = (LinearLayout) getChildAt(0);            mMenu = (ViewGroup) wrapper.getChildAt(0);            mContent = (ViewGroup) wrapper.getChildAt(1);            mMenuWidth = mScreenWidth - mMenuRightPadding;            mHalfMenuWidth = mMenuWidth / 2;            mMenu.getLayoutParams().width = mMenuWidth;            mContent.getLayoutParams().width = mScreenWidth;        }        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);            once = true;        }    }    @Override    public boolean onTouchEvent(MotionEvent ev) {        int action = ev.getAction();        switch (action) {            // Up时,进行判断,如果显示区域大于菜单宽度一半则完全显示,否则隐藏            case MotionEvent.ACTION_UP:                int scrollX = getScrollX();                if (scrollX > mHalfMenuWidth) {                    this.smoothScrollTo(mMenuWidth, 0);                    isOpen = false;                } else {                    this.smoothScrollTo(0, 0);                    isOpen = true;                }                return true;        }        return super.onTouchEvent(ev);    }    @Override    public boolean onInterceptTouchEvent(MotionEvent ev) {        return false;    }    /**     * 打开菜单     */    public void openMenu() {        if (isOpen)            return;        this.smoothScrollTo(0, 0);        isOpen = true;    }    /**     * 关闭菜单     */    public void closeMenu() {        if (isOpen) {            this.smoothScrollTo(mMenuWidth, 0);            isOpen = false;        }    }    /**     * 切换菜单状态     */    public void toggle() {        if (isOpen) {            closeMenu();        } else {            openMenu();        }    }    @Override    protected void onScrollChanged(int l, int t, int oldl, int oldt) {        super.onScrollChanged(l, t, oldl, oldt);        float scale = l * 1.0f / mMenuWidth;        float leftScale = 1 - 0.3f * scale;        float rightScale = 0.8f + scale * 0.2f;        ViewHelper.setScaleX(mMenu, leftScale);        ViewHelper.setScaleY(mMenu, leftScale);        ViewHelper.setAlpha(mMenu, 0.6f + 0.4f * (1 - scale));        ViewHelper.setTranslationX(mMenu, mMenuWidth * scale * 0.7f);        ViewHelper.setPivotX(mContent, 0);        ViewHelper.setPivotY(mContent, mContent.getHeight() / 2);        ViewHelper.setScaleX(mContent, rightScale);        ViewHelper.setScaleY(mContent, rightScale);    }}这样就可以直接在主界面里面滑动菜单,也可以自己在界面中定义一个按钮Button,通过点击事件触发侧滑事件。通过调用SlidingMenu中的toggle方法,就可以实现。如代码
 private Button button; button =(Button)this.findViewById(R.id.btn_slidingmenu);    button.setOnClickListener(new View.OnClickListener() {        @Override        public void onClick(View v) {            slidingMenu.toggle();        }    });

“`

这样差不多就能将这个侧滑菜单实现了。。

0 0
原创粉丝点击