小編給大家分享一下swift3.0如何實現(xiàn)圖片放大縮小動畫效果，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
創(chuàng)新互聯(lián)致力于互聯(lián)網(wǎng)網(wǎng)站建設(shè)與網(wǎng)站營銷，提供成都做網(wǎng)站、成都網(wǎng)站設(shè)計、網(wǎng)站開發(fā)、seo優(yōu)化、網(wǎng)站排名、互聯(lián)網(wǎng)營銷、重慶小程序開發(fā)、公眾號商城、等建站開發(fā)，創(chuàng)新互聯(lián)網(wǎng)站建設(shè)策劃專家，為不同類型的客戶提供良好的互聯(lián)網(wǎng)應(yīng)用定制解決方案，幫助客戶在新的全球化互聯(lián)網(wǎng)環(huán)境中保持優(yōu)勢。
一. 內(nèi)容說明
跟我之前這篇類似，只不過那篇是OC版本，這篇是Swift版本 OC版本鏈接地址
目的：通過kingfisher請求5張圖片，展示出來。然后利用圖片放大縮小管理類展示圖片，多張圖片可以滑動瀏覽
效果圖如下，想看動態(tài)的效果圖，請看上面鏈接中的OC版本效果圖，跟這篇是一樣的。
本demo，只加載本地圖片的demo下載鏈接 ，需要加載網(wǎng)絡(luò)圖片的，需要下載Kingfisher
二.源碼展示
0. 圖片測試demo源碼
重慶分公司
重慶分公司
import Foundation
import UIKit
class LJPhotoGroupViewController : TFBaseViewController{
lazy var ljArray : [LJPhotoInfo] = [LJPhotoInfo]()
let ljUrlArray = ["http://pica.nipic.com/2007-12-12/20071212235955316_2.jpg",
"http://d.lanrentuku.com/down/png/1706/10avatars-material-pngs/avatars-material-man-4.png",
"http://image.nationalgeographic.com.cn/2017/0703/20170703042329843.jpg",
"http://image.nationalgeographic.com.cn/2015/0121/20150121033625957.jpg",
"http://image.nationalgeographic.com.cn/2017/0702/20170702124619643.jpg"]
override func viewDidLoad() {
super.viewDidLoad()
self.setTopNavBarTitle("圖片瀏覽測試Demo")
self.setTopNavBackButton()
self.setUI()
}
}
extension LJPhotoGroupViewController{
func setUI(){
for index in 0...4{
//1.加載本地圖片
//let image = UIImage.init(named: "\(index + 1).jpg")
let showImageView = UIImageView.init()
//showImageView.image = image
showImageView.tag = index
showImageView.frame = CGRect(x: Int((AppWidth - 200)/2.0), y: 80 + Int(90 * index), width: 200, height: 80)
showImageView.isUserInteractionEnabled = true
view.addSubview(showImageView)
//2.加載本地圖片
let url = URL(string:ljUrlArray[index])
showImageView.kf.setImage(with: url)
let gestrue = UITapGestureRecognizer.init(target: self, action: #selector(LJPhotoGroupViewController.showClicked(_:)))
showImageView.addGestureRecognizer(gestrue)
//需要瀏覽的圖片添加到數(shù)組
let info = LJPhotoInfo.init()
info.largeImageURLStr = ljUrlArray[index]
info.thumbImageview = showImageView
info.currentSelectIndex = index
self.ljArray.append(info)
}
}
}
extension LJPhotoGroupViewController{
func showClicked(_ sender : UITapGestureRecognizer){
if self.ljArray.count > 0 {
let index = sender.view?.tag
let photoGroupView = LJPhotoGroupView.init(frame: CGRect(x: 0, y: 0, width: AppWidth, height: AppHeight))
photoGroupView.setData(self.ljArray, selectedIndex: index!)
photoGroupView.showPhotoView()
CHDebugLog("-------\(String(describing: index))")
}
}
}1. LJPhotoGroupView：圖片瀏覽管理類，用于展示圖片
import Foundation
import UIKit
class LJPhotoGroupView: UIView {
let baseIndex = 1000
var originFrame : CGRect? // 圖片的源尺寸
var currentIndex : NSInteger = 0 //當(dāng)前選中的圖片index
var ljPhotoArray : [Any] = [Any]()//存儲多組需要加載的圖片原始信息
lazy var ljScrollView : UIScrollView = {
let view = UIScrollView.init(frame: CGRect(x: 0, y: 0, width: AppWidth, height: AppHeight))
view.delegate = self
view.isPagingEnabled = true
view.backgroundColor = UIColor.yellow
return view
}()
override init(frame: CGRect) {
super.init(frame: frame)
self.addSubview(self.ljScrollView)
}
func setData(_ photoArray : Array, selectedIndex : NSInteger) {
self.ljScrollView.contentSize = CGSize(width: floor(AppWidth) * CGFloat(photoArray.count), height: AppHeight)
self.currentIndex = selectedIndex
self.ljPhotoArray = photoArray
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
extension LJPhotoGroupView {
// MARK: -- 圖片cell復(fù)用
func dequeueReusableCell() -> LJPhotoView {
var cell = self.viewWithTag(baseIndex + self.currentIndex) as? LJPhotoView
if ljPhotoArray.count > currentIndex {
let info = ljPhotoArray[currentIndex] as? LJPhotoInfo
let tempImageView = info?.thumbImageview
if cell != nil{
self.originFrame = tempImageView?.convert((tempImageView?.bounds)!, to: self)
return cell!
}
cell = LJPhotoView.init(frame: CGRect(x: floor(AppWidth)*CGFloat(currentIndex), y: 0, width: AppWidth, height: AppHeight))
self.originFrame = tempImageView?.convert((tempImageView?.bounds)!, to: self)
}
return cell!
}
// MARK: -- 展示圖片
func showPhotoView(){
UIApplication.shared.keyWindow?.rootViewController?.view.addSubview(self)
self.backgroundColor = UIColor.black
let cell1 = self.dequeueReusableCell()
cell1.tag = self.baseIndex + self.currentIndex
var ljTempImage : UIImage?
if ljPhotoArray.count > currentIndex {
let info = ljPhotoArray[currentIndex] as? LJPhotoInfo
ljTempImage = info?.thumbImageview?.image
}
ljTempImage = (ljTempImage != nil) ? ljTempImage : UIImage.init(named: "pic_broadcast_gray_square")
let tfImageView = UIImageView.init(image: ljTempImage)
tfImageView.frame = self.originFrame ?? CGRect.zero
tfImageView.clipsToBounds = true
tfImageView.backgroundColor = UIColor.red
tfImageView.contentMode = .scaleAspectFit
self.addSubview(tfImageView)
//添加頁面消失的手勢
let tap = UITapGestureRecognizer.init(target: self, action: #selector(hideImageView))
self.addGestureRecognizer(tap)
UIView.animate(withDuration: 0.25, animations: {
let y : CGFloat? = (AppHeight - (ljTempImage?.size.height)! * AppWidth / (ljTempImage?.size.width)!)/2.0
let height : CGFloat? = (ljTempImage?.size.height)! * AppWidth / (ljTempImage?.size.width)!
tfImageView.frame = CGRect(x: 0, y: y!, width: AppWidth, height: height!)
}) { (finish) in
//根據(jù)選中第幾張圖片直接展示出來
let cell = self.dequeueReusableCell()
cell.tag = self.baseIndex + self.currentIndex
cell.backgroundColor = UIColor.gray
if self.ljPhotoArray.count > self.currentIndex{
cell.setCurrentImageview(self.ljPhotoArray[self.currentIndex] as! LJPhotoInfo)
}
let x : CGFloat = CGFloat(self.currentIndex) * floor(AppWidth);
self.ljScrollView.setContentOffset(CGPoint.init(x: x, y: 0), animated: false)
self.ljScrollView.addSubview(cell)
tfImageView.removeFromSuperview()
}
}
// MARK: -- 移除圖片
func hideImageView(){
let cell = self.viewWithTag(baseIndex + currentIndex) as? LJPhotoView
UIView.animate(withDuration: 0.25, animations: {
cell?.ljImageView.frame = self.originFrame!
}) { (finish) in
self.backgroundColor = UIColor.white
self.removeFromSuperview()
}
}
}
extension LJPhotoGroupView : UIScrollViewDelegate{
func scrollViewDidScroll(_ scrollView: UIScrollView) {
//滑動時，會調(diào)用多次
}
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
//滑動完畢時，只會調(diào)用一次
let page = self.ljScrollView.contentOffset.x / self.frame.size.width;
self.currentIndex = NSInteger(page);
print("scrollViewDidEndDecelerating當(dāng)前頁數(shù)----\(page)")
let cell = self.dequeueReusableCell()
cell.tag = self.baseIndex + Int(page)
if self.ljPhotoArray.count > self.currentIndex{
cell.setCurrentImageview(self.ljPhotoArray[self.currentIndex] as! LJPhotoInfo)
}
self.ljScrollView.addSubview(cell)
}
} 2. LJPhotoInfo：圖片信息的model
import Foundation
import UIKit
class LJPhotoInfo: NSObject {
var currentSelectIndex : Int?
var largeImageURLStr : String?
var thumbImageview : UIImageView?
override init() {
super.init()
}
}3.LJPhotoView：圖片瀏覽管理類用到的cell（圖片顯示）
import Foundation
import UIKit
class LJPhotoView: UIScrollView {
var ljInfo : LJPhotoInfo?
lazy var ljImageView : UIImageView = {
let view = UIImageView()
view.clipsToBounds = true
view.contentMode = .scaleAspectFit
return view
}()
override init(frame: CGRect) {
super.init(frame: frame)
self.zoomScale = 1.0
self.addSubview(self.ljImageView)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
extension LJPhotoView{
func setCurrentImageview(_ info : LJPhotoInfo){
self.ljInfo = info
if self.ljInfo?.thumbImageview?.image == nil{
self.ljInfo?.thumbImageview?.image = UIImage.init(named: "pic_broadcast_gray_square")
}
//無url，則通過thumbImageview獲取Image展示
//self.ljImageview.image = info.thumbImageview.image;
let y : CGFloat? = (AppHeight - (info.thumbImageview?.image?.size.height)! * AppWidth / (info.thumbImageview?.image?.size.width)!) * 0.5;
self.ljImageView.frame = CGRect(x: 0, y: y!, width: AppWidth, height: AppWidth*(info.thumbImageview?.image?.size.height)!/(info.thumbImageview?.image?.size.width)!)
self.ljImageView.image = self.ljInfo?.thumbImageview?.image
if info.largeImageURLStr != "" {
let url = URL(string:info.largeImageURLStr!)
self.ljImageView.kf.setImage(with: url)
}
}
}以上是“swift3.0如何實現(xiàn)圖片放大縮小動畫效果”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
