擼起袖子自己寫一個Android通用的重新整理控制元件

Android心路歷程發表於2019-04-30

專案中我們經常有上拉、下拉重新整理的需求,幾乎所有的listView、RecyclerView都會伴隨著上拉、下拉重新整理的需求,如果我們使用一些開源控制元件,換了控制元件我們就要更新,現在我們自己擼起袖子寫一個通用的重新整理控制元件

思路:

寫一個繼承RelativeLayout的RefreshLayout
新增頭尾控制元件作為重新整理控制元件
通過事件分發來進行重新整理操作
通過動畫來控制控制元件移動
目的:讓他的所有子控制元件都可以使用,哪怕是一個TextView

public class RefreshLayout extends RelativeLayout {

/**
 * 滑動控制元件時拉去的速度比例
 */
private final int V_REFRESH = 2;
/**
 * 是否是重新整理過程
 * true 是
 * false 不是
 * 為false的時候才可以進行重新整理
 */
private boolean mIsRefreshDuring;
/**
 * 可以進下拉重新整理
 */
private boolean mCanDownPull;
/**
 * 可以進行上拉重新整理
 */
private boolean mCanUpPull;
/**
 * 判斷觸控後是否是初次移動
 */
private boolean mIsFirstMove;
/**
 * y軸呢平移的距離
 */
private int mDistanceY;
/**
 * 重新整理介面物件
 */
private OnRefresh mOnRefresh;
/**
 * 用於控制事件攔截的變數
 */
private boolean mCanIntercept;
private int mTouchSlop;
private int mDistance;
private LayoutParams mHeaderParams;
private View mHeaderView;
private View mFootView;
private int mHeaderMaxHeight;
private int mStartY;
private LayoutParams mFootParams;
private int mFootMaxHeight;
private PullCallBack mCallBack;
private View mChildView;
private ObjectAnimator mAnimator;

public RefreshLayout(Context context) {
    super(context);
    initData();
}

public RefreshLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
    initData();
}

public RefreshLayout(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    initData();
}

/**
 * 必須讓頭尾控制元件實現的介面
 */
public interface HeadAndFootCallBack {
    //設定屬性
    void setAttribute();

    //開始重新整理
    void startPull();

    //停止重新整理
    void stopPull();
}

/**
 * 必須讓被拖動的控制元件子類實現
 */
public interface PullCallBack {
    boolean canDownPull();

    boolean canUpPull();
}

private void initData() {
    //不呼叫該方法不能進行繪製
    setWillNotDraw(false);
}

/**
 * 下拉重新整理完成後必須使用該方法
 */
public void downPullFinish() {
    mAnimator.setFloatValues(mChildView.getTranslationY(), 0);
    mAnimator.start();
    ((HeadAndFootCallBack) mHeaderView).stopPull();
}

/**
 * 上拉完成後必須呼叫該方法
 */
public void upPullFinish() {
    mAnimator.setFloatValues(mChildView.getTranslationY(), 0);
    mAnimator.start();
    ((HeadAndFootCallBack) mFootView).stopPull();
}

/**
 * 自動下拉重新整理
 */
public void autoDownPullForHead() {
    postDelayed(new Runnable() {
        @Override
        public void run() {
            mCanDownPull = true;
            mCanUpPull = false;
            mAnimator.setFloatValues(10, mHeaderMaxHeight);
            mAnimator.start();
            ((HeadAndFootCallBack) mHeaderView).startPull();
            mOnRefresh.onDownPullRefresh();
        }
    }, 500);
}

/**
 * 自動下拉重新整理
 */
public void autoUpPullForHead() {
    postDelayed(new Runnable() {
        @Override
        public void run() {
            mCanDownPull = false;
            mCanUpPull = true;
            mAnimator.setFloatValues(0, mFootMaxHeight);
            mAnimator.start();
            ((HeadAndFootCallBack) mFootView).startPull();
            mOnRefresh.onUpPullRefresh();
        }
    }, 500);
}

@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
    return mCanIntercept;
}

@Override
public boolean onTouchEvent(MotionEvent event) {
    return true;
}

@Override
public boolean dispatchTouchEvent(MotionEvent event) {
    Log.e("shen", "mIsRefreshDuring=" + mIsRefreshDuring);
    if (mIsRefreshDuring)/*如果正在進行重新整理將不會獲取MotionEvent*/ {
        return super.dispatchTouchEvent(event);
    }
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            mStartY = (int) event.getY();
            initPull();
            break;
        case MotionEvent.ACTION_MOVE:
            if (event.getPointerCount() == 1) {
                int moveY = (int) event.getY();
                mDistanceY = (moveY - mStartY) / V_REFRESH;
                if (!mIsFirstMove && mDistanceY != 0 && mDistanceY < mTouchSlop) {
                    mCanDownPull = mDistanceY > 0;
                    mCanUpPull = !mCanDownPull;
                    mIsFirstMove = true;
                }
                if (mCanDownPull && mCallBack.canDownPull()) {
                    upDataForDownPull();//下拉重新整理
                    mChildView.setEnabled(false);
                    mCanIntercept = true;
                }
                if (mCanUpPull && mCallBack.canUpPull()) {
                    upDataForUpPull();//上拉載入
                    mChildView.setEnabled(false);
                    mCanIntercept = true;
                }
                mStartY = moveY;
            }
            break;
        case MotionEvent.ACTION_UP:
            mIsRefreshDuring = true;
            mIsFirstMove = false;
            if (mHeaderParams.height >= mHeaderMaxHeight)/*可以下拉重新整理*/ {
                ((HeadAndFootCallBack) mHeaderView).startPull();
                mOnRefresh.onDownPullRefresh();
            } else if (mFootParams.height >= mFootMaxHeight)/*可以上拉重新整理*/ {
                ((HeadAndFootCallBack) mFootView).startPull();
                mOnRefresh.onUpPullRefresh();
            } else if (mHeaderParams.height > 0 && mHeaderParams.height < mHeaderMaxHeight)/*不能進行下拉重新整理,收回*/ {
                releaseForDownFinished();
            } else if (mFootParams.height > 0 && mFootParams.height < mFootMaxHeight)/*不能進行下拉重新整理,收回*/ {
                releaseForUpFinished();
            } else {
                mIsRefreshDuring = false;
                mCanIntercept = false;
            }
            break;
    }
    super.dispatchTouchEvent(event);
    return true;
}

/**
 * 每次進行觸控都需要進行初始化
 */
private void initPull() {
    mCanDownPull = false;
    mCanUpPull = false;
}

/**
 * 不需要進行上拉重新整理
 */
private void releaseForUpFinished() {
    mAnimator.setFloatValues(mChildView.getTranslationY(), 0);
    mAnimator.start();
}

/**
 * 不需要進行下拉重新整理
 */
private void releaseForDownFinished() {
    mAnimator.setFloatValues(mChildView.getTranslationY(), 0);
    mAnimator.start();
}

/**
 * 上拉時處理手勢
 */
private void upDataForUpPull() {
    if (mDistanceY != 0) {
        mFootParams.height -= mDistanceY;
        if (mFootParams.height <= 0) {
            mFootParams.height = 0;
        }
        if (mFootParams.height >= mFootMaxHeight) {
            mFootParams.height = mFootMaxHeight;
        }
        mChildView.setTranslationY(-mFootParams.height);
        mFootView.requestLayout();
    }
}

/**
 * 下拉時處理手勢
 */
private void upDataForDownPull() {
    if (mDistanceY != 0) {
        mHeaderParams.height += mDistanceY;
        if (mHeaderParams.height >= mHeaderMaxHeight) { //最大
            mHeaderParams.height = mHeaderMaxHeight;
        }
        if (mHeaderParams.height <= 0) { //最小
            mHeaderParams.height = 0;
        }
        mChildView.setTranslationY(mHeaderParams.height);
        mHeaderView.requestLayout();
    }
}

@Override
protected void onAttachedToWindow() {
    super.onAttachedToWindow();
}

@Override
protected void onFinishInflate() {
    super.onFinishInflate();
    //載入頭
    mHeaderView = getChildAt(0);
    if (!(mHeaderView instanceof HeadAndFootCallBack)) {
        new IllegalStateException("HeaderView必須實現HeadAndFootCallBack介面");
    }
    ((HeadAndFootCallBack) mHeaderView).setAttribute();
    mHeaderParams = (LayoutParams) mHeaderView.getLayoutParams();
    mHeaderParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);

    //載入尾
    mFootView = getChildAt(2);
    if (!(mFootView instanceof HeadAndFootCallBack)) {
        new IllegalStateException("FootView必須實現HeadAndFootCallBack介面");
    }
    ((HeadAndFootCallBack) mFootView).setAttribute();
    mFootParams = (LayoutParams) mFootView.getLayoutParams();
    mFootParams.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);

    mChildView = getChildAt(1);
    if (!(mChildView instanceof HeadAndFootCallBack)) {
        new IllegalStateException("ChildView必須實現PullCallBack介面");
    }
    mCallBack = (PullCallBack) getChildAt(1);

    //設定動畫
    mAnimator = ObjectAnimator.ofFloat(mChildView, "translationY", 0);
    mAnimator.setInterpolator(new DecelerateInterpolator());
    mAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            int translationY = (int) mChildView.getTranslationY();
            if (mCanUpPull) { //從移動到的位置往下滑
                mFootParams.height = Math.abs(translationY);
                mFootView.requestLayout();
            } else if (mCanDownPull) {
                mHeaderParams.height = Math.abs(translationY);
                mHeaderView.requestLayout();
            }
            Log.e("shen", "translationY=" + translationY);
            Log.e("shen", "mHeaderParams.height=" + mHeaderParams.height);
            if (translationY == 0) {
                mChildView.setEnabled(true);
                mDistanceY = 0; //重置
                mIsRefreshDuring = false; //重置
                mCanIntercept = false;
            } else {
                mIsRefreshDuring = true;
            }
        }
    });
}

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);
    mTouchSlop = ViewConfiguration.get(getContext()).getScaledTouchSlop();
    mDistance = mTouchSlop * 5;
    //設定下拉頭初始屬性
    mHeaderMaxHeight = mHeaderParams.height;
    mHeaderParams.height = 0;
    mHeaderView.requestLayout();
    //設定上拉尾初始屬性
    mFootMaxHeight = mFootParams.height;
    mFootParams.height = 0;
    mFootView.requestLayout();
}

/**
 * 下拉/上拉事件監聽
 */
public interface OnRefresh {
    /**
     * 下拉重新整理
     */
    void onDownPullRefresh();

    /**
     * 上拉載入
     */
    void onUpPullRefresh();
}

public void setOnRefresh(OnRefresh onRefresh) {
    mOnRefresh = onRefresh;
}
複製程式碼

給他新增三個控制元件,頭尾就是重新整理頭、尾,第二個就是正常顯示的控制元件。必須讓頭尾實現HeadAndFootCallBack介面,來設定屬性,通知開始重新整理、結束重新整理

難點: 現在來說下開發時遇到的難點

由於判斷在dispatchTouchEvent中,導致如果該控制元件以及子控制元件都不消費該事件的話,就會造成事件不會傳送到它,因為如果不消費DOWN事件的話,之後所有的事件都不會在進行接收。解決方式,讓該控制元件onTouchEvent方法消返回true,當子控制元件不進行事件消費的話,就會返回由該控制元件消費,不會造成因DOWN事件不消費而無法接收到事件,導致dispatchTouchEvent也不消費事件
動畫,動畫就是我的傷痛,最近在學習估值器
這個控制元件自認為寫的不錯,通過他可以幫我們學習事件分發、動畫、介面回撥,也是有一定的學習意義

  • 擼起袖子自己寫一個Android通用的重新整理控制元件

擼起袖子自己寫一個Android通用的重新整理控制元件

+qq群457848807:。獲取以上高清技術思維圖,以及相關技術的免費視訊學習資料


相關文章