UICollectionView 简单使用详解

来源：互联网发布：linux文件管理命令编辑：程序博客网时间：2024/06/04 20:08

UICollectionView 其实和UITableview差不多，学会简单的使用后，根据 UITableview 的各种使用逻辑，就能够轻松的实现你想要实现的各种功能，下面直接上代码啦

1，ViewController.h 文件

- (void)viewDidLoad {    [super viewDidLoad];    self.view.backgroundColor = [UIColor whiteColor];    UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc]init];//    flowLayout 的滑动方向    [flowLayout setScrollDirection:UICollectionViewScrollDirectionVertical];//    两个 item 之间 的 横向间隔    flowLayout.minimumInteritemSpacing = 20;//    两个 item 之间 的 纵向间隔    flowLayout.minimumLineSpacing = 10;    UICollectionView *collectionView = [[UICollectionView alloc]initWithFrame:self.view.frame collectionViewLayout:flowLayout];    collectionView.delegate = self;    collectionView.dataSource = self;    [self.view addSubview:collectionView];//    初始化 UICollectionView 的时候，同时 注册 cell    [collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:cellID];    }

// 定义每组 Items 的个数- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{    return 5;}//定义展示的Section的个数-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{    return 2;}- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{    CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellID forIndexPath:indexPath];    cell.backgroundColor = [UIColor cyanColor];    cell.imageVieww.image = [UIImage imageNamed:@"小猴猴"];    cell.nameLabel.text = @"你哈";    return cell;    }

//定义每个Item 的大小- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{//    cell 的宽高    return CGSizeMake(80, 80);}//定义每个UICollectionView 的 margin-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{    return UIEdgeInsetsMake(50, 15, 50, 15);//(上边距，左边距，下边距，右边距)}

#pragma mark ------ 选中 cell -------- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{    CollectionViewCell *cell = (CollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];    NSLog(@"点击的是%@",cell.nameLabel.text);        cell.backgroundColor = [UIColor yellowColor];}#pragma mark ----取消选中上一个  -------- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath{        CollectionViewCell *cell = (CollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];        cell.backgroundColor = [UIColor cyanColor];}

2，自定义的

UICollectionViewCell

.h 文件

#import <UIKit/UIKit.h>@interface CollectionViewCell : UICollectionViewCell@property (nonatomic, retain)UIImageView *imageVieww;@property (nonatomic, retain)UILabel *nameLabel;@end

.m 文件

#define WIDTH [UIScreen mainScreen].bounds.size.width#define HEIGHT [UIScreen mainScreen].bounds.size.height#import "CollectionViewCell.h"@implementation CollectionViewCell- (instancetype)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {                self.imageVieww = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, WIDTH/5, WIDTH/5)];        self.imageVieww.layer.cornerRadius = WIDTH/5/2;        self.imageVieww.layer.masksToBounds = YES;        self.imageVieww.layer.borderWidth = 2;        self.imageVieww.layer.borderColor = [UIColor cyanColor].CGColor;        [self.contentView addSubview:self.imageVieww];                self.nameLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, CGRectGetMaxY(self.imageVieww.frame)-20, CGRectGetWidth(self.imageVieww.frame), 20)];        self.nameLabel.textColor = [UIColor yellowColor];        self.nameLabel.textAlignment = 1;        [self.contentView addSubview:self.nameLabel];    }    return self;}

效果图如下：

0 0