功能特点 实现了菜单切换的视觉差，效果棒棒哒； 使用简单，创建一个控制器直接继承GFPageViewController，设置需要添加的子控制器、标题、副标题就搞定； 菜单大部分的样式都可进行自定义；...组件使用 ▐ 4.1 基本使用方式 创建一个控制器继承自GFPageViewController，创建完之后给控制器设置需要添加的子控制器（Array）、标题（Array）、副标题（Array）： #...; /** 标题未选中时的颜色 */ @property (nonatomic, strong) UIColor *normalTitleColor; /** 标题选中时的颜色 */ @property...实现： 知道了原理，那就开始构思： 1、我的实现思路是用UICollectionView来实现滚动菜单； 2、需要两个UICollectionView，UICollectionViewCell的文字内容一样...我的初衷其实就是把这个滚动菜单封装出来，后来发现使用这个菜单的大部分情况都是和多个子控制器一起使用，所以就再进行了一步封装，把控制器的逻辑都封装到了GFPageViewController控制器中。
(nonatomic, strong) Class cellClass; //单个collectionView中使用的cell类型, 需要实现TBCollectionViewCellProtocol...UICollectionView 红色的是UICollectionViewCell 下方小点点是TBScrollPageControl 关键代码： 根据setDataList传入的数据创建CollectionView...并为其布局 - (void)initCollectionViews { _bgScrollView.contentSize = CGSizeMake(TBHorizontalItemListViewWidth...= 0; for (NSInteger i = 0; i < _listData.count; i++) { UICollectionViewFlowLayout *flowLayout...*collectionView = [[UICollectionView alloc] initWithFrame:frame collectionViewLayout:flowLayout];
标准的UICollectionView包含三个部分，它们都是UIView的子类： • Cells 用于展示内容的主体，对于不同的cell可以指定不同尺寸和不同的内容，这个稍后再说 • Supplementary...但值得注意的时，在UICollectionView中，不仅cell可以重用，Supplementary View和Decoration View也是可以并且应当被重用的。...1.6 UICollectionViewLayout 这是UICollectionView和UITableView最大的不同。...需要注意根据滚动方向不同，header和footer的高和宽中只有一个会起作用。垂直滚动时section间宽度为该尺寸的高，而水平滚动时为宽度起作用，如图。 ...[[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout: _flowLayout]; 要点1：单元格尺寸计算时要来考虑间隔线宽度的影响
这个控件的核心技术点汇总齐全，毕竟 UICollectionView 使用的范围太广泛了。...，分别是： 1.UICollectionView 对象2.追加视图类型，用于区别是 header 还是 footer3.IndexPath 对象，用于判断是哪个 section，从而初始化不同的 headerView...section 设置不同的背景颜色的。...事实上，它既不是 Cell 视图，也不是 Supplementary View，而是 UICollectionView 的 Decoration View；Decoration View 不同与前两者，...但当我真正的去整理它的一些技术点时，我发现它实在是太灵活了，以前觉得追加视图，装饰视图这些东西很简单，几行代码的事情，但事实上，当你想要去实现一些高度自定义的界面的时候，你才会认识到自己的不足，你并没有对这些知识有更深层次的认知
UICollectionView横向分页的问题 情况 直接看图 滚前 滚后 已经设置collectionView的isPagingEnabled为true了，可是出现了这种情况，原因就是collectionView...的contentSize不够。...: {562.5, 192.25} > 解决方案 有两种方式可以解决，数据只有11个，要分两页需要16个，那我们可以直接添加数据到16个，然后在dataSource中返回cell时进行判断及处理即可。...)，让UICollectionView在创建的时候使用了它 在 LXFChatMoreCollectionLayout.swift 中我们需要重写父类的collectionViewContentSize...，将contentSize取出来修改为我们自己创建的newSize就可以了代码如下 override var collectionViewContentSize: CGSize { let size
使用流式布局 继承 UICollectionViewDataSource,UICollectionViewDelegateFlowLayout 设置 Swift self.collectionView.register...; flowLayout.minimumInteritemSpacing = 0; flowLayout.minimumLineSpacing = 0; self.collectionView.collectionViewLayout...; flowLayout.minimumInteritemSpacing = 0; flowLayout.minimumLineSpacing = 0; self.collectionView.collectionViewLayout...的下标 NSIndexPath *firstIndexPath = [[self.collectionView indexPathsForVisibleItems] firstObject];...{ header.titleLabel.text = "推荐分类" } return header } 使用自定义布局 继承 UICollectionViewDataSource
在这里插入图片描述 I 、UICollectionView 从右向左对齐 本文按钮的视图结构 bottomV 内部采用UICollectionView进行布局。...UICollectionViewCell内部包含子视图自定义按钮ERPbtn4Radius 1.1 核心步骤 首先，在创建UICollectionView时，对其进行了水平翻转： [_...collectionView setTransform:CGAffineTransformMakeScale(-1,1)]; 在更新UICollectionViewCell的数据模型时，对它的contentView...//.设置每一行之间的间距 flowLayout.minimumLineSpacing = 0; flowLayout.minimumInteritemSpacing =...上从右向左对齐(Aligning right to left on UICollectionView) //1、首先，在创建UICollectionView时，我对其进行了水平翻转：
iOS流布局UICollectionView系列四——自定义FlowLayout进行瀑布流布局 一、引言 前几篇博客从UICollectionView的基础应用到设置UICollectionViewFlowLayout...这种布局无疑在app的应用中更加广泛，商品的展示，书架书目的展示，都会倾向于采用这样的布局方式，当然，通过自定义FlowLayout，我们也很容易实现。...总之，FlowLayout类将每个item的位置等布局信息放在一个数组中，在collectionView布局时，会调用FlowLayout类layoutAttributesForElementsInRect... //这个数组的主要作用是保存每一列的总高度，这样在布局时，我们可以始终将下一个Item放在最短的列下面 CGFloat colHight[2]={self.sectionInset.top...后，我们在ViewController中进行使用： - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup
[1240] 当一个屏幕无法展示 App 需要展示的所有内容时，就是 UIScrollView 大展拳脚的时候：通过使用 UIScrollView，用户可以滑动或是缩放屏幕，来看单个屏幕无法展示的内容。...如何定制不同 Cell 的 UI、如何与用户交互、如何与服务器端数据同步、如何在滑动时最大限度保证界面的流畅，这些都是考察的要点，是一个 iOS 工程师必备的基本技能。...绝大多数 UITableViewCell 的构图都一样，只是内容不同而已。...所以我们将同一类型的 UITableViewCell 标记为相同的 Identifier，然后用reuseIdentifier 去进行构建，配合不同内容进行批量使用。...我们知道要定制化 UICollectionView 的 layout 就一定要使用 UICollectionViewLayout。
iOS UICollectionView实现跑马灯和轮播效果.gif 功能描述：WSL_RollView 是基于UICollectionView实现的支持水平和垂直两个方向上的的分页和渐进循环轮播效果...iOS UICollectionView ②、对比上面的效果图，我们还需要解决分页的宽度和循环滚动的问题。...自定义分页宽度：默认的分页宽度是UICollectionView的宽度，所以当分页宽度的不等于UICollectionView的宽度或分页间隔不等于0时会出现错误，这时就需要我们通过自定义UICollectionViewFlowLayout.../** 返回值决定了collectionView停止滚动时的偏移量 手指松开后执行 * proposedContentOffset：原本情况下，collectionView停止滚动时最终的偏移量 *...，前边尾首相连需要UICollectionView可见范围内的数据源后边的元素cell，后边首尾相连需要UICollectionView可见范围内的数据源前边的元素cell //获取首尾相连循环滚动时需要用到的元素
iOS流布局UICollectionView系列三——使用FlowLayout进行更灵活布局 一、引言 前面的博客介绍了UICollectionView的相关方法和其协议中的方法，但对布局的管理类...UICollectionView的简单使用：http://my.oschina.net/u/2340880/blog/522613 UICollectionView相关协议方法：http://my.oschina.net...二、将九宫格式的布局进行升级 在第一篇博客中，通过UICollectionView，我们很轻松的完成了一个九宫格的布局，但是如此中规中矩的布局方式，有时候并不能满足我们的需求，有时我们需要每一个...Item展示不同的大小，代码如下： - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after...的相关属性UICollectionViewDelegateFlowLayout 上面的方法在创建FlowLayout时静态的进行设置，如果我们需要动态的设置这些属性，就像我们例子中的，每个
在上篇博客中，给大家演示了如何利用 UICollectionView 这个强大的控件去实现一个卡片轮播的效果，后来有网友联系我说:"他遇到一个问题，当他滚动的 item 宽度与屏幕宽度一致时，滚动效果是正常的...这个问题确实是存在的，因为在 UICollectionView 的属性中，有一个分页的属性：isPagingEnabled，当设置成 true 时，每次滚动的位移量等于屏幕的宽度；当不设置这个分页属性，...，决定了 UICollectionView 停止滚动时的偏移量，可以通过重写这个函数来实现自定义的分页滚动，重写这个函数的逻辑思路如下： 1.定义一个坐标点 CGPoint 来记录最新滚动的偏移坐标2...，然后返回 UICollectionView 停止滚动时的偏移量 Talk is cheap, show me the code, 代码实现如下： class RowStyleLayout: UICollectionViewFlowLayout...: CGFloat = 0 // 修改之前记录的位置，如果小于最小的contentsize或者最大的contentsize则重置值 if lastOffset.x <
UICollectionView之所以强大，是因为其具有自定义功能，这一自定义就不得了啦，自由度非常大，定制的高，所以功能也是灰常强大的。本篇博客就不使用自带的流式布局了，我们要自定义一个瀑布流。...一.先入为主 先来看一下不同配置参数下运行后的效果吧，每张截图的列数和Cell之间的边距都有所不同，瀑布流的列数依次为2，3，8。有密集恐惧证的童鞋就不要看这些运行效果图了，真的会看晕的。...下面这些运行效果就是修改不同的配置参数来进行布局的。看图吧，关于瀑布流的效果就不啰嗦了。以下的效果就是使用自定义布局做的，接下来将会介绍一下其实现原理。 ? 二....Cell的高度，把每个Cell的高度记录在数组中，便于Cell加载时使用。...参考文章： iOS开发之窥探UICollectionViewController(三) --使用UICollectionView自定义瀑布流
UICollectionView之所以强大，是因为其具有自定义功能，这一自定义就不得了啦，自由度非常大，定制的高，所以功能也是灰常强大的。本篇博客就不使用自带的流式布局了，我们要自定义一个瀑布流。...一.先入为主 先来看一下不同配置参数下运行后的效果吧，每张截图的列数和Cell之间的边距都有所不同，瀑布流的列数依次为2，3，8。有密集恐惧证的童鞋就不要看这些运行效果图了，真的会看晕的。...下面这些运行效果就是修改不同的配置参数来进行布局的。看图吧，关于瀑布流的效果就不啰嗦了。以下的效果就是使用自定义布局做的，接下来将会介绍一下其实现原理。 ? 二. ...ContentSize的Width就是屏幕的宽度，而ContentSize的高度是一列中最后一个Cell的Y坐标加上其自身高度的最大值。在此函数中会调用求CellY数组中的最大值。...根据Cell的最小高度和最大高度来利用随机数计算每个Cell的高度，把每个Cell的高度记录在数组中，便于Cell加载时使用。
在使用UICollectionView开发无缝隙或者间隙为1px的页面的时候应该会遇到这样的问题(iPhone 5s 没有问题)，明明是把屏幕四等分了,但为什么会有下图的空白间隙呢?...; flowLayout.itemSize = CGSizeMake(Wi/4.0, 60);//算出来的宽度是93.75 flowLayout.minimumLineSpacing = 0...; flowLayout.minimumInteritemSpacing = 0; _collectionView = [[UICollectionView alloc] initWithFrame...:CGRectMake(0, 0, Wi, He) collectionViewLayout:flowLayout]; 发现代码也是没有问题啊,可为什么会有这样呢?...果然还是从简书找到解决方法UICollectionView 缝隙修复,这里我结合我的理解做进一步解释。
的滚动方向是横向的 随着 UICollectionView 滚动，Cell 会自动的进行缩放，当 Cell 的中心点与 UICollectionView 的中心点重合时放大，偏离中心点时缩小 Cell...第二步，要实现 Cell 随 UICollectionView 滚动时具有缩放效果，就需要找一个合适的时机对 Cell 进行缩放，我的思路是先计算出 UICollectionView 整体滚动内容的中心点的...同学你讲的没错，但是当我们 Cell 的 width 加上边距等如果不占满 UICollectionView，那么就会出现一个问题，虽然你实现了分页效果，但是你的 Cell 在滚动的过程中是不会居中的....读过我前几篇 UICollectionView 系列的小伙伴们，不知道你们还有没有印象，我写过一篇教程叫做 "使用 UICollectionView 实现分页滑动效果" 这里附上链接（使用 UICollectionView...UICollectionView 停止滚动时，返回一个新的偏移点坐标，它有俩个参数，第一个参数 proposedContentOffset 指的是滚动将要停止时的偏移点坐标，第二个参数 velocity
这里就不绕弯子了，当然是用最常用的内容展示神器 UICollectionView 这个控件了，读完本篇文章你会发现真是万物皆可使用 UICollectionView。...我们知道在 UICollectionView 的属性中，有一个分页的属性：isPagingEnabled，当设置成 true 时，每次滚动的位移量等于它自身 frame 的宽度；当不设置这个分页属性，它的默认值是...，决定了 UICollectionView 停止滚动时的偏移量，可以通过重写这个函数来实现自定义的分页滚动，重写这个函数的逻辑思路如下： 定义一个坐标点 CGPoint 来记录最新滚动的偏移坐标 定义俩个值分别为...frame.size.width - r.width - 40)/2, vertical: 0) self.setPositionAdjustment(offset, for: .search) } } 当我们点击顶部的搜索框时..., 用于展示 Cell 中相同的地方；然后我们在各个 Cell 中构建不同样式的 UI，利用 UICollectionView 这一神器实现了这些效果；最后，实现了简单的搜索功能。
1 简介 UIScrollView 是负责滚动的视图。苹果最强大的地方就在于其良好的UI展示，和UE体验。如果不会很好的使用UIScrollView，就等于丧失了苹果一般的法力。...移动设备的屏幕大小是极其有限的，因此直接展示在用户眼前的内容也相当有限。当展示的内容较多，超出一个屏幕时，用户可通过滚动手势来查看屏幕以外的内容。...1.2 UIScrollView常见的几个重要控件 UITableView UICollectionView UITextView 1.3 UIScrollView常见的重要属性 属性名 作用 contentSize...，不会滚动 如果指定的区域完全超出contentSize的范围，不会滚动 如果指定的区域超越了当前可视区域，但没有超出contentSize的区域，可以滚动 -(void)scrollRectToVisible...scrollView 要滚动就必须设置了滚动视图的 contentSize contentSize 的 width 决定了水平方向滚动距离 contentSize 的 height 决定了垂直方向滚动距离
问题反馈 线上突发一个Top1的crash告警，场景是UICollectionView在删除的时候触发。...用户点击cell跳转界面后，又触发了原来UICollectionView的cell删除动画； 从slardar(APM)的聚合信息，可以看到： 4、最后页面是并不是原来UICollectionView...用iOS 12设备找到复现路径： 先正常触发UICollectionView的初始化和cell加载 => 从UICollectionView触发界面跳转，进入下一级界面 => 触发删除Cell的业务逻辑...有一个逻辑是会把最近使用的cell排在最前面，于是从UICollectionView点击cell发生界面跳转后会触发UICollectionView刷新并调reloadData。...= ; layer = ; contentOffset: {0, 0}; contentSize:
自定义的CollectionView可谓是非常灵活，其灵活性也决定了其功能的强大。CollectionView的自定义就是其Cell高度可定制的属性，通过对Cell赋值不同的属性来达到自定义的目的。...切换图片时进行一个360度的旋转，并且修改Cell的层级，当前显示的图片层级最高。并且移动时，如果要显示的图片不在屏幕中央就做一个位置矫正。点击图片时，使用仿射变换使其放大，再点击使其缩小。...接下来将会详细的介绍其实现方案。 ? 二.该自定义布局的使用方式 我们先看一下该自定义布局是如何使用的，然后再通过使用方式来逐步介绍它是如何实现的。...预加载布局方法, 该方法会在UICollectionView加载数据时执行一次，在该方法中负责调用一些初始化函数。具体如下所示。...重写这个方法是为了为每个Cell设定不同的属性值。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储
