swift使用SDPhotoBriwser浏览图片教程 swift使用SDPhotoBriwser浏览图片教

场景：我们在使用app的时候，特别是显示多张图片的时候，都会点击图片并进行浏览，比如QQ、微信，好友发表的动态，我们都会点击进去查看原图。现在很多app都支持图片浏览功能，这样更加方便用户体验，那么我们在项目开发过程中，怎么对图片点击进行预览，下面介绍一下在swift项目开发中使用SDPhotoBrowser进行图片浏览。
SDPhotoBrowser地址：https://github.com/gsdios/SDPhotoBrowser
下面直接代码进行说明

////ShopStoreTableHeaderView.swift//SmartMilk////Created by lin jiang on 2017/7/11.//Copyright ? 2017年 greengao. All rights reserved.// import UIKit //添加SDPhotoBrowserDelegate代理class ShopStoreTableHeaderView: UIView,UIScrollViewDelegate,SDPhotoBrowserDelegate { var storeImages:NSMutableArray = NSMutableArray()var mainScrollView:UIScrollView?var mainPageControl:UIPageControl?var mainTimer:Timer?var isMiddleShow:Bool = falseoverride init(frame: CGRect) {super.init(frame: frame)setScrollViewUI()setPageControlUI()}required init?(coder aDecoder: NSCoder) {fatalError("init(coder:) has not been implemented")}func setScrollViewUI(){self.mainScrollView = UIScrollView(frame: CGRect(x: 0, y: 0, width: self.width, height: self.height))// 添加到父视图self.addSubview(self.mainScrollView!)// 背景颜色//arc4random()self.mainScrollView?.backgroundColor = UIColor.white// 自适应父视图// self.mainScrollView.autoresizingMask = UIViewAutoresizing.FlexibleHeight// 其他属性self.mainScrollView?.isScrollEnabled = true // 上下滚动self.mainScrollView?.scrollsToTop = true // 点击状态栏时，可以滚动回顶端self.mainScrollView?.bounces = true // 在最顶端或最底端时，仍然可以滚动，且释放后有动画返回效果mainScrollView?.isPagingEnabled = true // 分页显示效果mainScrollView?.showsHorizontalScrollIndicator = false // 显示水平滚动条mainScrollView?.showsVerticalScrollIndicator = true // 显示垂直滚动条mainScrollView?.indicatorStyle = UIScrollViewIndicatorStyle.white // 滑动条的样式// 设置内容大小// self.mainScrollView?.contentSize = CGSize(width: originX, height: scrollViewHeight)// 代理self.mainScrollView?.delegate = self}func setPageControlUI(){self.mainPageControl = UIPageControl(frame: CGRect(x: (self.width - 150.0) / 2, y: ((self.mainScrollView?.bounds)!.height - 20.0 - 10.0), width: 150.0, height: 20.0))// 添加到父视图self.addSubview(self.mainPageControl!)// 背景颜色self.mainPageControl?.backgroundColor = UIColor.clear// 其他属性设置self.mainPageControl?.numberOfPages = 0 // 总页数self.mainPageControl?.currentPage = 0 // 当前页数，默认为0，即第一个，实际数量是0~n-1self.mainPageControl?.pageIndicatorTintColor = UIColor.lightGray // 非当前页颜色self.mainPageControl?.currentPageIndicatorTintColor = UIColor.red // 当前页颜色 }func setMainScrollViewPageControl(images:[StoreImageModel]) {self.storeImages.removeAllObjects()self.storeImages.addObjects(from: images)for viewin (self.mainScrollView?.subviews)! {view.removeFromSuperview()}var originX:CGFloat = 0.0for model in images{let imageView = UIImageView(frame: CGRect(x:originX, y:0.0, width:SCREEN_WIDTH, height:self.height))let url = URL(string: model.storeSmallImg!)let image = UIImage(named: "default_icon")// weak var weakSelf = selfimageView.sd_setImage(with: url, placeholderImage: image, options: .retryFailed, completed: { (image, error, cacheType, URL) in})//添加UI Image View的点击事情let tap = UITapGestureRecognizer(target: self, action: #selector(onClickedImageEvent(gest:)))imageView.isUserInteractionEnabled = trueimageView.addGestureRecognizer(tap)//主要是显示区分显示大点的图和小点的图if isMiddleShow == true{let contentView = UIView(frame: CGRect(x:originX, y:0.0, width:self.width, height:self.height))let imagexx = (SCREEN_WIDTH - self.height)/2imageView.frame = CGRect(x:imagexx, y:0.0, width:self.height, height:self.height)contentView.addSubview(imageView)self.mainScrollView?.addSubview(contentView)originX = (contentView.frame.minX + contentView.frame.width)}else{self.mainScrollView?.addSubview(imageView)originX = (imageView.frame.minX + imageView.frame.width)}}self.mainScrollView?.contentSize = CGSize(width: originX, height: self.height)self.mainPageControl?.numberOfPages = images.count // 总页数self.mainPageControl?.currentPage = 0 // 当前页数，默认为0，即第一个，实际数量是0~n-1}func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {MQLog(message:"6 scrollViewDidEndDecelerating")let width = scrollView.frame.widthlet offsetX = scrollView.contentOffset.xlet index = offsetX / widthMQLog(message:"当前页是：\(index)")self.mainPageControl?.currentPage = Int(index)}func addTimer(){self.mainTimer = Timer.scheduledTimer(timeInterval: 2.0, target: self, selector: #selector(autoShow), userInfo: nil, repeats: true)}func removerTimer(){if self.mainTimer != nil{self.mainTimer?.invalidate()self.mainTimer = nil}}func autoShow(){var page:Int = (self.mainPageControl?.currentPage)!let total = (self.mainPageControl?.numberOfPages)! - 1if total == page{page = 0}else{page += 1}// 设置偏移量let offsetX = CGFloat(page) * (self.mainScrollView?.frame)!.widthself.mainScrollView?.setContentOffset(CGPoint(x:offsetX, y:0.0), animated: true)self.mainPageControl?.currentPage = page}func onClickedImageEvent(gest:UITapGestureRecognizer) {let browser = SDPhotoBrowser()//显示图片UIImageView的父控件browser.sourceImagesContainerView =self.mainScrollView//显示图片的总数量browser.imageCount = self.storeImages.countif self.storeImages.count > (self.mainPageControl?.currentPage)! {browser.currentImageIndex = (self.mainPageControl?.currentPage)!}else{//要显示的当前图片下标位置browser.currentImageIndex = 0}browser.delegate = selfbrowser.show()}/**************************************************************///返回当前UIImageView显示的图片func photoBrowser(_ browser: SDPhotoBrowser!, placeholderImageFor index: Int) -> UIImage! {if self.isMiddleShow{let contentView = self.mainScrollView?.subviews[index]let imageView:UIImageView = contentView?.subviews[0]as! UIImageViewreturn imageView.image}else{let imageView:UIImageView = self.mainScrollView?.subviews[index]as! UIImageViewreturn imageView.image}}//设置要显示图片资源的地址func photoBrowser(_ browser: SDPhotoBrowser!, highQualityImageURLFor index: Int) -> URL! {let model = self.storeImages[index] as! StoreImageModellet url = URL(string: model.storeBigImg!)return url}}

运行结果：以上图片资源的地址就不提供了，是公司的资源，百度随便找几张图片就可以了