中国领先的工业平台

返回贤集网 返回微头条
贤集网技术微头条APP获取

iOS开发商品页中banner中点击查看图片

 山东大明消毒科技有限公司

下载贤集网APP入驻自媒体

轮翻播放与查看是分开的,轮翻是是用 开源的SDCycleScrollView

这里是给出的是查看的:

//

// FullScreenShowImageView.swift

// joopic

//

// Created by jianxiong li on 16/9/27.

// Copyright ? 2016年 joobot. All rights reserved.

//

import Foundation

import UIKit

//图片轮播组件代理协议

protocol FullScreenShowImageViewDelegate{

//获取数据源

func galleryDataSource()->[String]

//获取内部scrollerView的宽高尺寸

func galleryScrollerViewSize()->CGSize

func hiddenForCliked(index:Int)

}

//图片轮播组件控制器

class FullScreenShowImageView: UIView,UIScrollViewDelegate{

//代理对象

var delegate : FullScreenShowImageViewDelegate!

//屏幕宽度

let kScreenWidth = BWidth

//当前展示的图片索引

var currentIndex : Int = 0

//数据源

var dataSource : [String]?

//用于轮播的左中右三个image(不管几张图片都是这三个imageView交替使用)

var leftImageView , middleImageView , rightImageView : UIImageView?

//放置imageView的滚动视图

var scrollerView : UIScrollView?

//scrollView的宽和高

var scrollerViewWidth : CGFloat?

var scrollerViewHeight : CGFloat?

//页控制器(小圆点)

var pageControl : UIPageControl?

//加载指示符(用来当iamgeView还没将图片显示出来时,显示的图片)

var placeholderImage:UIImage!

//自动滚动计时器

var autoScrollTimer:NSTimer?

init(frame: CGRect,delegate:FullScreenShowImageViewDelegate) {

super.init(frame: frame)

self.delegate = delegate

praperaUI()

}

required init?(coder aDecoder: NSCoder) {

fatalError("init(coder:) has not been implemented")

}

func praperaUI() {

//获取并设置scrollerView尺寸

let size : CGSize = self.delegate.galleryScrollerViewSize()

self.scrollerViewWidth = size.width

self.scrollerViewHeight = size.height

//获取数据

self.dataSource = self.delegate.galleryDataSource()

//设置scrollerView

self.configureScrollerView()

//设置加载指示图片

self.configurePlaceholder()

//设置imageView

self.configureImageView()

//设置页控制器

self.configurePageController()

//设置自动滚动计时器

//self.configureAutoScrollTimer()

self.backgroundColor = UIColor.blackColor()

self.addTapAction()

}

func addTapAction(){

//添加组件的点击事件

let tap = UITapGestureRecognizer(target: self,

action: #selector(FullScreenShowImageView.handleTapAction(_:)))

self.addGestureRecognizer(tap)

}

//点击事件响应

func handleTapAction(tap:UITapGestureRecognizer)->Void{

//获取图片索引值

self.delegate.hiddenForCliked(self.currentIndex)

self.dismissViewAnimate()

}

func presentViewAnimate() {

let fr = self.middleImageView?.frame

self.middleImageView?.frame = CGRect(x: fr!.origin.x, y: 22, width: fr!.width, height: fr!.height)

UIView.animateWithDuration(10, animations: {

self.middleImageView?.frame = fr!

}) { (_) in

}

}

func dismissViewAnimate() {

let fr = self.middleImageView?.frame

self.middleImageView?.frame = CGRect(x: fr!.origin.x, y: fr!.origin.y - StatusAndNavHeight, width: fr!.width, height: fr!.height)

UIView.animateWithDuration(10, animations: {

self.middleImageView?.frame = CGRect(x: fr!.origin.x , y: -42, width: fr!.width, height: fr!.height)

}) { (_) in

self.hidden = true

self.middleImageView?.frame = fr!

}

}

//设置scrollerView

func configureScrollerView(){

self.scrollerView = UIScrollView(frame: CGRect(x: 0,y: 0,

width: self.scrollerViewWidth!, height: BHeight))

self.scrollerView?.backgroundColor = UIColor.blackColor()

self.scrollerView?.delegate = self

self.scrollerView?.contentSize = CGSize(width: self.scrollerViewWidth! * 3,

height: BHeight)

//滚动视图内容区域向左偏移一个view的宽度

self.scrollerView?.contentOffset = CGPoint(x: self.scrollerViewWidth!, y: 0)

self.scrollerView?.pagingEnabled = true

self.scrollerView?.bounces = false

self.addSubview(self.scrollerView!)

}

//设置加载指示图片

func configurePlaceholder(){

//这里我使用ImageHelper将文字转换成图片,作为加载指示符

let font = UIFont.systemFontOfSize(17)// UIFont.systemFont(ofSize: 17.0, weight: UIFontWeightMedium)

let size = CGSize(width: self.scrollerViewWidth!, height: self.scrollerViewHeight!)

placeholderImage = UIImage(named: "图片加载中...")

}

//设置imageView

func configureImageView(){

self.leftImageView = UIImageView(frame: CGRect(x: 0, y: (BHeight-scrollerViewHeight!)/2,

width: self.scrollerViewWidth!, height: self.scrollerViewHeight!))

self.middleImageView = UIImageView(frame: CGRect(x: self.scrollerViewWidth!, y: (BHeight-scrollerViewHeight!)/2,

width: self.scrollerViewWidth!, height: self.scrollerViewHeight! ));

self.rightImageView = UIImageView(frame: CGRect(x: 2*self.scrollerViewWidth!, y: (BHeight-scrollerViewHeight!)/2,

width: self.scrollerViewWidth!, height: self.scrollerViewHeight!));

self.scrollerView?.showsHorizontalScrollIndicator = false

self.leftImageView?.contentMode = UIViewContentMode.ScaleAspectFit

self.middleImageView?.contentMode = UIViewContentMode.ScaleAspectFit

self.rightImageView?.contentMode = UIViewContentMode.ScaleAspectFit

//设置初始时左中右三个imageView的图片(分别时数据源中最后一张,第一张,第二张图片)

if(self.dataSource?.count != 0){

resetImageViewSource()

}

self.scrollerView?.addSubview(self.leftImageView!)

self.scrollerView?.addSubview(self.middleImageView!)

self.scrollerView?.addSubview(self.rightImageView!)

}

//设置页控制器

func configurePageController() {

self.pageControl = UIPageControl(frame: CGRect(x: kScreenWidth/2-60,

y: BHeight - 30, width: 120, height: 20))

self.pageControl?.numberOfPages = (self.dataSource?.count)!

self.pageControl?.userInteractionEnabled = false

self.addSubview(self.pageControl!)

}

//设置自动滚动计时器

func configureAutoScrollTimer() {

//设置一个定时器,每三秒钟滚动一次

autoScrollTimer = NSTimer.scheduledTimerWithTimeInterval(3, target: self, selector: #selector(SliderGalleryController.letItScroll), userInfo: nil, repeats: true)

}

//计时器时间一到,滚动一张图片

func letItScroll(){

let offset = CGPoint(x: 2*scrollerViewWidth!, y: 0)

self.scrollerView?.setContentOffset(offset, animated: true)

}

//每当滚动后重新设置各个imageView的图片

func resetImageViewSource() {

//当前显示的是第一张图片

if self.currentIndex == 0 {

self.leftImageView?.sd_setImageWithURL(NSURL(string: self.dataSource!.last!))

self.middleImageView?.sd_setImageWithURL(NSURL(string: self.dataSource!.first!))

let rightImageIndex = (self.dataSource?.count)!>1 ? 1 : 0 //保护

self.rightImageView?.sd_setImageWithURL(NSURL(string: self.dataSource![rightImageIndex]))

}

//当前显示的是最后一张图片

else if self.currentIndex == (self.dataSource?.count)! - 1 {

self.leftImageView?.sd_setImageWithURL(NSURL(string:self.dataSource![self.currentIndex-1]))

self.middleImageView?.sd_setImageWithURL(NSURL(string: self.dataSource!.last!))

self.rightImageView?.sd_setImageWithURL(NSURL(string: self.dataSource!.first!))

}

//其他情况

else{

self.leftImageView?.sd_setImageWithURL(NSURL(string:self.dataSource![self.currentIndex-1]))

self.middleImageView?.sd_setImageWithURL(NSURL(string: self.dataSource![self.currentIndex]))

self.rightImageView?.sd_setImageWithURL(NSURL(string: self.dataSource![self.currentIndex+1]))

}

//设置页控制器当前页码

self.pageControl?.currentPage = self.currentIndex

}

//scrollView滚动完毕后触发

func scrollViewDidScroll(scrollView: UIScrollView) {

//获取当前偏移量

let offset = scrollView.contentOffset.x

if(self.dataSource?.count != 0){

//如果向左滑动(显示下一张)

if(offset >= self.scrollerViewWidth!*2){

//还原偏移量

scrollView.contentOffset = CGPoint(x: self.scrollerViewWidth!, y: 0)

//视图索引+1

self.currentIndex = self.currentIndex + 1

if self.currentIndex == self.dataSource?.count {

self.currentIndex = 0

}

}

//如果向右滑动(显示上一张)

if(offset <= 0){

//还原偏移量

scrollView.contentOffset = CGPoint(x: self.scrollerViewWidth!, y: 0)

//视图索引-1

self.currentIndex = self.currentIndex - 1

if self.currentIndex == -1 {

self.currentIndex = (self.dataSource?.count)! - 1

}

}

//重新设置各个imageView的图片

resetImageViewSource()

}

}

//手动拖拽滚动开始

func scrollViewWillBeginDragging(scrollView: UIScrollView) {

//使自动滚动计时器失效(防止用户手动移动图片的时候这边也在自动滚动)

//autoScrollTimer?.invalidate()

}

//手动拖拽滚动结束

func scrollViewDidEndDragging(scrollView: UIScrollView,

willDecelerate decelerate: Bool) {

//重新启动自动滚动计时器

//configureAutoScrollTimer()

}

}

复制代码

如何使用:

var sliderGallery : FullScreenShowImageView!

var bannerCurrentIndex:Int = 0

//图片轮播组件协议方法:获取内部scrollView尺寸

func galleryScrollerViewSize() -> CGSize {

return CGSize(width: BWidth, height: BHeight/2)

}

//图片轮播组件协议方法:获取数据集合

func galleryDataSource() -> [String] {

return self.bannerView.imageURLStringsGroup as! [String]

}

//点击事件响应

func hiddenForCliked(index:Int){

if(bannerCurrentIndex != index){

self.bannerView.scrollToIndex(Int32(index))

}

self.navigationController?.setNavigationBarHidden(false, animated: false)

}

func showImageGallery(index:Int){

//初始化图片轮播组件

if(sliderGallery == nil){

sliderGallery = FullScreenShowImageView(frame: CGRect(x: 0, y: 0, width: BWidth,

height: BHeight),delegate:self)

sliderGallery.currentIndex = index

sliderGallery.resetImageViewSource()

//将图片轮播组件添加到当前视图

self.view.addSubview(sliderGallery)

}else{

sliderGallery.currentIndex = index

sliderGallery.resetImageViewSource()

sliderGallery.hidden = false

}

self.sliderGallery.presentViewAnimate()

self.navigationController?.setNavigationBarHidden(true, animated: false)

}

//pragma -- SDCycleScrollViewDelegate

func cycleScrollView(cycleScrollView: SDCycleScrollView!, didSelectItemAtIndex index: Int) {

print("--------index:\(index)")

bannerCurrentIndex = index

self.showImageGallery(index)

}

复制代码

以上就是本次我们整理的代码全部内容


最新回复

还没有人回复哦,抢沙发吧~

发布回复

为您推荐

热门交流