collectView 也是 iOS 很常用的瀑布流展示控件了,虽然使用过很多次,一直没有系统的总结过,尤其是在添加header 和footer view 的时候,很常见,写起来总觉得不是很流畅,这里着重备份下,留待备用……

这里贴上最终的成品样子:

刚刚做demo 做了好久,这个控件,我也是醉了……,既然做完了,写步骤。。。。。。

在铺设下自己创建的类:

再次提示 这个 header 和footer 一定要分开继承,刚刚自己就是在这里 耽搁了大部分的时间

约束完成之后,主要提示下 ,自己耽误这么长时间,做这个demo 的主要知识点吧:

1.在 storybord 写的view 布局,不用在 vc里面注册( regest 之类的 )了,这个是比较省事的

2.我还没有在storybord 找到 collectcell 的 layout 设置项,所以直接贴上layout 代码了,(如果真的有这个设置,希望找到后在回来修改……)

我果然还是习惯撸代码,语言不是我强项……唉,不懂的时候,再偷偷看注释吧

collectCell 类:

class CollectionViewCell: UICollectionViewCell {
/**
demo 特别简单 ,这里只加载了一个按钮
*/
@IBOutlet weak var textButton: UIButton!
}

collect header and footer

import UIKit

class CollectionHeader: UICollectionReusableView {
/**
好久不用代理了,觉得 这么写会比较简单触发点击事件……
*/
var headerButtonClick:((UIButton)->Void)? @IBAction func didHeadButtonClick(_ sender: UIButton) { if (self.headerButtonClick != nil) { self.headerButtonClick!(sender)
}
}
}
import UIKit

class CollectionFooter: UICollectionReusableView {

    var footerButtonClick:((UIButton)->Void)?

    @IBAction func didFooterButtonClick(_ sender: UIButton) {

        if self.footerButtonClick != nil {

            self.footerButtonClick!(sender )
}
}
}

view controller 类

import UIKit

class ViewController: UIViewController , UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout {

    @IBOutlet weak var myCollectionView: UICollectionView!

    lazy var collectArr : Array<String> = {
var arr = Array<String>()
for i in ...{ var str = String(format:"%c",putchar( + i))
arr.append(str)
}
return arr
}() /**
flow layout
*/
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize{ return CGSize.init(width: self.view.frame.size.width/-, height: )
} func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets{ return UIEdgeInsets.init(top: , left: , bottom: , right: )
} func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForFooterInSection section: Int) -> CGSize{ return CGSize(width:self.view.frame.size.width,height:)
} /**
data source
*/
func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
return
} func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return self.collectArr.count
} func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "collectCell", for: indexPath) as! CollectionViewCell
cell.textButton.setTitle(self.collectArr[indexPath.item], for: .normal)
return cell
} /**
delegate
*/ func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { collectionView .deselectItem(at: indexPath, animated: true)
}

/**
重要的事情 说三遍,这已经这篇博客第三遍 提到 footer 和header 要分开继承,自己就是在这里耽搁了许久
在就是 这里好多的关键字要对应好
*/
func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView{ var reusableView :UICollectionReusableView?
if kind == UICollectionElementKindSectionFooter { let footer :CollectionFooter = collectionView.dequeueReusableSupplementaryView(ofKind:UICollectionElementKindSectionFooter, withReuseIdentifier: "footerView", for: indexPath) as! CollectionFooter footer.footerButtonClick = { ( btn: UIButton ) in print("footer view 按钮被点击")
}
reusableView = footer

} else if kind == UICollectionElementKindSectionHeader { let header :CollectionHeader = collectionView.dequeueReusableSupplementaryView(ofKind:UICollectionElementKindSectionHeader, withReuseIdentifier: "headerView", for: indexPath) as! CollectionHeader

header.headerButtonClick = { (btn :UIButton) in print("header view 按钮被点击")
}
reusableView = header
}
return reusableView!
} /**
view controller 系统的方法
*/ override func viewDidLoad() {
super.viewDidLoad()
} override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning() } }

终于写完了,有补充的积极给我留言……

swift 第八课 CollectView的 添加 footerView 、headerView的更多相关文章

  1. NeHe OpenGL教程 第三十八课:资源文件

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  2. Lance老师UI系列教程第八课->新浪新闻SlidingMenu界面的实现

    UI系列教程第八课:Lance老师UI系列教程第八课->新浪新闻SlidingMenu界面的实现 今天蓝老师要讲的是关于新浪新闻侧滑界面的实现.先看看原图: 如图所示,这种侧滑效果以另一种方式替 ...

  3. 【C语言探索之旅】 第二部分第八课:动态分配

    内容简介 1.课程大纲 2.第二部分第八课: 动态分配 3.第二部分第九课预告: 实战“悬挂小人”游戏 课程大纲 我们的课程分为四大部分,每一个部分结束后都会有练习题,并会公布答案.还会带大家用C语言 ...

  4. [译]Quartz.NET 框架 教程(中文版)2.2.x 之第八课 调度监听器

    第八课 调度监听器 调度监听器和触发监听器和触发监听器.作业任务监听器非常相似,只是调度监听器在调度器内接收通知事件,而不需要关联具体的触发器或作业任务事件. 跟调度监听器相关的事件,添加作业任务/触 ...

  5. BeagleBone Black第八课板:建立Eclipse编程环境

    BBB第八课板:建立Eclipse编程环境 最近建立了一个新的编程环境.感觉很方便,给大家分享.除了先前BBB董事会远程桌面直接写shell脚本或C外部程序,经Debain 7.5根据该制度还试图用编 ...

  6. Elasticsearch7.X 入门学习第八课笔记-----索引模板和动态模板

    原文:Elasticsearch7.X 入门学习第八课笔记-----索引模板和动态模板 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接: ...

  7. NeHe OpenGL教程 第四十八课:轨迹球

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  8. Kali Linux Web 渗透测试视频教程— 第八课 nessus

    Kali Linux Web 渗透测试视频教程— 第八课 nessus 文/玄魂 视频课程地址:http://edu.51cto.com/course/course_id-1887.html 目录 n ...

  9. NeHe OpenGL教程 第二十八课:贝塞尔曲面

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

随机推荐

  1. 2.webpack最基本的使用方式

    什么是webpack? webpack是前端的一个项目构建工具,它是基于Node.js开发出来的一个前端工具: webpack安装的两种方式 1.运行 'npm i webpack -g' 全局安装w ...

  2. C# 读取、写入文件

    读取文件 File.ReadAllText(textBox1.Text,Encoding.ASCII); Form namespace ReadWriteText { public partial c ...

  3. C# 加载显示ftp上图片方法

    ftp://用户名:密码@IP/路径 FTP的一种登陆方式  如ftp://sing:song@192.168.1.133/upload/pic/236.jpg

  4. Luogu P3690【模板】Link Cut Tree (LCT板题)

    省选前刷道LCT板题(话说之前没做这道题-) CODE #include<bits/stdc++.h> using namespace std; inline void read(int ...

  5. MySQL index使用率查询

    SELECT  t.table_schema AS db,  t.table_name   AS tab_name,  s.index_name   AS index_name,  s.column_ ...

  6. [Luogu] 余数求和

    question: $$\sum_{i=1}^{n} k \bmod i$$$$\sum_{i=1}^{n} k - \lfloor \frac{k}{i} \rfloor i$$$$\sum_{i= ...

  7. pytest学习笔记(一)

    这两天在学习pytest,之前有小用到pytest,觉得这个测试框架很灵巧,用在实现接口自动化(pytest+requests)非常的轻便,然后很有兴致的决定学习下,然后又发现了pytest-sele ...

  8. java试题复盘——11月13日

    上: 10. AccessViolationException异常触发后,下列程序的输出结果为(   A   ) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 AccessViol ...

  9. 2016"百度之星" - 初赛(Astar Round2A)1005 BD String(HDU5694)——找规律、字符串对称、分治

    分析:按照题目所给的意思每次处理得到的新的字符串都是具有高度对称性的,举个例子,如题目所给的第三个字符串,最中间的是B然后两边分散开去,一边是B的话另外一边关于这个中心对称的那个位置一定是D,反过来同 ...

  10. Leetcode题目338:比特位计数(中等)

    题目描述: 给定一个非负整数 num.对于 0 ≤ i ≤ num 范围中的每个数字 i ,计算其二进制数中的 1 的数目并将它们作为数组返回. 示例 1: 输入: 2 输出: [0,1,1] 示例  ...