Swift应用案例 1.无限轮播
从今天开始,我学习的重点开始转向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.无限轮播的更多相关文章
- iOS开发之三个Button实现图片无限轮播(参考手机淘宝,Swift版)
这两天使用Reveal工具查看"手机淘宝"App的UI层次时,发现其图片轮播使用了三个UIButton的复用来实现的图片循环无缝滚动.于是乎就有了今天这篇博客,看到“手机淘宝”这个 ...
- swift-自定义无限轮播图
一 前言 1.之前一直在用OC编程,最近才开始接触使用swift就发现使用OC越来越不习惯,感觉已经爱上了swift. 2.这个自定义轮播图只是对之前OC版本进行了翻译,欢迎指正. 3.我决定一步步 ...
- iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView
iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView 时间:2016-01-19 19:13:43 阅读:630 评论:0 收藏:0 ...
- iOS开发之ImageView复用实现图片无限轮播
在上篇博客中iOS开发之多图片无缝滚动组件封装与使用给出了图片无限轮播的实现方案之一,下面在给出另一种解决方案.今天博客中要说的就是在ScrollView上贴两个ImageView, 把ImageVi ...
- iOS开发UI篇—无限轮播(循环利用)
iOS开发UI篇—无限轮播(循环利用) 一.无限轮播 1.简单说明 在开发中常需要对广告或者是一些图片进行自动的轮播,也就是所谓的无限滚动. 在开发的时候,我们通常的做法是使用一个UIScrollV ...
- iOS开发UI篇—无限轮播(新闻数据展示)
iOS开发UI篇—无限轮播(新闻数据展示) 一.实现效果 二.实现步骤 1.前期准备 (1)导入数据转模型的第三方框架MJExtension (2)向项目中添加保存有“新闻”数据的pli ...
- iOS开发UI篇—无限轮播(循环展示)
iOS开发UI篇—无限轮播(循环展示) 一.简单说明 之前的程序还存在一个问题,那就是不能循环展示,因为plist文件中只有五个数组,因此第一个和最后一个之后就没有了,下面介绍处理这种循环展示问题的小 ...
- iOS开发UI篇—无限轮播(功能完善)
iOS开发UI篇—无限轮播(功能完善) 一.自动滚动 添加并设置一个定时器,每个2.0秒,就跳转到下一条. 获取当前正在展示的位置. [self addNSTimer]; } -(void)addNS ...
- Android--ViewPager的无限轮播
ViewPage_RadioButton实现带小圆点的无限轮播,效果还能凑合着用. 1.在ViewPage的监听里面这样处理 @Override public void onPageSelected( ...
随机推荐
- js架构设计模式——理解javascript中的MVVM开发模式
理解javascript中的MVVM开发模式 http://blog.csdn.net/slalx/article/details/7856769 MVVM的全称是Model View ViewMod ...
- 使用滚动条(ActionBar)
活动条(ActionBar)是Android3.0的重要更新之一.ActionBar位于传统标题栏的位置,也就是显示屏幕的顶部.ActionBar可显示应用的图标和Activity标题——也就是前面应 ...
- Quercus
其实,我不确定Quercus是否可以被认定为一门JVM语言:其次Quercus这个东东分开源版与商业版,开源版只能解释执行.而商业版能编译成Java字节码. 但我知道国内,阿里巴巴很早就在使用它,当然 ...
- MYBATIS 无效的列类型: 1111
查询的时候竟然也会报错,如果参数是数字,需要加上jdbcType 在xml中加上 t.chart_id = #{chartId,jdbcType=DECIMAL}
- delphi BitmapCompress
unit Unit2; interface uses System.SysUtils, System.Types, System.UITypes, System.Classes, System.Va ...
- CI Weekly #12 | 微信小程序的自动化测试进阶
岁末将至,站在年终冲刺的尾巴上,flow.ci 新增了个人和团队设置的功能: 上线团队功能,注册时默认创建一个与用户名一致的团队,可设置:团队名称.增减团队成员,后续会不断完善: 增加个人设置,可修改 ...
- flask蓝图的使用
首先,我对蓝图的理解相对通俗,就是觉得蓝图对于视图方法模块化.大项目协同开发过程中的一个很好的工具. 1.下图是我们通常情况下使用的项目组织结构
- We Chall-Training: Encodings I -Writeup
MarkdownPad Document html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,ab ...
- Codeforces 712B
B. Memory and Trident time limit per test:2 seconds memory limit per test:256 megabytes input:standa ...
- (@WhiteTaken)设计模式学习——简单工厂
最近工作比较忙,所以没有怎么写博客,这几天将集中学习一下(厉风行)讲解的设计模式的相关知识,并对主要的代码进行介绍. 言归正传,接下来介绍最简单也是最基础的简单工厂设计模式. 什么是简单工厂? 简单工 ...