iOS中UICollectionView(集合视图)的使用

2023-05-16

1。简单介绍与说明
简介:UICollectionView提供了一种自定义布局展示试图内容的方式。
说明:涉及到的必须的基本类型与基本代理类型有UICollectionView/UICollectionViewCell/UICollectionViewLayout/UICollectionViewLayoutAttributes/
UICollectionViewDelegate,一般情况下有上述几个就可以了。
UICollectionViewCell显示的单元格,UICollectionView是容纳单元格的容器,UICollectionViewLayout定义布局,UICollectionViewLayoutAttributes单
定义单个cell的布局与显示相关属性。
2.使用方法:
a.创建UICollectionView,设置dataSource,并在dataSource里面实现必要的方法(类似UITableView的)。
b.创建cell:datasource中创建cell,在datasource方法中,这里与UITableview不同,只要在controllerload的时候调用registerClass:forCellWithReuseIdentifier:或者类似的方法设置cell的类型,然后就能在dataSource必须的方法实现collectionView:cellForItemAtIndexPath:中使用dequeueReusableCellWithReuseIdentifier:forIndexPath:方法就能获取到一个已经创建好的cell,在这里对其进行一些必要的设置就行。
c.设置layout:调用UICollectionView的setCollectionViewLayout:方法设置对应的layout。
d.实现layout:UICollectionViewLayout是一个抽象类,你可以使用系统已经提供的UICollectionViewFlowLayout,也可以自己定义一个。(初学者可以直接使用UICollectionViewFlowLayout作为第一次练习,然后自己实现一个layout来明白其中原理)
UICollectionView的简单使用:先添加一个资源文件夹(资源可以自己网上找找自己喜欢的,这里包括8张图片和一个events.plist文件)。
添加完资源文件夹后,打开Main.storyboard,按Delete删除ViewController视图控制器。然后拖曳一个Collection View Controller到设计界面。然后选择场景中的

Collection View Controller,选择右边的属性检查器,选中View Controller->Is Initial View Controller复选框,如下图


为了能够使得ViewController成为集合视图控制器,则需要将VewController的父类由UIViewController改为UICollectioViewController,相关代码如下:

//ViewController.h

#import <UIKit/UIKit.h>


@interface ViewController :UICollectionViewController


@end

此时代码中的ViewController集合视图控制器还没有与设计界面中的集合视图控制器关联在一起,我们需要选中Collection View,然后选中标示检查其,选择Custom Class->Class下拉列表中的ViewController类。如下图


然后添加集合视图单元格。首先我们需要定义一个单元格类,它继承自UICollectionViewCell。类名为Cell.然后在故事设计界面中选中Collection View cell,打开标识检查器,选择Custom Class->Class为Cell,接下来我们需要设置可虫咬单元格标识,打开其属性检查器,在Collection Reusable View->Identifier中输入Cell.最后设置单元格的大小,我这里设的是150,150


然后拖曳一个Image View和一个Label到单元格中,并为着两个控件定义输出口到Cell.h中,取名为imageView和label。


接着给ViewController.h添加一个数组,如下代码。

//  ViewController.h

#import <UIKit/UIKit.h>


@interface ViewController :UICollectionViewController


@property(strong,nonatomic)NSArray*events;


@end

最后在ViewController.m中为UICollectionView添加DataSource和Delegate,如下代码

//  ViewController.m

#import "ViewController.h"

#import "Cell.h"

@interface ViewController ()


@end


@implementation ViewController


- (void)viewDidLoad {

    [superviewDidLoad];

    //得到程序的main bundle bundle表示一个目录

    NSBundle *bundle = [NSBundlemainBundle];

    //指定路径来取得bundle

    NSString *plistPath = [bundlepathForResource:@"events"

                                           ofType:@"plist"];

    //获取属性列表文件中的全部数据

    NSArray *array = [[NSArrayalloc] initWithContentsOfFile:plistPath];

    self.events = array;

    

}


- (void)didReceiveMemoryWarning {

    [superdidReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}



#pragma mark - UICollectionViewDataSource

//提供视图中节的个数

-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView

{

    return [self.eventscount]/2;

}

//提供某个节中的列数目

-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section

{

    return2;

}

//为补充视图提供显示数据

//UITableView声明了一个NSIndexPath的类别,主要用来标识当前celltableView中的位置,该类别有sectionrow两个属性,前者标识当前cell处于第几节中,后者代表在该节中的第几列。

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

{

    //使用dequeueReusableCellWithReuseIdentifier:forIndexPath:方法就能获取到一个已经创建好的cell

    Cell *cell = [collectionViewdequeueReusableCellWithReuseIdentifier:@"Cell"forIndexPath:indexPath];

    NSDictionary *event = [self.eventsobjectAtIndex:(indexPath.section*2 + indexPath.row)];

    cell.label.text = [eventobjectForKey:@"name"];

    cell.imageView.image = [UIImageimageNamed:[event objectForKey:@"image"]];

    return cell;

}


#pragma mark - UICollectionViewDelegate

//选择单元格后触发

-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath

{  

    NSDictionary *event = [self.eventsobjectAtIndex:(indexPath.section*2 + indexPath.row)];

    NSLog(@"select event name : %@", [eventobjectForKey:@"name"]);

}

@end

最终结果展示如下:
点击单元格提示:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

iOS中UICollectionView(集合视图)的使用 的相关文章

随机推荐

  • python中exp函数如何实现指数计算?

    之前小编向大家介绍过python中的对数函数log函数 xff08 https www py cn jishu jichu 21780 html xff09 xff0c 对于有点复杂的计算 xff0c 我们是可以通过计算机来帮我们解决的 例
  • 1、stf二次开发-环境配置-node8安装

    1 stf二次开发 环境配置 node8安装 Contes7 X64 linux系统 stf二次开发 环境配置 node8安装 1 新建一个node文件夹用于安装node span class token function mkdir sp
  • 0、stf二次开发-解决CentOS网络问题

    0 stf二次开发 解决CentOS网络问题 stf二次开发 解决CentOS网络问题 转载 xff1a https www cnblogs com zhouheblog p 10442274 html
  • 32、取一个整数a从右端开始的4~7位

    32 取一个正整数a从右端开始的4 xff5e 7位 程序分析代码实现 程序分析 可以考虑两种实现方法 方法1 将合理的整数转换为字符串 span class token comment 方法1 转换为字符串处理 span span cla
  • 0、stf二次开发-CentOS-环境变量如何配置

    stf二次开发 CentOS 环境变量如何配置 需要root用户下执行以下代码 打开环境配置文件 gedit etc profil 在文本最下边添加需要配置的环境 span class token builtin class name ex
  • 1、stf二次开发-环境配置-adb安装

    1 stf二次开发 环境配置 adb安装 1 进入到想要安装adb的目录 span class token builtin class name cd span 想要安装的的目录 新建一个android目录并进入 span class to
  • 1、stf二次开发-环境配置-rethinkdb安装

    1 stf二次开发 环境配置 rethinkdb安装 此篇针对CentOS7的安装 xff0c 其他系统请参考rethinkdb官网 参考官网 span class token function sudo span span class t
  • 0、stf二次开发-CentOS-基础配置

    0 stf二次开发 CentOS 基础配置 使用centOS时需要用到命令 configure make make install 使用以上命令需要安装make vim gcc 即C 43 43 yum y span class token
  • 1、stf二次开发-环境配置-GraphicsMagick安装

    1 stf二次开发 环境配置 GraphicsMagick安装 1 下载GraphicsMagick tar gz压缩包 xff0c 放到自己要安装的目录 2 解压压缩包 GraphicsMagick 1 3 26 tar gz根据自己的压
  • github加速接口

    https github com
  • 交叉编译libX11

    0 前言 本文探索如何将libX11移植到ARM开发板 1 源码 从参考资料 1 或这里下载相关源码 xff0c 本文下载源码为 xff1a libX11 1 5 0 tar bz2 新建一个src目录 xff0c 并且将源码解压到其中 x
  • 2021-03-14

    题目描述 This past fall Farmer John took the cows to visit a corn maze But this wasn t just any corn maze it featured severa
  • java工具类 文件zip压缩 base64 加密,base64解密 zip解压

    代码 xff1a package com cfam utils import java io BufferedOutputStream import java io ByteArrayInputStream import java io B
  • Deno编译踩坑记(Mac环境)

    前言 最近入坑Deno xff0c 第一步肯定是从编译开始 xff0c 然后踩坑了 xff0c 记录一下 xff5e 常规编译 xff1a 1 安装rust curl proto 39 61 https 39 tlsv1 2 sSf htt
  • Debian下磁盘挂载及开机启动设置教程

    检查磁盘空间即剩余情况 本文是在实际使用过程中真实操作 xff0c 用于交流和学习 xff1b 1 使用fdisk l 命令查看当前磁盘的大小 xff0c 其中 dev sda磁盘发现并未使用 xff1b 使用时 xff0c 需要切换到ro
  • HC-06蓝牙模块

    主机 xff1a 用于向从机下发指令 xff0c 能够搜索从机并主动建立连接的一方 从机 xff1a 用于接收主机下发的命令 xff0c 不能主动建立连接 xff0c 只能等别人连接自己 xff08 HC 06只能工作在从机模式下 xff0
  • JAVA回文数的判断

    回文数 xff1a 如121 xff0c 1221这样正着和倒着读都一样的数叫做回文数 xff0c 代码的主要思路是先将用户输入的数字倒过来后再与原来的数进行判断 难点 xff1a 将用户输入的数字倒过来 上代码 xff1a package
  • IOS+openfire 即时通讯

    最近看到很多人在琢磨ios即时通讯这块 xff0c 于是出去好奇 xff0c 决定动手试试 xff0c 今天就先从xmpp这个框架来尝试 其实xmpp也就一个协议而已 xff0c 更多人还是喜欢把它叫做Jabber 首先还是提供一下下载地址
  • webpack进行js打包,引入js

    node中html引入jquery可以用webpack进行打包 webpack 3可以打包 xff0c webpack 4 打包需要安装webpack cli xff0c 否则会报错 直接引入js会报错 语法错误 xff0c 浏览器不支持E
  • iOS中UICollectionView(集合视图)的使用

    1 简单介绍与说明 简介 UICollectionView提供了一种自定义布局展示试图内容的方式 说明 涉及到的必须的基本类型与基本代理类型有UICollectionView UICollectionViewCell UICollectio