Created
March 12, 2017 00:30
-
-
Save agibson73/a8494be25fdbe7ffcf0ef39db6ca1bb7 to your computer and use it in GitHub Desktop.
Just a UICollectionview cell animation on touch although it could be performed on any uiview.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import UIKit | |
@IBDesignable class PulseTouchCollectionViewCell: UICollectionViewCell { | |
@IBInspectable var scaleFactor : CGFloat = 1.3 | |
@IBInspectable var animationColor : UIColor = UIColor.green | |
@IBInspectable var startingOpacity : Float = 0.2 | |
@IBInspectable var animationDuration : Double = 0.8 | |
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) { | |
super.touchesBegan(touches, with: event) | |
let coverView = UIView(frame: bounds) | |
coverView.autoresizingMask = [.flexibleWidth,.flexibleHeight] | |
coverView.backgroundColor = UIColor.clear | |
self.addSubview(coverView) | |
let touch = touches.first! | |
let point = touch.location(in: self) | |
let ourTouchView = UIView(frame: CGRect(x: point.x - 5, y: point.y - 5, width: 10, height: 10)) | |
let circleMaskPathInitial = UIBezierPath(ovalIn: ourTouchView.frame) | |
let radius = max((self.bounds.width * scaleFactor) , (self.bounds.height * scaleFactor)) | |
let circleMaskPathFinal = UIBezierPath(ovalIn: ourTouchView.frame.insetBy(dx: -radius, dy: -radius)) | |
let rippleLayer = CAShapeLayer() | |
rippleLayer.opacity = startingOpacity | |
rippleLayer.fillColor = animationColor.cgColor | |
rippleLayer.path = circleMaskPathFinal.cgPath | |
coverView.layer.addSublayer(rippleLayer) | |
//fade up | |
let fadeUp = CABasicAnimation(keyPath: "opacity") | |
fadeUp.beginTime = CACurrentMediaTime() | |
fadeUp.duration = animationDuration * 0.6 | |
fadeUp.toValue = 0.6 | |
fadeUp.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut) | |
fadeUp.fillMode = kCAFillModeForwards | |
fadeUp.isRemovedOnCompletion = false | |
rippleLayer.add(fadeUp, forKey: nil) | |
//fade down | |
let fade = CABasicAnimation(keyPath: "opacity") | |
fade.beginTime = CACurrentMediaTime() + animationDuration * 0.60 | |
fade.duration = animationDuration * 0.40 | |
fade.toValue = 0 | |
fade.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut) | |
fade.fillMode = kCAFillModeForwards | |
fade.isRemovedOnCompletion = false | |
rippleLayer.add(fade, forKey: nil) | |
//change path | |
CATransaction.begin() | |
let maskLayerAnimation = CABasicAnimation(keyPath: "path") | |
maskLayerAnimation.fromValue = circleMaskPathInitial.cgPath | |
maskLayerAnimation.toValue = circleMaskPathFinal.cgPath | |
maskLayerAnimation.beginTime = CACurrentMediaTime() | |
maskLayerAnimation.duration = animationDuration | |
maskLayerAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut) | |
CATransaction.setCompletionBlock({ | |
coverView.removeFromSuperview() | |
}) | |
rippleLayer.add(maskLayerAnimation, forKey: "path") | |
CATransaction.commit() | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment