从今天开始,我学习的重点开始转向Swift,并且会分享一些自己学习的心得体会,今天给大家带来的的是无限轮播。广告页的无限轮播是非常常见的一个功能,大多数APP都有,大多数程序员也都实现过,今天我们用Swift实现一下。项目地址

  图片切换我们可以选择的基本控件有两个UIScrollView 和 UICollectionView,这次我们选择UICollectionView;既然是轮播,就会用到Timer。所以,我们这次主要应用的知识点为UICollectionView 和 Timer;

import UIKit

class CycleScrollView: UIView, UICollectionViewDelegate,UICollectionViewDataSource {

    var bottomView : UICollectionView?
var width : CGFloat?
var height : CGFloat?
var timer : Timer? override init(frame: CGRect){ super.init(frame: frame)
// 1.设置背景色
self.backgroundColor = UIColor.clear
// 2.设置宽高
width = self.frame.size.width
height = self.frame.size.height
// 3.添加bottomView
setupBottomView()
// 4.添加定时器
setupTimer()
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
} func setupBottomView() { // 5.设置collectionView的布局
let flowLayout = UICollectionViewFlowLayout();
flowLayout.itemSize = self.bounds.size
flowLayout.minimumLineSpacing = 0;
flowLayout.minimumInteritemSpacing = 0;
flowLayout.scrollDirection = UICollectionViewScrollDirection.horizontal;
bottomView = UICollectionView.init(frame: self.bounds, collectionViewLayout: flowLayout)
self.addSubview(bottomView!);
// 6.设置collectionView的尺寸
bottomView?.contentSize = CGSize(width:width! * CGFloat(4),height:height!)
// 7.分页
bottomView?.isPagingEnabled = true
// 8.去掉滚动条
bottomView?.showsVerticalScrollIndicator = false
bottomView?.showsHorizontalScrollIndicator = false
// 9.设置代理
bottomView?.delegate = self
bottomView?.dataSource = self
// 10.注册cell
bottomView?.register(UICollectionViewCell().classForCoder, forCellWithReuseIdentifier: "ID");
if #available(iOS 10.0, *) {
// 11.预加载
bottomView?.isPrefetchingEnabled = true
} else {
// Fallback on earlier versions
}
}
func setupTimer() {
// 12.实例化定时器
timer = Timer.init(timeInterval: 2, target: self, selector: #selector(timerAction), userInfo: nil, repeats: true);
RunLoop.main.add(timer!, forMode: RunLoopMode.defaultRunLoopMode); DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 2) { self.timer?.fire();
}
}
func timerAction() { var contentOffsetX = (self.bottomView?.contentOffset.x)! + self.frame.size.width if contentOffsetX > self.frame.size.width * 3 {
// 当前视图显示的是第三个的时候,设置bottomView的偏移量为0
self.bottomView?.contentOffset = CGPoint(x:0,y:0)
contentOffsetX = self.frame.size.width
}
self.bottomView?.setContentOffset(CGPoint(x:contentOffsetX,y:0), animated: true)
}
// 重写removeFromSuperview方法,用于删除定时器,否则定时器一直存在,浪费内存
override func removeFromSuperview() { timer?.invalidate()
timer = nil
super.removeFromSuperview()
}
// Mark:UICollectionViewDataSource
// 设置Itmes
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return 4;
}
// 设置cell
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell : UICollectionViewCell = collectionView.dequeueReusableCell(withReuseIdentifier: "ID", for: indexPath)
for view : UIView in cell.contentView.subviews { view.removeFromSuperview()
}
let imageView = UIImageView.init(frame: cell.contentView.bounds)
if indexPath.row < 3 { imageView.image = UIImage.init(named: String(indexPath.row)) } else {
imageView.image = UIImage.init(named: String(0))
}
cell.contentView.addSubview(imageView) return cell;
}
// Mark:UICollectionViewDelegate
// 点击方法
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { print("您点击了第 \(indexPath.row == 3 ? 0 : indexPath.row) 个");
} }

  UICollectionView 和 Timer的用法和OC基本相同。Swift和OC的UI部分应该是一致的,因为底层都是OpenGL。我直接说一下区别:

1.Timer:如果重复,OC是等一个间隔再执行的,Swift是立即执行的,所以我用了GCD延时开启定时器。

2.Swift 没有 CGPointZero。

  无限轮播的原理就是在最后面多添加一个和第一个相同的itme。当你滑动到最后一个itme时,把UICollectionView的contentOffset置零,继续向右活动。如果不添加,会给用户一种卡顿的感觉。

Swift应用案例 1.无限轮播的更多相关文章

  1. iOS开发之三个Button实现图片无限轮播(参考手机淘宝,Swift版)

    这两天使用Reveal工具查看"手机淘宝"App的UI层次时,发现其图片轮播使用了三个UIButton的复用来实现的图片循环无缝滚动.于是乎就有了今天这篇博客,看到“手机淘宝”这个 ...

  2. swift-自定义无限轮播图

    一  前言 1.之前一直在用OC编程,最近才开始接触使用swift就发现使用OC越来越不习惯,感觉已经爱上了swift. 2.这个自定义轮播图只是对之前OC版本进行了翻译,欢迎指正. 3.我决定一步步 ...

  3. iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView

    iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView 时间:2016-01-19 19:13:43      阅读:630      评论:0      收藏:0   ...

  4. iOS开发之ImageView复用实现图片无限轮播

    在上篇博客中iOS开发之多图片无缝滚动组件封装与使用给出了图片无限轮播的实现方案之一,下面在给出另一种解决方案.今天博客中要说的就是在ScrollView上贴两个ImageView, 把ImageVi ...

  5. iOS开发UI篇—无限轮播(循环利用)

    iOS开发UI篇—无限轮播(循环利用) 一.无限轮播  1.简单说明 在开发中常需要对广告或者是一些图片进行自动的轮播,也就是所谓的无限滚动. 在开发的时候,我们通常的做法是使用一个UIScrollV ...

  6. iOS开发UI篇—无限轮播(新闻数据展示)

    iOS开发UI篇—无限轮播(新闻数据展示) 一.实现效果        二.实现步骤 1.前期准备 (1)导入数据转模型的第三方框架MJExtension (2)向项目中添加保存有“新闻”数据的pli ...

  7. iOS开发UI篇—无限轮播(循环展示)

    iOS开发UI篇—无限轮播(循环展示) 一.简单说明 之前的程序还存在一个问题,那就是不能循环展示,因为plist文件中只有五个数组,因此第一个和最后一个之后就没有了,下面介绍处理这种循环展示问题的小 ...

  8. iOS开发UI篇—无限轮播(功能完善)

    iOS开发UI篇—无限轮播(功能完善) 一.自动滚动 添加并设置一个定时器,每个2.0秒,就跳转到下一条. 获取当前正在展示的位置. [self addNSTimer]; } -(void)addNS ...

  9. Android--ViewPager的无限轮播

    ViewPage_RadioButton实现带小圆点的无限轮播,效果还能凑合着用. 1.在ViewPage的监听里面这样处理 @Override public void onPageSelected( ...

随机推荐

  1. js原生设计模式——9外观模式封装

    1.事件处理程序兼容性封装 <!DOCTYPE html><html lang="en"><head>    <meta charset= ...

  2. js架构设计模式——前端MVVM框架设计及实现(二)

    前端MVVM框架设计及实现(二) 在前端MVVM框架设计及实现(一)中有一个博友提出一个看法: “html中使用mvvm徒增开发成本” 我想这位朋友要表达的意思应该是HTML定义了大量的语法标记,HT ...

  3. js原生设计模式——4安全的工厂方法模式之oop编程增强版

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  4. glyph

    glyph[英][glɪf][美][ɡlɪf]n.象形文字; 纵的沟纹; 竖沟; 浮雕;

  5. SVG的基础使用

    SVG的基础使用: <%@ page language="java" contentType="text/html; charset=UTF-8" pag ...

  6. Session是否为新建情况的判断

    Session是否为新建情况的判断: Xml: <?xml version="1.0" encoding="UTF-8"?> <web-app ...

  7. 关于在官网上下载Eclipse遇到的问题!!

    首先Eclipse是什么? Eclipse 是一个开放源代码的.基于Java的可扩展开发平台.就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境. 幸运的是,Eclipse 附带了一 ...

  8. github使用及代码同步

    github是近两年比较火的分布式版本控制工具,很多nb的开源项目代码都托管在github上,比如Facebook.JQuery.Node.js等等,这里简单介绍一下github使用方法以及和本地工程 ...

  9. Nancy简单实战之NancyMusicStore(五):部署上线

    前言 经过本系列前面四篇文章,NancyMusicStore已经开发完成了,下面就差部署上线了,我们会在两个不同的环境部署.其实之前的文章也有讲解在 Linux下部署的相关事宜.下面开始本文的内容. ...

  10. C# OpenFileDialog 使用

    OpenFileDialog ofd = new OpenFileDialog(); //设置标题 ofd.Title = "选择文件"; //是否保存上次打开文件的位置 ofd. ...