Skip to content

Instantly share code, notes, and snippets.

@juliensagot
Last active August 3, 2020 17:45
Show Gist options
  • Save juliensagot/854a894c4179d01fac42076e5174fd58 to your computer and use it in GitHub Desktop.
Save juliensagot/854a894c4179d01fac42076e5174fd58 to your computer and use it in GitHub Desktop.
The code for this particular animation → https://twitter.com/Barbapapapps/status/1289949742118576128?s=20
import UIKit
import PlaygroundSupport
final class CardView: UIControl {
private let imageView = UIImageView(image: UIImage(named: "Sample"))
override init(frame: CGRect) {
super.init(frame: frame)
layer.cornerRadius = 9
layer.cornerCurve = .continuous
layer.shadowColor = UIColor.black.cgColor
layer.shadowOpacity = 0.2
layer.shadowOffset = CGSize(width: 0, height: 4)
layer.shadowRadius = 12
imageView.translatesAutoresizingMaskIntoConstraints = false
imageView.contentMode = .scaleAspectFill
imageView.clipsToBounds = true
imageView.layer.cornerRadius = 9
imageView.layer.cornerCurve = .continuous
addSubview(imageView)
NSLayoutConstraint.activate([
imageView.topAnchor.constraint(equalTo: topAnchor),
imageView.leadingAnchor.constraint(equalTo: leadingAnchor),
imageView.trailingAnchor.constraint(equalTo: trailingAnchor),
imageView.bottomAnchor.constraint(equalTo: bottomAnchor)
])
}
override var isHighlighted: Bool {
didSet {
guard oldValue != isHighlighted else { return }
UIView.animate(withDuration: 0.4, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0, options: [.beginFromCurrentState, .allowUserInteraction], animations: {
let highlightedTransform = CGAffineTransform(scaleX: 0.94, y: 0.94).rotated(by: 5 * (CGFloat.pi) / 180) // Rotate by 5ºC clockwise
self.transform = self.isHighlighted ? highlightedTransform : .identity
})
}
}
required init?(coder: NSCoder) {
fatalError("\(#function) has not been implemented.")
}
}
final class ViewController: UIViewController {
private var isExpanded = false
private let cardViewSizes = (original: CGSize(width: 140, height: 200), expanded: CGSize(width: 400, height: 280))
private var cardViewWidthConstraint: NSLayoutConstraint!
private var cardViewHeightConstraint: NSLayoutConstraint!
private let cardView = CardView()
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = UIColor.systemGray3
cardView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(cardView)
cardViewWidthConstraint = cardView.widthAnchor.constraint(equalToConstant: cardViewSizes.original.width)
cardViewHeightConstraint = cardView.heightAnchor.constraint(equalToConstant: cardViewSizes.original.height)
NSLayoutConstraint.activate([
cardView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
cardView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
cardViewWidthConstraint,
cardViewHeightConstraint
])
cardView.addTarget(self, action: #selector(tapHandler), for: .touchUpInside)
}
@objc private func tapHandler() {
UIView.animate(withDuration: 0.6, delay: 0, usingSpringWithDamping: 0.6, initialSpringVelocity: 1, options: [.beginFromCurrentState, .allowUserInteraction], animations: {
let newCardSize = self.isExpanded ? self.cardViewSizes.original : self.cardViewSizes.expanded
self.cardViewWidthConstraint.constant = newCardSize.width
self.cardViewHeightConstraint.constant = newCardSize.height
self.view.layoutIfNeeded()
})
self.isExpanded.toggle()
}
}
PlaygroundPage.current.liveView = ViewController()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment