Анимация ячейки при нажатии с помощью Swift 3
Моя проблема действительно проста. Я хотел бы анимировать ячейку в collectionView. Действительно, я хотел бы показать серый фон за ячейкой и уменьшить изображение внутри.
Это будет (почти) тот же эффект, что и Pinterest:
![enter image description here]()
Я использовал кодирование этой анимации на кнопках, но никогда не делал этого на ячейке. Как связать ячейку, например, с действием TouchUpInside или TouchDown?
Ответы
Ответ 1
Если вы хотите начать анимацию при касании ячейки, вы можете реализовать didHighlightItemAt
. Вероятно, вы захотите отменить его в didUnhighlightItemAt
:
override func collectionView(_ collectionView: UICollectionView, didHighlightItemAt indexPath: IndexPath) {
UIView.animate(withDuration: 0.5) {
if let cell = collectionView.cellForItem(at: indexPath) as? CustomCell {
cell.imageView.transform = .init(scaleX: 0.95, y: 0.95)
cell.contentView.backgroundColor = UIColor(red: 0.95, green: 0.95, blue: 0.95, alpha: 1)
}
}
}
override func collectionView(_ collectionView: UICollectionView, didUnhighlightItemAt indexPath: IndexPath) {
UIView.animate(withDuration: 0.5) {
if let cell = collectionView.cellForItem(at: indexPath) as? CustomCell {
cell.imageView.transform = .identity
cell.contentView.backgroundColor = .clear
}
}
}
Это дает:
![demo]()
Ответ 2
Попробуйте следующее:
В пользовательском UICollectionViewCell
измените imageView
transform
, когда ячейка выбрана, т.е.
class CollectionViewCell: UICollectionViewCell
{
@IBOutlet weak var imageView: UIImageView!
override var isSelected: Bool{
didSet{
UIView.animate(withDuration: 2.0) {
self.imageView.transform = self.isSelected ? CGAffineTransform(scaleX: 0.9, y: 0.9) : CGAffineTransform.identity
}
}
}
}
Ответ 3
Если вам нужно реализовать эту функцию только для конкретной ячейки, просто добавьте этот код к вашей реализации ячейки:
override var isHighlighted: Bool {
didSet {
UIView.animate(withDuration: 0.5) {
let scale: CGFloat = 0.9
self.transform = self.isHighlighted ? CGAffineTransform(scaleX: scale, y: scale) : .identity
}
}
}
Это тот же ответ, который предложил [pgdev] [1], но для isHighlighted
Ответ 4
У вас есть несколько вариантов.
-
Вы можете реализовать метод делегата view collectionView(:didSelectItemAtIndexPath:)
и поместить туда свой код.
-
Вы можете прикрепить к вашему виду распознаватель жестов касаний, который вы хотите реагировать на касания.
-
Вы можете создать пользовательскую кнопку и установить в нее изображение, а затем использовать метод IBAction для кнопки, как обычно.
Ответ 5
Swift: 4 Вам нужно реализовать пользовательский UICollectionViewCell
, изменить transform
contentView
ИЛИ imageView
при contentView
ячейки
override var isSelected: Bool {
didSet{
UIView.animate(withDuration: 1.0, animations:
{
self.contentView.transform = self.isSelected ? CGAffineTransform(scaleX: 0.95, y: 0.95) : CGAffineTransform.identity
self.contentView.backgroundColor = UIColor(red: 0.95, green: 0.95, blue: 0.95, alpha: 1)
}) { (true) in
UIView.animate(withDuration: 0.5, animations:
{
self.contentView.transform = self.isSelected ? CGAffineTransform(scaleX: 1.0, y: 1.0) : CGAffineTransform.identity
self.contentView.backgroundColor = UIColor.clear
})
}
}
}
Ответ 6
Swift 4.2, внутри UICollectionViewCell
//MARK:- Events
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
super.touchesBegan(touches, with: event)
animate(isHighlighted: true)
}
override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
super.touchesEnded(touches, with: event)
animate(isHighlighted: false)
}
override func touchesCancelled(_ touches: Set<UITouch>, with event: UIEvent?) {
super.touchesCancelled(touches, with: event)
animate(isHighlighted: false)
}
//MARK:- Private functions
private func animate(isHighlighted: Bool, completion: ((Bool) -> Void)?=nil) {
let animationOptions: UIView.AnimationOptions = [.allowUserInteraction]
if isHighlighted {
UIView.animate(withDuration: 0.5,
delay: 0,
usingSpringWithDamping: 1,
initialSpringVelocity: 0,
options: animationOptions, animations: {
self.transform = .init(scaleX: 0.96, y: 0.96)
}, completion: completion)
} else {
UIView.animate(withDuration: 0.5,
delay: 0,
usingSpringWithDamping: 1,
initialSpringVelocity: 0,
options: animationOptions, animations: {
self.transform = .identity
}, completion: completion)
}
}