Android-自定义全局拽托返回

作者: h2coder | 来源:发表于2022-06-15 23:50 被阅读0次

效果

DragBackLayout.gif

自定义属性

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="DragBackLayout">
        <attr name="dbl_style" format="enum">
            <!-- 菜单和内容,一起移动 -->
            <enum name="scroll" value="1" />
            <!-- 菜单固定,只有内容移动 -->
            <enum name="fixed" value="2" />
        </attr>
    </declare-styleable>
</resources>

代码实现

/**
 * 全局侧滑返回
 */
public class DragBackLayout extends FrameLayout {
    /**
     * 风格:菜单和内容,一起移动
     */
    public static final int STYLE_SCROLL = 1;
    /**
     * 风格:菜单固定,只有内容移动
     */
    public static final int STYLE_FIXED = 2;

    /**
     * 拽托帮助类
     */
    private ViewDragHelper mViewDragHelper;
    /**
     * 风格
     */
    private int mStyle;
    /**
     * 菜单View
     */
    private View mMenuView;
    /**
     * 内容子View
     */
    private View mContentView;
    /**
     * 当前内容子View的Left值,由于子View引起重绘或addView引起重绘会导致requestLayout(),会重新onLayout()子View
     * 而layout子View,要在onLayout中处理。如果在onViewPositionChanged()中单独onLayout,并且又没有保存left值为成员变量,就会因为其他原因引起的requestLayout()
     * 导致子View的left值默认值为0,会突然抖回左边
     */
    private int mCurrentLeft = 0;
    /**
     * 拽托状态回调
     */
    private OnDragStateChangeListener mOnDragStateChangeListener;

    public DragBackLayout(Context context) {
        this(context, null);
    }

    public DragBackLayout(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public DragBackLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs, defStyleAttr);
    }

    private void init(Context context, AttributeSet attrs, int defStyleAttr) {
        mViewDragHelper = ViewDragHelper.create(this, 0.5f, new ViewDragHelperCallBack());
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.DragBackLayout, defStyleAttr, 0);
        mStyle = typedArray.getInt(R.styleable.DragBackLayout_dbl_style, STYLE_SCROLL);
        typedArray.recycle();
    }

    private class ViewDragHelperCallBack extends ViewDragHelper.Callback {
        /**
         * 开始拽托时的X坐标
         */
        private int mDownX;
        /**
         * 开始拽托时的Y坐标
         */
        private int mDownY;

        @Override
        public boolean tryCaptureView(@NonNull View child, int pointerId) {
            //返回ture则表示可以捕获该view,手指摸上一瞬间调用
            return child == mMenuView || child == mContentView;
        }

        @Override
        public void onViewCaptured(@NonNull View capturedChild, int activePointerId) {
            super.onViewCaptured(capturedChild, activePointerId);
            mDownX = capturedChild.getLeft();
            mDownY = capturedChild.getTop();
        }

        @Override
        public int clampViewPositionHorizontal(@NonNull View child, int left, int dx) {
            //手指触摸移动时实时回调
            //限制只能向右滑
            if (left < 0) {
                return 0;
            }
            //最多只能滑动到菜单View的宽度
            int maxLeft = mMenuView.getWidth();
            return Math.min(left, maxLeft);
        }

        @Override
        public void onViewReleased(@NonNull View releasedChild, float xvel, float yvel) {
            //手指释放时回调
            final int currentLeft = releasedChild.getLeft();
            final int currentTop = releasedChild.getTop();
            //计算移动距离
            int distanceX = currentLeft - mDownX;
            int distanceY = currentTop - mDownY;
            float halfMenuWidth = mMenuView.getWidth() / 2f;
            //滚动到左边
            Runnable scrollToLeft = new Runnable() {
                @Override
                public void run() {
                    mViewDragHelper.settleCapturedViewAt(0, 0);
                }
            };
            //滚动到右边
            Runnable scrollToRight = new Runnable() {
                @Override
                public void run() {
                    int finalLeft = mMenuView.getWidth();
                    mViewDragHelper.settleCapturedViewAt(finalLeft, 0);
                }
            };
            //根据移动距离占总大小的百分比,决定滚动到左边还是右边
            Runnable scrollByDistancePercentage = new Runnable() {
                @Override
                public void run() {
                    //小于一半菜单的宽度,回弹回左边
                    if (releasedChild.getLeft() < halfMenuWidth) {
                        scrollToLeft.run();
                    } else {
                        //大于一半,则算右边
                        scrollToRight.run();
                    }
                }
            };
            //判断是否是左右滑,上下滑不需要动
            if (Math.abs(distanceX) > Math.abs(distanceY)) {
                //上下滑,速度很快,则为fling操作
                if (Math.abs(xvel) > Math.abs(mViewDragHelper.getMinVelocity())) {
                    //距离相减为正数,并且惯性速度为正数,滚动到右边
                    if (distanceX > 0 && xvel > 0) {
                        scrollToRight.run();
                    } else {
                        //否则回弹回左边
                        scrollToLeft.run();
                    }
                } else {
                    //不是fling操作,根据移动距离占总大小的百分比,决定滚动到左边还是右边
                    scrollByDistancePercentage.run();
                }
            }
            invalidate();
        }

        @Override
        public void onViewPositionChanged(@NonNull View changedView, int left, int top, int dx, int dy) {
            mCurrentLeft = left;
            //统一在onLayout中,重新布局子View位置,来移动子View
            requestLayout();
        }

        @Override
        public int getViewHorizontalDragRange(@NonNull View child) {
            if (mContentView == null) {
                return 0;
            }
            if (mContentView == child) {
                return mContentView.getWidth();
            } else {
                return 0;
            }
        }

        @Override
        public void onViewDragStateChanged(int state) {
            super.onViewDragStateChanged(state);
            DragBackLayout layout = DragBackLayout.this;
            if (state == ViewDragHelper.STATE_DRAGGING) {
                if (mOnDragStateChangeListener != null) {
                    mOnDragStateChangeListener.onStartDrag(layout);
                }
            } else if (state == ViewDragHelper.STATE_IDLE) {
                boolean isScroll2Right = mContentView.getLeft() == mMenuView.getWidth();
                if (mOnDragStateChangeListener != null) {
                    mOnDragStateChangeListener.onStopDrag(layout);
                }
                if (isScroll2Right) {
                    if (mOnDragStateChangeListener != null) {
                        mOnDragStateChangeListener.onDragToBack(layout);
                    }
                }
            }
        }
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        //移动内容子View
        //菜单View
        MarginLayoutParams menuViewLp = (MarginLayoutParams) mMenuView.getLayoutParams();
        if (mStyle == STYLE_SCROLL) {
            int menuLeft = -mMenuView.getMeasuredWidth() + menuViewLp.leftMargin;
            mMenuView.layout(
                    mCurrentLeft + menuLeft,
                    menuViewLp.topMargin,
                    mCurrentLeft + menuLeft + mMenuView.getMeasuredWidth() + menuViewLp.leftMargin,
                    mMenuView.getMeasuredHeight() + menuViewLp.topMargin
            );
        } else if (mStyle == STYLE_FIXED) {
            int menuLeft = menuViewLp.leftMargin;
            mMenuView.layout(
                    menuLeft,
                    menuViewLp.topMargin,
                    menuLeft + mMenuView.getMeasuredWidth() + menuViewLp.leftMargin,
                    mMenuView.getMeasuredHeight() + menuViewLp.topMargin
            );
        }
        //内容View
        MarginLayoutParams contentViewLp = (MarginLayoutParams) mContentView.getLayoutParams();
        mContentView.layout(
                mCurrentLeft + contentViewLp.leftMargin,
                contentViewLp.topMargin,
                mCurrentLeft + mContentView.getMeasuredWidth() + contentViewLp.leftMargin,
                mContentView.getMeasuredHeight() + contentViewLp.topMargin
        );
    }

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        int childCount = getChildCount();
        if (childCount != 2) {
            throw new RuntimeException("子View必须只有2个,分别是菜单View和内容View");
        }
        mMenuView = getChildAt(0);
        mContentView = getChildAt(1);
    }

    @Override
    public void computeScroll() {
        if (mViewDragHelper.continueSettling(true)) {
            ViewCompat.postInvalidateOnAnimation(this);
        }
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {
        //将onInterceptTouchEvent委托给ViewDragHelper
        return mViewDragHelper.shouldInterceptTouchEvent(ev);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        //将onTouchEvent委托给ViewDragHelper
        mViewDragHelper.processTouchEvent(event);
        return true;
    }

    /**
     * 滚性滚动关闭
     */
    public void smoothClose() {
        mViewDragHelper.smoothSlideViewTo(mContentView, 0, 0);
    }

    /**
     * 无动画滚动关闭
     */
    public void quickClose() {
        mCurrentLeft = 0;
        requestLayout();
    }

    /**
     * 结束回调
     */
    public interface OnDragStateChangeListener {
        void onStartDrag(DragBackLayout layout);

        void onStopDrag(DragBackLayout layout);

        void onDragToBack(DragBackLayout layout);
    }

    public void setOnDragStateChangeListener(OnDragStateChangeListener listener) {
        this.mOnDragStateChangeListener = listener;
    }
}

使用

  • 布局xml
<?xml version="1.0" encoding="utf-8"?>
<com.zh.dragbacklayout.DragBackLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drag_back_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:dbl_style="scroll">

    <!-- 左边的返回提示菜单 -->
    <FrameLayout
        android:id="@+id/back_tip"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:background="@color/black"
        android:padding="15dp">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:src="@drawable/ic_back_icon" />
    </FrameLayout>

    <!-- 内容View -->
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/purple_200">
    </FrameLayout>
</com.zh.dragbacklayout.DragBackLayout>
  • Java代码
DragBackLayout dragBackLayout = findViewById(R.id.drag_back_layout);
//设置拽托监听
dragBackLayout.setOnDragStateChangeListener(new DragBackLayout.OnDragStateChangeListener() {
    @Override
    public void onStartDrag(DragBackLayout layout) {
        //开始拽托
    }

    @Override
    public void onStopDrag(DragBackLayout layout) {
        //停止拽托
    }

    @Override
    public void onDragToBack(DragBackLayout layout) {
        //拽托关闭
        finish();
    }
});

相关文章

网友评论

    本文标题:Android-自定义全局拽托返回

    本文链接:https://www.haomeiwen.com/subject/aqyfvrtx.html