UIPanGestureRecognizer当滑动单元格以显示更多按钮时，如果用户滑动不到一半，如何使视图反弹

Question

我希望，如果用户滑动按钮宽度的一半以下，那么它会弹回并且不显示按钮，但是如果用户滑动按钮宽度的一半以上，则该单元会反弹到正确的位置。

到目前为止，这是我可以左右滑动的原因。

private func swipeBothButtonsBothPresent(gesture: UIPanGestureRecognizer) {
    let translation = gesture.translation(in: swipeAbleView)
    guard let gestureView = gesture.view else {
        return
    }
    let center: CGPoint = CGPoint(x: gestureView.center.x + translation.x, y: gestureView.center.y)

    let velocity: CGPoint = gesture.velocity(in: swipeAbleView)
    if velocity.x > 0 {
        //right
        if center.x < swipeAbleView.frame.width / 2 + leftButton.frame.size.width {
            swipeAbleView.center = center
        } else {
            swipeAbleView.center = CGPoint(x: swipeAbleView.frame.width / 2 + leftButton.frame.size.width, y: swipeAbleView.center.y)
        }
    } else {
        //left
        if center.x > swipeAbleView.frame.width / 2 - rightButton.frame.size.width {
            swipeAbleView.center = center
        } else if  isRightButtonThere {
            swipeAbleView.center = CGPoint(x: swipeAbleView.frame.width / 2 - rightButton.frame.size.width, y: swipeAbleView.center.y)
        }
    }
    gesture.setTranslation(CGPoint.zero, in: swipeAbleView)
}

Answer 1

您必须使用UIPangesture状态，才能查明所处的状态。 您可以使用开关进行操作，并检查.changed，.end和.cancelled状态。

private func swipteBothButtonsBothPresent(with gesture: UIPanGestureRecognizer) {
let translation = recognizer.translation(in: swipeAbleView)

// you can use the center point+velocity to compare to the gestureView center but there is another way as well directly access the translation.x
let center: CGPoint = CGPoint(x: gestureView.center.x + translation.x, y: gestureView.center.y)
let velocity: CGPoint = gesture.velocity(in: swipeAbleView)


// Pan gesture has state which you can access using the gesture you have passed
switch gesture.state {
case .changed:
    // Here you can directly check for translation.x
    /*
    if translation.x < 0 {
        // Do you're calculations
     } else {

     }
    */
    // Your logic to show left or right button
    if velocity.x > 0 {
        //right
        if center.x < swipeAbleView.frame.width / 2 + leftButton.frame.size.width {
            swipeAbleView.center = center
        } else {
            swipeAbleView.center = CGPoint(x: swipeAbleView.frame.width / 2 + leftButton.frame.size.width, y: swipeAbleView.center.y)
        }
    } else {
        //left
        if center.x > swipeAbleView.frame.width / 2 - rightButton.frame.size.width {
            swipeAbleView.center = center
        } else if  isRightButtonThere {
            swipeAbleView.center = CGPoint(x: swipeAbleView.frame.width / 2 - rightButton.frame.size.width, y: swipeAbleView.center.y)
        }
    }

    gesture.setTranslation(CGPoint.zero, in: swipeAbleView)

case .ended:
    // Check here if you have swiped more than buttons half width or lesss you can do it easily using the translation value you have
    // Check if user was swiping left or right you already has the velocity parameter or you can check translation.x to see if the value is negitive or positive (left or right)
    // I cast the translation.x to abs() so even if the value was negitive it will change it back to positive
    // do the check for left or right I have directly added the check for rightButton

    if abs(translation.x) > (rightButton.frame.size.width / 2) {
        // you have dragged more than half of the right button
        // even you can add spring animation to get the bounce effect
        UIView.animate(withDuration: 0.3) {
            // animate back to orignal place
        }
    }

case .cancelled:
    // Do the same dance for cancelled because there can be this state through some times reset add the same code from ended here
    // create a function move the code from .ended state to the function and call the function here
    //
    resetButtons(x: abs(translation.x))
default:
    // there are 3 more states but you can skip them .began, .failed, .possible
    break

}

func resetButtons(x: Int) {
    // Move the code from .ended state of the switch here
}