github地址:ZoomingTransition
相信大家都用过微信,在聊天时点击图片,会从图片弹出预览页。在预览页点击关闭,会缩回到原图片。今天带一起来实现这个效果。
example.gif
1.先引入这个库
pod 'ZoomingTransition'
2.创建你自己的PushVC继承自ZoomPushVC,并实现ZoomTransitionAnimatorDelegate
class MyPushVC : ZoomPushVC,ZoomTransitionAnimatorDelegate{
var lastSelectedIndexPath: IndexPath? = nil
//your own code...
func transitionWillStart() {
guard let lastSelected = self.lastSelectedIndexPath else { return }
self.collectionView.cellForItem(at: lastSelected)?.isHidden = true
}
func transitionDidEnd() {
guard let lastSelected = self.lastSelectedIndexPath else { return }
self.collectionView.cellForItem(at: lastSelected)?.isHidden = false
}
func referenceImage() -> UIImage? {
guard
let lastSelected = self.lastSelectedIndexPath,
let cell = self.collectionView.cellForItem(at: lastSelected) as? CustomCell
else {
return nil
}
return cell.imageView.image
}
func imageFrame() -> CGRect? {
guard
let lastSelected = self.lastSelectedIndexPath,
let cell = self.collectionView.cellForItem(at: lastSelected) as? CustomCell
else {
return nil
}
return FrameHelper.getTargerFrame(originalView: cell.imageView, targetView: self.view)
}
}
3.当在UICollectionview点击图片时,记录下index
class MyPushVC : ZoomPushVC,ZoomTransitionAnimatorDelegate{
//with the code above ...
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
self.lastSelectedIndexPath = indexPath
let vc = PreviewVC()
vc.image = self.slices[indexPath.row]
self.navigationController?.pushViewController(vc, animated: true)
}
}
4.创建你自己的PopVC,实现ZoomTransitionAnimatorDelegate
class PreviewVC: UIViewController,ZoomTransitionAnimatorDelegate{
//...your own code
//when back button clicked
@objc func close(){
self.navigationController?.popViewController(animated: true)
}
func transitionWillStart() {
// self.imageView.isHidden = true
self.view.alpha = 0
}
func transitionDidEnd() {
// self.imageView.isHidden = true
self.view.alpha = 1
}
func referenceImage() -> UIImage? {
return FrameHelper.getScreenshot(with: self.view)
}
func imageFrame() -> CGRect? {
return self.view.frame
}
}
这样就可以实现了,省去了自己写转场动画的烦恼,是不是很简单呢?
github地址:ZoomingTransition 欢迎点赞