自定义抽屉布局从四个屏幕侧面发出跳转手势和检测问题



我正在尝试创建和改进现有的SlidingDrawers项目,这些项目可以适用于屏幕的所有四个侧面{左,右,上,下}。但是,有一些库都有局限性,复杂性和错误。其中一个比较常见的是umano的AndroidSlidingUpPanel,但是,我不喜欢这个库,因为您只需要包含两个子布局,并且还需要注意主要内容到抽屉的特定安排。其他库类似,或更复杂,或有错误。

我即将完成我的滑动抽屉版本,我专注于底部重力。我需要一些关于投掷手势的帮助。单击抽屉将打开和关闭它。您也可以用手指滑动抽屉。但是,如果您甩开抽屉,整个视图将比应有的位置更高或更低。

我该如何解决这个问题?据我所知,我的数学是正确的。我传递给动画师的翻译值应该是正确的。以下是我完成的工作。请查看此项目 https://github.com/drxeno02/CustomDrawerLayout.git。提前谢谢你。

对于那些想要查看有问题的代码外观片段的人,这是我目前如何做手势的。

@Override
public boolean onInterceptTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
mActivePointerId = MotionEventCompat.getPointerId(event, 0);
switch (mStickTo) {
case GRAVITY_BOTTOM:
case GRAVITY_TOP:
mInitialCoordinate = event.getY();
break;
case GRAVITY_LEFT:
case GRAVITY_RIGHT:
mInitialCoordinate = event.getX();
break;
}
break;
case MotionEvent.ACTION_MOVE:
float coordinate = 0;
switch (mStickTo) {
case GRAVITY_BOTTOM:
case GRAVITY_TOP:
coordinate = event.getY();
break;
case GRAVITY_LEFT:
case GRAVITY_RIGHT:
coordinate = event.getX();
break;
}
final int diff = (int) Math.abs(coordinate - mInitialCoordinate);
// confirm that difference is enough to indicate drag action
if (diff > mTouchSlop) {
// start capturing events
Logger.d(TAG, "drag is being captured");
return true;
}
break;
case MotionEvent.ACTION_UP:
if (!FrameworkUtils.checkIfNull(mVelocityTracker)) {
mVelocityTracker.recycle();
mVelocityTracker = null;
}
break;
}
// add velocity movements
if (FrameworkUtils.checkIfNull(mVelocityTracker)) {
mVelocityTracker = VelocityTracker.obtain();
}
mVelocityTracker.addMovement(event);
return super.onInterceptTouchEvent(event);
}
@Override
public boolean onTouchEvent(@NonNull MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN && event.getEdgeFlags() != 0) {
return false;
}
// add velocity movements
if (FrameworkUtils.checkIfNull(mVelocityTracker)) {
mVelocityTracker = VelocityTracker.obtain();
}
mVelocityTracker.addMovement(event);
final View parent = (View) getParent();
final int coordinate;
final int distance = getDistance();
final int tapCoordinate;
switch (mStickTo) {
case GRAVITY_BOTTOM:
coordinate = (int) event.getRawY();
tapCoordinate = (int) event.getRawY();
break;
case GRAVITY_LEFT:
coordinate = parent.getWidth() - (int) event.getRawX();
tapCoordinate = (int) event.getRawX();
break;
case GRAVITY_RIGHT:
coordinate = (int) event.getRawX();
tapCoordinate = (int) event.getRawX();
break;
case GRAVITY_TOP:
coordinate = getRawDisplayHeight(getContext()) - (int) event.getRawY();
tapCoordinate = (int) event.getRawY();
break;
// if view position is not initialized throw an error
default:
throw new IllegalStateException("Failed to initialize coordinates");
}
switch (event.getAction() & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
/*
* Return the pointer identifier associated with a particular pointer data index is
* this event. The identifier tells you the actual pointer number associated with
* the data, accounting for individual pointers going up and down since the start
* of the current gesture.
*/
mActivePointerId = event.getPointerId(0);
switch (mStickTo) {
case GRAVITY_BOTTOM:
mDelta = coordinate - ((RelativeLayout.LayoutParams) getLayoutParams()).topMargin;
break;
case GRAVITY_LEFT:
mDelta = coordinate - ((RelativeLayout.LayoutParams) getLayoutParams()).rightMargin;
break;
case GRAVITY_RIGHT:
mDelta = coordinate - ((RelativeLayout.LayoutParams) getLayoutParams()).leftMargin;
break;
case GRAVITY_TOP:
mDelta = coordinate - ((RelativeLayout.LayoutParams) getLayoutParams()).bottomMargin;
break;
}
mLastCoordinate = coordinate;
mPressStartTime = System.currentTimeMillis();
break;
case MotionEvent.ACTION_MOVE:
RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) getLayoutParams();
final int farMargin = coordinate - mDelta;
final int closeMargin = distance - farMargin;
switch (mStickTo) {
case GRAVITY_BOTTOM:
if (farMargin > distance && closeMargin > mOffsetHeight - getHeight()) {
layoutParams.bottomMargin = closeMargin;
layoutParams.topMargin = farMargin;
}
break;
case GRAVITY_LEFT:
if (farMargin > distance && closeMargin > mOffsetHeight - getWidth()) {
layoutParams.leftMargin = closeMargin;
layoutParams.rightMargin = farMargin;
}
break;
case GRAVITY_RIGHT:
if (farMargin > distance && closeMargin > mOffsetHeight - getWidth()) {
layoutParams.rightMargin = closeMargin;
layoutParams.leftMargin = farMargin;
}
break;
case GRAVITY_TOP:
if (farMargin > distance && closeMargin > mOffsetHeight - getHeight()) {
layoutParams.topMargin = closeMargin;
layoutParams.bottomMargin = farMargin;
}
break;
}
setLayoutParams(layoutParams);
break;
case MotionEvent.ACTION_UP:
final int diff = coordinate - mLastCoordinate;
final long pressDuration = System.currentTimeMillis() - mPressStartTime;
switch (mStickTo) {
case GRAVITY_BOTTOM:
// determine if fling
int relativeVelocity;
final VelocityTracker velocityTracker = mVelocityTracker;
velocityTracker.computeCurrentVelocity(1000, mMaximumVelocity);
final int initialVelocityY = (int) VelocityTrackerCompat.getYVelocity(
velocityTracker, mActivePointerId);
relativeVelocity = initialVelocityY * -1;
// take absolute value to have positive values
final int absoluteVelocity = Math.abs(relativeVelocity);
if (Math.abs(diff) > mFlingDistance && absoluteVelocity > mMinimumVelocity) {
if (tapCoordinate > parent.getHeight() - mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_CLOSED) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_OPEN, parent.getHeight() - mOffsetHeight, true);
} else if (Math.abs(getRawDisplayHeight(getContext()) -
tapCoordinate - getHeight()) < mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_OPEN) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_CLOSED, parent.getHeight() - mOffsetHeight, true);
}
} else {
if (isClicked(getContext(), diff, pressDuration)) {
if (tapCoordinate > parent.getHeight() - mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_CLOSED) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_OPEN, parent.getHeight() - mOffsetHeight, true);
} else if (Math.abs(getRawDisplayHeight(getContext()) -
tapCoordinate - getHeight()) < mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_OPEN) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_CLOSED, parent.getHeight() - mOffsetHeight, true);
}
} else {
smoothScrollToAndNotify(diff);
}
}
break;
case GRAVITY_TOP:
if (isClicked(getContext(), diff, pressDuration)) {
final int y = getLocationInYAxis(this);
if (tapCoordinate - Math.abs(y) <= mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_CLOSED) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_OPEN, parent.getHeight() - mOffsetHeight, true);
} else if (getHeight() - (tapCoordinate - Math.abs(y)) < mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_OPEN) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_CLOSED, parent.getHeight() - mOffsetHeight, true);
}
} else {
smoothScrollToAndNotify(diff);
}
break;
case GRAVITY_LEFT:
if (isClicked(getContext(), diff, pressDuration)) {
if (tapCoordinate <= mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_CLOSED) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_OPEN, getWidth() - mOffsetHeight, true);
} else if (tapCoordinate > getWidth() - mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_OPEN) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_CLOSED, getWidth() - mOffsetHeight, true);
}
} else {
smoothScrollToAndNotify(diff);
}
break;
case GRAVITY_RIGHT:
if (isClicked(getContext(), diff, pressDuration)) {
if (parent.getWidth() - tapCoordinate <= mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_CLOSED) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_OPEN, getWidth() - mOffsetHeight, true);
} else if (parent.getWidth() - tapCoordinate > getWidth() - mOffsetHeight &&
mLockMode == LockMode.LOCK_MODE_OPEN) {
notifyActionAndAnimateForState(LockMode.LOCK_MODE_CLOSED, getWidth() - mOffsetHeight, true);
}
} else {
smoothScrollToAndNotify(diff);
}
break;
}
break;
}
return true;
}
/**
* Method is used to animate the view to the given position
*
* @param diff
*/
private void smoothScrollToAndNotify(int diff) {
int length = getLength();
LockMode stateToApply;
if (diff > 0) {
if (diff > length / 2.5) {
stateToApply = LockMode.LOCK_MODE_CLOSED;
notifyActionAndAnimateForState(stateToApply, getTranslationFor(stateToApply), true);
} else if (mLockMode == LockMode.LOCK_MODE_OPEN) {
stateToApply = LockMode.LOCK_MODE_OPEN;
notifyActionAndAnimateForState(stateToApply, getTranslationFor(stateToApply), false);
}
} else {
if (Math.abs(diff) > length / 2.5) {
stateToApply = LockMode.LOCK_MODE_OPEN;
notifyActionAndAnimateForState(stateToApply, getTranslationFor(stateToApply), true);
} else if (mLockMode == LockMode.LOCK_MODE_CLOSED) {
stateToApply = LockMode.LOCK_MODE_CLOSED;
notifyActionAndAnimateForState(stateToApply, getTranslationFor(stateToApply), false);
}
}
}
/**
* Method is used to retrieve dimensions meant for translation
*
* @param stateToApply
* @return
*/
private int getTranslationFor(LockMode stateToApply) {
switch (mStickTo) {
case GRAVITY_BOTTOM:
switch (stateToApply) {
case LOCK_MODE_OPEN:
return getHeight() - (getRawDisplayHeight(getContext()) - getLocationInYAxis(this));
case LOCK_MODE_CLOSED:
return getRawDisplayHeight(getContext()) - getLocationInYAxis(this) - mOffsetHeight;
}
break;
case GRAVITY_TOP:
final int actionBarDiff = getRawDisplayHeight(getContext()) - ((View) getParent()).getHeight();
final int y = getLocationInYAxis(this) + getHeight();
switch (stateToApply) {
case LOCK_MODE_OPEN:
return getHeight() - y + actionBarDiff;
case LOCK_MODE_CLOSED:
return y - mOffsetHeight - actionBarDiff;
}
break;
case GRAVITY_LEFT:
final int x = getLocationInXAxis(this) + getWidth();
switch (stateToApply) {
case LOCK_MODE_OPEN:
return getWidth() - x;
case LOCK_MODE_CLOSED:
return x - mOffsetHeight;
}
break;
case GRAVITY_RIGHT:
switch (stateToApply) {
case LOCK_MODE_OPEN:
return getWidth() - (getRawDisplayWidth(getContext()) - getLocationInXAxis(this));
case LOCK_MODE_CLOSED:
return getRawDisplayWidth(getContext()) - getLocationInXAxis(this) - mOffsetHeight;
}
break;
}
throw new IllegalStateException("Failed to return translation for drawer");
}
/**
* Method is used to perform the animations
*
* @param stateToApply
* @param translation
* @param notify
*/
private void notifyActionAndAnimateForState(final LockMode stateToApply,
final int translation, final boolean notify) {
switch (mStickTo) {
case GRAVITY_BOTTOM:
switch (stateToApply) {
case LOCK_MODE_OPEN:
animate().translationY(-translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationY(0);
}
});
break;
case LOCK_MODE_CLOSED:
animate().translationY(translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationY(0);
}
});
break;
}
break;
case GRAVITY_TOP:
switch (stateToApply) {
case LOCK_MODE_OPEN:
animate().translationY(translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationY(0);
}
});
break;
case LOCK_MODE_CLOSED:
animate().translationY(-translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationY(0);
}
});
break;
}
break;
case GRAVITY_LEFT:
switch (stateToApply) {
case LOCK_MODE_OPEN:
animate().translationX(translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationX(0);
}
});
break;
case LOCK_MODE_CLOSED:
animate().translationX(-translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationX(0);
}
});
break;
}
break;
case GRAVITY_RIGHT:
switch (stateToApply) {
case LOCK_MODE_OPEN:
animate().translationX(-translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationX(0);
}
});
break;
case LOCK_MODE_CLOSED:
animate().translationX(translation)
.setDuration(TRANSLATION_ANIM_DURATION)
.setInterpolator(new DecelerateInterpolator())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
notifyActionForState(stateToApply, notify);
setTranslationX(0);
}
});
break;
}
break;
}
}

附加说明: 我对这个问题有进一步的见解。我注释掉了ACTION_MOVE,以消除在投掷动作之前移动的抽屉位置。动画效果很好。我相信我的想法是正确的。为了获得"打开"的翻译,我这样做

getHeight() - (getRawDisplayHeight(getContext()) - getLocationInYAxis(this))
  • getHeight() 是抽屉的高度
  • getRawDisplayHeight(getContext()) 是设备屏幕的高度
  • getLocationInYAxis(this),当ACTION_MOVE不在图片中时,是 有效(getRawDisplayHeight(getContext()) - mOffsetHeight)。在这种情况下
    ,它们应该是可互换的。

因此,剩下的就是翻译所需的距离。但是,一旦抽屉被拖动x距离,我希望getLocationInYAxis(this)会返回我拖动的位置。但是计算是错误的。

似乎您应该使用getTranslationFor函数来计算状态的新转换。

您目前只考虑高度和偏移量,但从getTranslationFor代码来看,您似乎还应该考虑getLocationInYAxis

因此,而不是这一行:

notifyActionAndAnimateForState(LockMode.LOCK_MODE_OPEN, parent.getHeight() - mOffsetHeight, true);

试试这一行:

notifyActionAndAnimateForState(LockMode.LOCK_MODE_OPEN, getTranslationFor(LockMode.LOCK_MODE_OPEN), true);

最新更新