底部划出菜单控件总结

来源：互联网发布：火炬之光2 mac 汉化版编辑：程序博客网时间：2024/04/27 19:27

最近在开发过程中总是遇到从底部划出菜单的需求，自己研究了下作了一个可以适应各种底部划出需求的控件，使用起来很简单，只要把需要划出的内容set到这个控件中就可以了，先上效果图。
这里写图片描述
接下来看下这个控件的源码。

public class BottomSlideLayout extends FrameLayout {    private View mSlideLayout;    private Context mContext;    private RelativeLayout layer;    private Animation slideUp;    private Animation slideDown;    private Animation fadeIn;    private boolean isOpen = false;    private boolean autoSlideDownFlag = false;    public BottomSlideLayout(Context context) {        super(context);        mContext = context;        init();    }    public BottomSlideLayout(Context context, AttributeSet attrs) {        super(context, attrs);        mContext = context;        init();    }    public BottomSlideLayout(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        mContext = context;        init();    }    private Animation.AnimationListener upAnimationListener = new Animation.AnimationListener() {        @Override        public void onAnimationStart(Animation animation) {        }        @Override        public void onAnimationEnd(Animation animation) {            isOpen = true;        }        @Override        public void onAnimationRepeat(Animation animation) {        }    };    private Animation.AnimationListener downAnimationListener = new Animation.AnimationListener() {        @Override        public void onAnimationStart(Animation animation) {        }        @Override        public void onAnimationEnd(Animation animation) {            isOpen = false;            layer.setVisibility(View.GONE);        }        @Override        public void onAnimationRepeat(Animation animation) {        }    };    private Animation.AnimationListener fadeInListener = new Animation.AnimationListener() {        @Override        public void onAnimationStart(Animation animation) {            mSlideLayout.setVisibility(View.VISIBLE);            mSlideLayout.startAnimation(slideUp);        }        @Override        public void onAnimationEnd(Animation animation) {        }        @Override        public void onAnimationRepeat(Animation animation) {        }    };    private void init() {        fadeIn = AnimationUtils.loadAnimation(mContext, R.anim.fade_in);        fadeIn.setAnimationListener(fadeInListener);        slideUp = AnimationUtils.loadAnimation(mContext, R.anim.bottom_slide_up);        slideUp.setAnimationListener(upAnimationListener);        slideDown = AnimationUtils.loadAnimation(mContext, R.anim.bottom_slide_down);        slideDown.setAnimationListener(downAnimationListener);    }    private void addLayer() {        //增加表面图层        layer = new RelativeLayout(mContext);        layer.setBackgroundColor(Color.parseColor("#55000000"));        layer.setVisibility(View.GONE);        RelativeLayout.LayoutParams lp1 = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);        lp1.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);        mSlideLayout.setVisibility(View.GONE);        layer.addView(mSlideLayout, lp1);        addView(layer);    }    public void setSlideLayout(View view) {        mSlideLayout = view;        addLayer();    }    public void slideUp() {        if (!isOpen) {            layer.setVisibility(View.VISIBLE);            layer.startAnimation(fadeIn);        }    }   //设置是否自动缩回菜单    public void setAutoSlideDown( boolean autoSlideDown) {        this.autoSlideDownFlag = autoSlideDown;        if (autoSlideDown) {            layer.setOnClickListener(new OnClickListener() {                @Override                public void onClick(View v) {                    slideDown();                }            });            mSlideLayout.setOnClickListener(new OnClickListener() {                @Override                public void onClick(View v) {                    return;                }            });        } else {            layer.setOnTouchListener(new OnTouchListener() {                @Override                public boolean onTouch(View v, MotionEvent event) {                    return true;                }            });        }    }    public void slideDown() {        if (isOpen) {            mSlideLayout.setVisibility(View.GONE);            mSlideLayout.startAnimation(slideDown);        }    }}

实现很简单，主要是把需要弹出的部分加到一个相对布局中，然后再把这个相对布局增加到FrameLayout中作为最表面的一层，一开始设置为GONE，通过设置弹出层的VISIBLE or GONE同时结合View动画和动画的监听器来实现目标的效果。
通过效果图不难看一共使用了3种动画，划上动画，划下动画和渐入动画（本例中使用的是view 动画，其实也可以使用属性动画）如图
这里写图片描述
另外这个控件还支持，自动滑下去的功能，即当底部的layout划出后，点击背景阴影区域，划出的layout就会自动滑下去，通过如下代码设置此功能。

bottomSlideLayout.setAutoSlideDown(true);//or false

最后下载链接，感兴趣的同学可以看下
https://github.com/PeterXiaoWang/bottomSlideLayout

0 0