效果图:

代码:

HCollectionViewCell.h

#import <UIKit/UIKit.h>

@interface HCollectionViewCell : UICollectionViewCell
@property(nonatomic,copy)NSString *str;
@end

HCollectionViewCell.m

#import "HCollectionViewCell.h"

@interface HCollectionViewCell()
@property(nonatomic,strong)UILabel *label;
@end @implementation HCollectionViewCell -(instancetype)initWithFrame:(CGRect)frame{
self = [super initWithFrame:frame];
if(self){
float width = frame.size.width > frame.size.height ? frame.size.height : frame.size.width; self.label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, width, width)];
self.label.textAlignment = NSTextAlignmentCenter;
self.label.layer.cornerRadius = width/2;
self.label.clipsToBounds = YES;
self.label.backgroundColor = [UIColor redColor];
self.label.center = self.contentView.center;
[self.contentView addSubview:self.label]; }
return self;
}
-(void)setStr:(NSString *)str{
_str = str;
if(str == nil){
self.label.text = @"";
self.label.hidden = YES;
}else{
self.label.text = str;
self.label.hidden = NO;
} }
@end

HCollecitonViewViewController.m

#import "HCollecitonViewViewController.h"
#import "HCollectionViewCell.h"
@interface HCollecitonViewViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>
@property(nonatomic,strong)UICollectionView *collecitonView;
@property(nonatomic,strong)NSMutableArray *dataArr;
@property(nonatomic,strong)UIPageControl *pageControl;
@end @implementation HCollecitonViewViewController
#define Identifier @"cell"
#define HCount 4//横向排列个数
-(NSMutableArray *)dataArr{
if(!_dataArr){
_dataArr = [NSMutableArray array];
for(int i=0;i<13;i++){
[_dataArr addObject:[NSString stringWithFormat:@"%d",i]];
}
}
return _dataArr;
} - (void)viewDidLoad {
[super viewDidLoad];
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
layout.minimumLineSpacing = 0;
layout.itemSize = CGSizeMake(CGRectGetWidth(self.view.frame)/4.0f, 70);
//横向滚动
layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
self.collecitonView = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 100, CGRectGetWidth(self.view.frame), 70) collectionViewLayout:layout];
self.collecitonView.backgroundColor = [UIColor whiteColor];
self.collecitonView.delegate = self;
self.collecitonView.dataSource = self;
[self.view addSubview:self.collecitonView];
[self.collecitonView registerClass:[HCollectionViewCell class] forCellWithReuseIdentifier:Identifier];
self.collecitonView.pagingEnabled = YES; self.pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(0, CGRectGetMaxY(self.collecitonView.frame), CGRectGetWidth(self.view.frame), 20)];
self.pageControl.numberOfPages = (self.dataArr.count+HCount-1)/HCount;
self.pageControl.pageIndicatorTintColor = [UIColor grayColor];
self.pageControl.currentPageIndicatorTintColor = [UIColor redColor];
[self.view addSubview:self.pageControl]; }
#pragma mark UICollectionViewDelegate,UICollectionViewDataSource
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{ return self.pageControl.numberOfPages * HCount ; }
- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
HCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:Identifier forIndexPath:indexPath];
if(indexPath.row < self.dataArr.count){
cell.str = self.dataArr[indexPath.row];
}else{
cell.str = nil;
} return cell;
}
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
int x = scrollView.contentOffset.x/CGRectGetWidth(self.collecitonView.frame);
self.pageControl.currentPage = x;
}
@end

如果希望双排分页,请试着改变HCollectionViewCell的高度以及HCount改成8,效果图如下:

UICollectionView横向分页的更多相关文章

  1. iOS开发 横向分页样式 可左右滑动或点击头部栏按钮进行页面切换

    iOS开发 横向分页样式 可左右滑动或点击头部栏按钮进行页面切换 不多说直接上效果图和代码 1.设置RootViewController为一个导航试图控制器 //  Copyright © 2016年 ...

  2. iOS使用XZMRefresh实现UITableView或UICollectionView横向刷新

    https://blog.csdn.net/u013285730/article/details/50615551?utm_source=blogxgwz6 XZMRefresh The easies ...

  3. iOS8 UICollectionView横向滑动demo

    在iOS8中,scrollView和加载在它上面的点击事件会有冲突,所以做一个横向滑动的界面最好的选择就是UICollectionView. 这个效果可以用苹果公司提供的官方demo修改而来,下载地址 ...

  4. UIScrollView 和 UICollectionView 分页效果

    UIScrollView 和 UICollectionView 分页效果 UIScrollView可以滚动显示宽度或高度大于其bounds的内容.有些时候,需要有分页效果.每一页有统一的大小,相邻无缝 ...

  5. C# 插入、删除Excel分页符

    引言 对Excel表格设置分页对我们预览.打印文档时是很方便的,特别是一些包含很多复杂数据的.不规则的表格,为保证打印时每一页的排版美观性或者数据的前后连接的完整性,此时的分页符就发挥了极大的作用.因 ...

  6. iOS UI基础-19.0 UICollectionView

    直接上代码,说明请看注释吧 1.继承三个代理 UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateF ...

  7. Android 使用RecyclerView实现多行水平分页的GridView效果和ViewPager效果

    前些天看到有人在论坛上问这种效果怎么实现,没写过也没用过这个功能,网上查了一下,大多是使用ViewPager+GridView或者HorizontalScrollView+GridView实现,不过貌 ...

  8. Grid++Report 报表开发工具

      Grid++Report 报表开发工具   版本 更新日期 大小 下载 说明 Grid++Repoert6.0.0.6 2015/08/08 16.0M [下载] 锐浪报表工具最新版本,新增功能说 ...

  9. Grid++Report支持CS/BS模式的表报插件

    Grid++Report 可用于开发桌面C/S报表与WEB报表(B/S报表),C/S报表开发适用于VB.NET.C#.VB.VC.Delphi等.WEB报表开发适用于ASP.ASP.NET.JSP/J ...

随机推荐

  1. 【Nginx】配置及使用

    常用命令: nginx -t //可以查到配置是否正确,以及配置文件路径. 如果配置不生效 sudo killall -9 nginx 注意在配置文件中注明访问来源(例如没有写明ip,就不能通过ip直 ...

  2. [Converge] Feature Selection in training of Deep Learning

    特征相关性对于DL的影响 链接:https://www.zhihu.com/question/47908908/answer/110987483 经验一:  1. 输入特征最好不相关.如果某些维输入的 ...

  3. [Model] VGG16

     Jeff: fast.ai lesson 1&2感觉没讲什么干货. ~/keras/keras.json配置后台theano or tensorflow. ~/./theanorc处理器配置 ...

  4. 网络编程 -- RPC实现原理 -- NIO多线程 -- 迭代版本V1

    网络编程 -- RPC实现原理 -- 目录 啦啦啦 V1——设置标识变量selectionKey.attach(true);只处理一次(会一直循环遍历selectionKeys,占用CPU资源). ( ...

  5. Java Annotation 应用 -- 导出Excel表格

    相关知识链接: Introspector(内省) POI 1.声明注解 package com.ciic.component.excel; import java.lang.annotation.El ...

  6. OSG使用模板缓存

    参考帖子: https://blog.csdn.net/csxiaoshui/article/details/23457273 osg::Geometry *lineStripGeometry = n ...

  7. PS脚本博客

    http://blog.csdn.net/fzhlee/article/category/2718489

  8. OpenGL——二维几何变换

    平移.旋转.缩放的实现 #include<iostream> #include <math.h> #include<Windows.h> #include < ...

  9. 【SpringCloud微服务实战学习系列】服务治理Spring Cloud Eureka

    Spring Cloud Eureka是Spring Cloud Netflix微服务中的一部分,它基于NetFlix Sureka做了二次封装,主要负责完成微服务架构中的服务治理功能. 一.服务治理 ...

  10. 依赖注入容器之Castle Windsor

    一.Windsor的使用 Windsor的作为依赖注入的容器的一种,使用起来比较方便,我们直接在Nuget中添加Castle Windsor,将会自动引入Castle.Core 和 Castle.Wi ...