UICollectionView学习

2024-02-26 07:48
文章标签 学习 uicollectionview

本文主要是介绍UICollectionView学习,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

day14 UICollectionView


http://blog.csdn.net/eqera/article/details/8134986

1. 块状化布局tableView的实现(简易瀑布流)

-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (tableView==_tableView1) {
        UITableViewCell*cell=[tableView dequeueReusableCellWithIdentifier:@"tableView1"];
        if (!cell) {
            cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"tableView1"];
        }
        cell.textLabel.text=self.dataArray1[indexPath.row];
        
        return cell;
    }else{
        UITableViewCell*cell1=[tableView dequeueReusableCellWithIdentifier:@"tableView2"];
        if (!cell1) {
            cell1=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"tableView2"];
        }
        cell1.textLabel.text=self.dataArray2[indexPath.row];
        return cell1;
    
    }
}

-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    if (scrollView==_tableView1) {
        _tableView2.contentOffset=_tableView1.contentOffset;
    }else{
        _tableView1.contentOffset=_tableView2.contentOffset;
    }
}

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return arc4random()%40+40;
}


UITableView                UICollectionView
Section-header/footer           Supplementary View
BackgroundView            DecorationView    

2. UICollectionView 集合视图介绍



UICollectionView常用代理方法
// 有多少个分区
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView;

// 每个分区有多少个cell[item]
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section;

// 每个cell是什么
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath;

// section的头和尾视图 supplementaryView
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath;

// 属于UICollectionViewFlowLayoutDelegate 每个cell的尺寸
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath

// 点选一个cell的时候触发的方法
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath

注:在UICollectionView中,不仅cell可以重用,Supplementary View和Decoration View也是可以并且应当被重用的。

Line spacing(每行的间距)
1、 可以进行全局配置,如下属性
@property(CGFloat) minimumLineSpacing

2、 也可以通过delegate对每一个section进行配置,如下代码
collectionView:layout:minimumLineSpacingForSectionAtIndex:


Inter cell spacing(每行内部cell item的间距)
1、  可以进行全局配置,如下属性
@property(CGFloat) minimumInteritemSpacing

2、  也可以通过delegate对每一个section进行配置,如下代码
collectionView:layout:minimumInteritemSpacingForSectionAtIndex:




项目实例1:


Step 1> 新建布局对象
// UICollectionViewLayout 集合视图的布局类,是一个抽象基类,一般使用它的子类实现对cell的布局
// UICollectionViewFlowLayout : UICollectionViewLayout 系统提供的,能够实现cell的网格布局
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
[flowLayout setScrollDirection:UICollectionViewScrollDirectionVertical];

// 设置行间距
flowLayout.minimumLineSpacing = 10;

// 设置item之间间距,实际间隔需要根据item的size和edgesInsets的值来调节
flowLayout.minimumInteritemSpacing = 0;

Step 2> 新建collectionView,设置它的delegate和dataSource, 并把布局对象赋给它
_collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 64, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height-64) collectionViewLayout:flowLayout];
_collectionView.delegate = self;
_collectionView.dataSource = self;
[flowLayout release];


Step 3> 注册cell, 注册section的头视图和尾视图
[_collectionView registerNib:[UINib nibWithNibName:@"MyCell" bundle:nil] forCellWithReuseIdentifier:@"MyCell"];
// [_collectionView registerClass:[MyCell class] forCellWithReuseIdentifier:@"MyCell"];

// -- header view --
[_collectionView registerClass:[CustomView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"Header"];

// -- footer view --
[_collectionView registerClass:[CustomView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"Footer"];

Step 4> 实现delegate方法,dataSource方法以及布局layout方法
// 指定每一个item的大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    return CGSizeMake(170, 120);
}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section{
    // 如果垂直滚动 view的width与集合视图一致,需要设置高度
    return CGSizeMake(30,30);
}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section{
    return CGSizeMake(30,30);
}

// UIEdgeInsets 描述的是一个视图相对于另一个视图上、左、下、右的距离
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
    return UIEdgeInsetsMake(10,8,10,8);
}


3. 从网络上加载数据,贴到collectionView上
用AFNetworking从网络上获取数据,并把数据贴到collectionView上
#define  kUrlString @"http://open.qyer.com/lastminute/get_lastminute_list?client_id=qyer_ios&client_secret=cd254439208ab658ddf9&v=1&track_user_id=&track_deviceid=E57D6014-1D9F-437C-B9E5-17CF697370FA&track_app_version=5.4.4&track_app_channel=App%20Store&track_device_info=iPhone7,1&track_os=ios%208.1&lat=40.033568&lon=116.358971&app_installtime=1421832230&page_size=20&is_show_pay=1&country_id=0&continent_id=0&max_id=0&times=&product_type=0"









#import "RootViewController.h"
#import "DiscountCell.h"
#import "AFNetworking.h"

#define  kUrlString @"http://open.qyer.com/lastminute/get_lastminute_list?client_id=qyer_ios&client_secret=cd254439208ab658ddf9&v=1&track_user_id=&track_deviceid=E57D6014-1D9F-437C-B9E5-17CF697370FA&track_app_version=5.4.4&track_app_channel=App%20Store&track_device_info=iPhone7,1&track_os=ios%208.1&lat=40.033568&lon=116.358971&app_installtime=1421832230&page_size=20&is_show_pay=1&country_id=0&continent_id=0&max_id=0&times=&product_type=0"

@interface RootViewController () <UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout>

@property (nonatomic, retain) NSMutableArray *dataArray;
@property (nonatomic, retain) UICollectionView *collectionView;
@end

@implementation RootViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    [self addCollectionView];
    [self fetchWebData];
}

- (void)addCollectionView {
    UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
    self.collectionView  = [[[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height) collectionViewLayout:flowLayout] autorelease];
    _collectionView.delegate = self;
    _collectionView.dataSource = self;
    [self.view addSubview:_collectionView];
    
    [_collectionView registerNib:[UINib nibWithNibName:@"DiscountCell" bundle:nil] forCellWithReuseIdentifier:kDiscountCellID];
}

- (void)fetchWebData {
    AFHTTPRequestOperationManager *manager =[AFHTTPRequestOperationManager manager];
    // 服务端的content-Type 为application/json时,可以不写acceptContentTypes
    // manager.responseSerializer.acceptableContentTypes
    [manager GET:kUrlString parameters:nil success:^(AFHTTPRequestOperation *operation, id responseObject) {
        if (responseObject) {
            NSArray *dataArr = responseObject[@"data"];
            for (NSDictionary *subDict in dataArr) {
                Discount *model = [[Discount alloc]init];
                [model setValuesForKeysWithDictionary:subDict];
                for (NSString *key in subDict) {
                    id obj = [subDict objectForKey:key];
                    [model setValue:obj forKey:key];
                }
                
                [_dataArray addObject:model];
            }
            [_collectionView reloadData];
        }
    } failure:^(AFHTTPRequestOperation *operation, NSError *error) {
    }];
}

- (NSMutableArray *)dataArray {
    if (_dataArray == nil) {
        _dataArray = [[NSMutableArray alloc] init];
    }
    return _dataArray;
}

#pragma mark - <UICollectionViewDelegate, UICollectionViewDataSource>
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    //自动反选
    [collectionView deselectItemAtIndexPath:indexPath animated:YES];
}

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 1;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    DiscountCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:kDiscountCellID forIndexPath:indexPath];
    cell.discount = self.dataArray[indexPath.row];
    return cell;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return self.dataArray.count;
}

#pragma mark - flow layout

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    
    return CGSizeMake(150, 180);
}

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
    // return UIEdgeInsetsMake(5, 5, 5, 5);
    return UIEdgeInsetsMake(5, 15, 5, 15);
}


#pragma mark - dealloc
- (void)dealloc {
    [_dataArray release];
    [_collectionView release];
    [super dealloc];
}

@end

————————————————————————————————————————————————————————————————————————————————————————————————
4. XIB 加载viewController

- (void)loadView
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
关联ViewController和xib

这篇关于UICollectionView学习的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/748139

相关文章

HarmonyOS学习(七)——UI(五)常用布局总结

自适应布局 1.1、线性布局(LinearLayout) 通过线性容器Row和Column实现线性布局。Column容器内的子组件按照垂直方向排列,Row组件中的子组件按照水平方向排列。 属性说明space通过space参数设置主轴上子组件的间距,达到各子组件在排列上的等间距效果alignItems设置子组件在交叉轴上的对齐方式,且在各类尺寸屏幕上表现一致,其中交叉轴为垂直时,取值为Vert

Ilya-AI分享的他在OpenAI学习到的15个提示工程技巧

Ilya(不是本人,claude AI)在社交媒体上分享了他在OpenAI学习到的15个Prompt撰写技巧。 以下是详细的内容: 提示精确化:在编写提示时,力求表达清晰准确。清楚地阐述任务需求和概念定义至关重要。例:不用"分析文本",而用"判断这段话的情感倾向:积极、消极还是中性"。 快速迭代:善于快速连续调整提示。熟练的提示工程师能够灵活地进行多轮优化。例:从"总结文章"到"用

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06

学习hash总结

2014/1/29/   最近刚开始学hash,名字很陌生,但是hash的思想却很熟悉,以前早就做过此类的题,但是不知道这就是hash思想而已,说白了hash就是一个映射,往往灵活利用数组的下标来实现算法,hash的作用:1、判重;2、统计次数;

零基础学习Redis(10) -- zset类型命令使用

zset是有序集合,内部除了存储元素外,还会存储一个score,存储在zset中的元素会按照score的大小升序排列,不同元素的score可以重复,score相同的元素会按照元素的字典序排列。 1. zset常用命令 1.1 zadd  zadd key [NX | XX] [GT | LT]   [CH] [INCR] score member [score member ...]

【机器学习】高斯过程的基本概念和应用领域以及在python中的实例

引言 高斯过程(Gaussian Process,简称GP)是一种概率模型,用于描述一组随机变量的联合概率分布,其中任何一个有限维度的子集都具有高斯分布 文章目录 引言一、高斯过程1.1 基本定义1.1.1 随机过程1.1.2 高斯分布 1.2 高斯过程的特性1.2.1 联合高斯性1.2.2 均值函数1.2.3 协方差函数(或核函数) 1.3 核函数1.4 高斯过程回归(Gauss

【学习笔记】 陈强-机器学习-Python-Ch15 人工神经网络(1)sklearn

系列文章目录 监督学习:参数方法 【学习笔记】 陈强-机器学习-Python-Ch4 线性回归 【学习笔记】 陈强-机器学习-Python-Ch5 逻辑回归 【课后题练习】 陈强-机器学习-Python-Ch5 逻辑回归(SAheart.csv) 【学习笔记】 陈强-机器学习-Python-Ch6 多项逻辑回归 【学习笔记 及 课后题练习】 陈强-机器学习-Python-Ch7 判别分析 【学

系统架构师考试学习笔记第三篇——架构设计高级知识(20)通信系统架构设计理论与实践

本章知识考点:         第20课时主要学习通信系统架构设计的理论和工作中的实践。根据新版考试大纲,本课时知识点会涉及案例分析题(25分),而在历年考试中,案例题对该部分内容的考查并不多,虽在综合知识选择题目中经常考查,但分值也不高。本课时内容侧重于对知识点的记忆和理解,按照以往的出题规律,通信系统架构设计基础知识点多来源于教材内的基础网络设备、网络架构和教材外最新时事热点技术。本课时知识

线性代数|机器学习-P36在图中找聚类

文章目录 1. 常见图结构2. 谱聚类 感觉后面几节课的内容跨越太大,需要补充太多的知识点,教授讲得内容跨越较大,一般一节课的内容是书本上的一章节内容,所以看视频比较吃力,需要先预习课本内容后才能够很好的理解教授讲解的知识点。 1. 常见图结构 假设我们有如下图结构: Adjacency Matrix:行和列表示的是节点的位置,A[i,j]表示的第 i 个节点和第 j 个

Node.js学习记录(二)

目录 一、express 1、初识express 2、安装express 3、创建并启动web服务器 4、监听 GET&POST 请求、响应内容给客户端 5、获取URL中携带的查询参数 6、获取URL中动态参数 7、静态资源托管 二、工具nodemon 三、express路由 1、express中路由 2、路由的匹配 3、路由模块化 4、路由模块添加前缀 四、中间件