ios - Tinder like Animation usando UIPanGestureRecognizer y Rotation

uipangesturerecognizer swift 4

Question

Estoy tratando de implementar Tinder como animación para deslizar una imagen hacia la izquierda y hacia la derecha y rotarla mientras lo hago. Tengo una serie de imágenes y necesito deslizarlas una tras otra.

Hasta ahora he podido usar UIPanGestureRecognizer para mover la imagen, pero cuando trato de rotar la imagen, todo se rompe.

He subido el código aquí . ¿Podría alguien señalarme en la dirección correcta para desarrollar el algoritmo y afinarlo para lograr la perfección como Tinder?

Answer 1

Puedes hacerlo escuchando los métodos touchesBegan, touchesMoved y touchesEnded .

Básicamente esto es lo que debes hacer:

1. En touchesBegan obtén el punto de contacto con respecto a la vista actual (lo necesitarás más tarde para rotar la imagen anclando en este punto).
2. En touchesMoved obtén el punto de contacto con respecto a la supervista y mueve la vista a medida que se mueven los toques.
3. Aplique una pequeña rotación basada en el movimiento usando CGAffineTransformMakeRotation
4. En los toques , mueva la vista fuera de la pantalla o vuelva a colocarla en su posición inicial.

Espero que esta ayuda ... Verifique este informe para referencia.

Answer 2

Como mencionó Shri, debes manejar el estado de los reconocedores de gestos de panoramización. Aquí está el ejemplo rápido de código

func panGestureRecognized(gestureRecognizer: UIPanGestureRecognizer) {
    xDistanceFromCenter = gestureRecognizer.translationInView(self).x
        yDistanceFromCenter = gestureRecognizer.translationInView(self).y

        let touchLocation = gestureRecognizer.locationInView(self)

        switch gestureRecognizer.state {
        case .Began:
            originalLocation = center
            animationDirection = touchLocation.y >= frame.size.height / 2 ? -1.0 : 1.0
            break
        case .Changed:
            let rotationStrength = min(xDistanceFromCenter / self.frame.size.width, rotationMax)
            let rotationAngle = animationDirection * defaultRotationAngle * rotationStrength
            let scaleStrength = 1 - ((1 - scaleMin) * fabs(rotationStrength))
            let scale = max(scaleStrength, scaleMin)
            let transform = CGAffineTransformMakeRotation(rotationAngle)
            let scaleTransform = CGAffineTransformScale(transform, scale, scale) 
            self.transform = scaleTransform
            break
        case .Ended:
            swipeMadeAction()
        default :
            break
        }
}

Puede ver nuestra implementación en este repositorio: https://github.com/Yalantis/Koloda

Answer 3

Acabo de implementar esto recientemente para la empresa para la que trabajo y decidí abrirlo. https://github.com/skensell/MXCardsSwipingView

UIPanGestureRecognizer el UIPanGestureRecognizer en combinación con UIAttachmentBehavior . Introducido en iOS 7, es conceptualmente más fácil y menos código. Es como colocar el dedo en esa parte de UIView .

Más detalles aquí: https://github.com/skensell/MXCardsSwipingView/blob/master/MXCardsSwipingView/Classes/MXCardsSwipingView.m