虚位以待(AD)
虚位以待(AD)
首页 > 软件编程 > IOS编程/Objective-C > swift3.0实现图片放大缩小动画效果

swift3.0实现图片放大缩小动画效果
类别:IOS编程/Objective-C   作者:码皇   来源:互联网   点击:

这篇文章主要为大家详细介绍了swift3 0实现图片放大缩小动画效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

一. 内容说明

      跟我之前这篇类似,只不过那篇是OC版本,这篇是Swift版本 OC版本链接地址

目的:通过kingfisher请求5张图片,展示出来。然后利用图片放大缩小管理类展示图片,多张图片可以滑动浏览

效果图如下,想看动态的效果图,请看上面链接中的OC版本效果图,跟这篇是一样的。

本demo,只加载本地图片的demo下载链接 ,需要加载网络图片的,需要下载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) //需要浏览的图片添加到数组 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 //当前选中的图片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<Any>, 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复用 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 //根据选中第几张图片直接展示出来 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) {
    //滑动时,会调用多次 }
    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
    //滑动完毕时,只会调用一次 let page = self.ljScrollView.contentOffset.x / self.frame.size.width;
    self.currentIndex = NSInteger(page);
    print("scrollViewDidEndDecelerating当前页数----(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图片放大动画效果 swift3 0图片缩