因?yàn)轫?xiàng)目中涉及到滑動(dòng)操作,在百度找了一大圈滑動(dòng)模塊 發(fā)現(xiàn)都不行, 于是自己就根據(jù)效果圖造了個(gè)輪子。
廢話不多說(shuō),上圖:

1丶布局

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_gravity="center"
    android:layout_height="wrap_content">


    <com.shunbus.passenger.ui.widget.SlideLockView
        android:id="@+id/slide_rail"
        android:layout_width="287dp"
        android:layout_height="54dp"
        android:background="@drawable/slidelock_bg">
        <!--滑動(dòng)部 件在自定義View中滑動(dòng)的塊塊 -->
        <ImageView
            android:id="@+id/lock_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/slidelock_move_bg" />
    </com.shunbus.passenger.ui.widget.SlideLockView>
</FrameLayout>

其中布局中的 android:background="@drawable/slidelock_bg"的背景屬性 名稱為slidelock_bg.xml 下面是背景的xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 填充的顏色 -->
    <solid android:color="#D7FBE4" />
    <!-- 設(shè)置按鈕的四個(gè)角為弧形 -->
    <!-- android:radius 弧形的半徑 -->
    <corners android:radius="180dp" />
</shape>

其中布局中的 android:src="@drawable/slidelock_move_bg""的背景屬性 名稱為slidelock_move_bg.xml 下面是背景的xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false" android:drawable="@mipmap/move_bt_up"></item>
    <item android:state_checked="true" android:drawable="@mipmap/move_bt_down"></item>
</selector>

代碼中的使用方法

        SlideLockView slideRail = findViewById(R.id.slide_rail);
        slideRail.setCallback(new SlideLockView.Callback() {
            @Override
            public void onUnlock() {
                //滑動(dòng)成功，跳轉(zhuǎn)
                Intent intent = new Intent(MyOderActivity.this, 需要跳轉(zhuǎn)的類(lèi));
                startActivity(intent);
                finish();
            }
        });
    }
    

以下是自定義滑動(dòng)組件的代碼

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.FrameLayout;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.customview.widget.ViewDragHelper;

import com.shunbus.passenger.R;

/**
 * @author： Pan_Hui
 * @time： 2021/1/21
 * @version： 1.0
 * @description： 自定義滑動(dòng)驗(yàn)票按鈕
 */
public class SlideLockView extends FrameLayout {
    /**
     * 滑動(dòng)滑塊
     */
    private View mLockBtn;
    /**
     * 拽托幫助類(lèi)
     */
    private ViewDragHelper mViewDragHelper;
    /**
     * 回調(diào)
     */
    private Callback mCallback;
    /**
     * 是否解鎖
     */
    private boolean isUnlock = false;

    public SlideLockView(@NonNull Context context) {
        this(context, null);
    }

    public SlideLockView(@NonNull Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public SlideLockView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs, defStyleAttr);
    }

    private void init(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        final SlideLockView slideRail = this;
        mViewDragHelper = ViewDragHelper.create(this, 0.3f, new ViewDragHelper.Callback() {
            private int mTop;

            @Override
            public boolean tryCaptureView(@NonNull View child, int pointerId) {
                //判斷能拽托的View，這里會(huì)遍歷內(nèi)部子控件來(lái)決定是否可以拽托，我們只需要滑塊可以滑動(dòng)
                return child == mLockBtn;
            }

            @Override
            public int clampViewPositionHorizontal(@NonNull View child, int left, int dx) {
                //拽托子View橫向滑動(dòng)時(shí)回調(diào)，回調(diào)的left，則是可以滑動(dòng)的左上角x坐標(biāo)
                int lockBtnWidth = mLockBtn.getWidth();
                //限制左右臨界點(diǎn)
                int fullWidth = slideRail.getWidth();
                //最少的左邊
                int leftMinDistance = getPaddingStart();
                //最多的右邊
                int leftMaxDistance = fullWidth - getPaddingEnd() - lockBtnWidth;
                //修復(fù)兩端的臨界值
                if (left < leftMinDistance) {
                    return leftMinDistance;
                } else if (left > leftMaxDistance) {
                    return leftMaxDistance;
                }
                return left;
            }

            @Override
            public int clampViewPositionVertical(@NonNull View child, int top, int dy) {
                //拽托子View縱向滑動(dòng)時(shí)回調(diào)，鎖定頂部padding距離即可，不能不復(fù)寫(xiě)，否則少了頂部的padding，位置就偏去上面了
                return getPaddingTop();
            }

            @Override
            public void onViewCaptured(@NonNull View capturedChild, int activePointerId) {
                super.onViewCaptured(capturedChild, activePointerId);
                //捕獲到拽托的View時(shí)回調(diào)，獲取頂部距離
                mTop = capturedChild.getTop();
            }

            @Override
            public void onViewReleased(@NonNull View releasedChild, float xvel, float yvel) {
                super.onViewReleased(releasedChild, xvel, yvel);
                //獲取滑塊當(dāng)前的位置
                int currentLeft = releasedChild.getLeft();
                //獲取滑塊的寬度
                int lockBtnWidth = mLockBtn.getWidth();
                //獲取滑道寬度
                int fullWidth = slideRail.getWidth();
                //一般滑道的寬度，用來(lái)判斷滑塊距離起點(diǎn)近還是終點(diǎn)近
                int halfWidth = fullWidth / 2;
                //松手位置在小于一半，并且滑動(dòng)速度小于1000，則回到左邊
                if (currentLeft <= halfWidth && xvel < 1000) {
                    mViewDragHelper.settleCapturedViewAt(getPaddingStart(), mTop);
                } else {
                    //否則去到右邊（寬度，減去padding和滑塊寬度）
                    mViewDragHelper.settleCapturedViewAt(fullWidth - getPaddingEnd() - lockBtnWidth, mTop);
                }
                invalidate();
            }

            @Override
            public void onViewDragStateChanged(int state) {
                super.onViewDragStateChanged(state);
                int lockBtnWidth = mLockBtn.getWidth();
                //限制左右臨界點(diǎn)
                int fullWidth = slideRail.getWidth();
                //最多的右邊
                int leftMaxDistance = fullWidth - getPaddingEnd() - lockBtnWidth;
                int left = mLockBtn.getLeft();
                if (state == ViewDragHelper.STATE_IDLE) {
                    //移動(dòng)到最右邊，解鎖完成
                    if (left == leftMaxDistance) {
                        //未解鎖才進(jìn)行解鎖回調(diào)，由于這個(gè)判斷會(huì)進(jìn)兩次，所以做了標(biāo)志位限制
                        if (!isUnlock) {
                            isUnlock = true;
                            if (mCallback != null) {
                                mCallback.onUnlock();
                            }
                        }
                    }
                }
            }
        });
    }

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        //找到需要拽托的滑塊
        mLockBtn = findViewById(R.id.lock_btn);
        if (mLockBtn == null) {
            throw new NullPointerException("必須要有一個(gè)滑動(dòng)滑塊");
        }
    }

    @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;
    }

    @Override
    public void computeScroll() {
        super.computeScroll();
        //判斷是否移動(dòng)到頭了，未到頭則繼續(xù)
        if (mViewDragHelper != null) {
            if (mViewDragHelper.continueSettling(true)) {
                invalidate();
            }
        }
    }

    public interface Callback {
        /**
         * 當(dāng)解鎖時(shí)回調(diào)
         */
        void onUnlock();
    }

    public void setCallback(Callback callback) {
        mCallback = callback;
    }
}

需要用到的圖片:

move_bt_down.png

move_bt_up.png

好了,這就是最上面的效果圖的全部代碼了。 轉(zhuǎn)載請(qǐng)標(biāo)注原創(chuàng)地址謝謝。