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( ...
随机推荐
- Unity 4.3 2D 教程:新手上路
这篇文章译自 Christopher LaPollo 先生的 Unity 4.3 2D 教程的第一部分 Unity 4.3 2D Tutorial: Getting Started 感谢这套优秀教程的 ...
- iOS 引导页
1. 目标需求 引导页无限轮播,且轮播到最后一张时没有跳转到头一个的感觉 pageControl的显示为可选项 是否无限轮播为可选项 手动切换图片,并再次启动自动轮转 实现点击事件 2. 实现思路 初 ...
- Intent的属性及Intent-filter配置——指定Action、Category调用系统Activity
Intent代表了启动某个程序组件的“意图”,实际上Intent对象不仅可以启动本应用内程序组件,也可启动Android系统的其他应用的程序组件,包括系统自带的程序组件——只要权限允许. 实际上And ...
- spring mvc 返回页面数据
handler package com.stone.controller; import java.util.Map; import javax.servlet.http.HttpServletReq ...
- Linux笔记(十一) - 文件系统管理
(1)文件系统查看命令:df [选项] [挂载点]-a 显示所有文件系统信息,包括特殊文件系统,如/proc /sysfs-h 使用习惯单位显示容量,如KB,MB或GB-T 显示文件系统类型-m 以M ...
- 使用Grafana 展示Docker容器的监控图表并设置邮件报警规则
一.Docker 容器监控报警方式 接着上篇文章的记录,看到grafana的版本已经更新到4.2了,并且在4.0以后的版本中,加入了Alert Notifications 功能,这样在对容器 监控完, ...
- zabbix3.2.3安装部署
安装nginx [root@xuegod64 ~]# yum install -y gcc gcc-c++ autoconf automake zlib zlib-devel openssl open ...
- easyui treegrid实现显示checkbox并能获取到选定值的
闲聊: 小颖最近忙疯了,经常被加班,昨天都要下班了,又提了个需求,虽然写的代码不多只有几行,可是测试环境很难跑通,一会就ie崩溃了,所以弄得小颖最近老是头晕. 也不知道最近是怎么了,一向特别爱吃的小颖 ...
- Xcode7 beta 网络请求报错:The resource could not be loaded because the App Transport
Xcode7 beta 网络请求报错:The resource could not be loaded because the App Transport Xcode7 beta 网络请求报错:The ...
- openstack安装文档
#########################################openstack m版本部署安装################################## 控制节点.网络 ...