189 8069 5689
本篇文章为大家展示了怎么在iOS中使用UICollectionView实现列表头部拉伸效果，内容简明扼要并且容易理解，绝对能使你眼前一亮，通过这篇文章的详细介绍希望你能有所收获。
创新互联长期为1000多家客户提供的网站建设服务，团队从业经验10年，关注不同地域、不同群体，并针对不同对象提供差异化的产品和服务；打造开放共赢平台，与合作伙伴共同营造健康的互联网生态环境。为南昌县企业提供专业的网站建设、成都做网站，南昌县网站改版等技术服务。拥有十多年丰富建站经验和众多成功案例,为您定制开发。
OC版本
创建一个类 CustomCollectionViewFlowLayout 继承 UICollectionViewFlowLayout
#import "CustomCollectionViewFlowLayout.h"
@implementation CustomCollectionViewFlowLayout
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
return YES;
}
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect {
UICollectionView *collectionView = [self collectionView];
UIEdgeInsets insets = [collectionView contentInset];
CGPoint offset = [collectionView contentOffset];
CGFloat minY = -insets.top;
NSArray *attributes = [super layoutAttributesForElementsInRect:rect];
if (offset.y < minY) {
CGSize headerSize = [self headerReferenceSize];
CGFloat deltaY = fabsf(offset.y - minY);
for (UICollectionViewLayoutAttributes *attrs in attributes) {
if ([attrs representedElementKind] == UICollectionElementKindSectionHeader) {
CGRect headerRect = [attrs frame];
headerRect.size.height = MAX(minY, headerSize.height + deltaY);
headerRect.origin.y = headerRect.origin.y - deltaY;
[attrs setFrame:headerRect];
break;
}
}
}
return attributes;
}
@end在控制器中使用 先导入头文件
// 创建collectionView CustomCollectionViewFlowLayout *flowLayout=[[CustomCollectionViewFlowLayout alloc] init]; [flowLayout setSectionInset:UIEdgeInsetsMake(0, 0, 10, 0)]; [flowLayout setItemSize:CGSizeMake(kScreenWidth / collectionCellW, kScreenWidth / collectionCellW)]; [flowLayout setHeaderReferenceSize:CGSizeMake(kScreenWidth, userInfoImageViewH)]; [flowLayout setFooterReferenceSize:CGSizeMake(kScreenWidth, 83)]; [flowLayout setScrollDirection:UICollectionViewScrollDirectionVertical]; [flowLayout setMinimumInteritemSpacing:0.0]; [flowLayout setMinimumLineSpacing:0.0]; self.homeCollectionView = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, kScreenHeight - 44)collectionViewLayout:flowLayout]; self.homeCollectionView.backgroundColor = kViewBackgroundColor; self.homeCollectionView.alwaysBounceVertical = YES; self.homeCollectionView.showsVerticalScrollIndicator = NO; //设置代理 self.homeCollectionView.delegate = self; self.homeCollectionView.dataSource = self; [self.view addSubview:self.homeCollectionView]; // 注册表头 [self.homeCollectionView registerClass:[YJHeaderCollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:kCollectionHeaderView]; // 注册表尾 [self.homeCollectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:kCollectionFooterView];
Swift版
喜欢swift 不需要导入头文件那么麻烦
//
// CustomCollectionViewFlowLayout.swift
//
//
// Created by GongHui_YJ on 16/8/4.
// Copyright © 2016年YangJian. All rights reserved.
//
import UIKit
class CustomCollectionViewFlowLayout: UICollectionViewFlowLayout {
override func shouldInvalidateLayoutForBoundsChange(newBounds: CGRect) -> Bool {
return true
}
override func layoutAttributesForElementsInRect(rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
let collectionView = self.collectionView
let insets = collectionView?.contentInset
let offset = collectionView?.contentOffset
let minY = -((insets?.top)!)
let attributesArray = super.layoutAttributesForElementsInRect(rect)
if offset!.y < minY {
let headerSize = self.headerReferenceSize
let deltaY = CGFloat(fabsf(Float((offset?.y)! - CGFloat(minY))))
for attrs:UICollectionViewLayoutAttributes in attributesArray! {
if attrs.representedElementKind == UICollectionElementKindSectionHeader {
var headerRect = attrs.frame
headerRect.size.height = max(minY, headerSize.height + deltaY)
headerRect.origin.y = headerRect.origin.y - deltaY
attrs.frame = headerRect
break
}
}
}
return attributesArray
}
}在控制器 viewDidLoad方法实现
let customFlowLayout = CustomCollectionViewFlowLayout() customFlowLayout.headerReferenceSize = CGSizeMake(kScreenWidth, 203) customFlowLayout.footerReferenceSize = CGSizeMake(kScreenWidth, 83) customFlowLayout.minimumInteritemSpacing = 0 customFlowLayout.minimumLineSpacing = 0 customFlowLayout.itemSize = CGSizeMake(kScreenWidth / 3.000006, kScreenWidth / 3.00006) customFlowLayout.sectionInset = UIEdgeInsetsMake(0, 0, 10, 0) self.homeCollectionView.setCollectionViewLayout(customFlowLayout, animated: true) self.homeCollectionView.backgroundColor = kViewBackgroundColor self.homeCollectionView.alwaysBounceVertical = true let nib = UINib(nibName: "CommonCollectionViewCell", bundle: nil) self.homeCollectionView.registerNib(nib, forCellWithReuseIdentifier: cellId) // 注册表头表尾 let headerNib = UINib(nibName: "HeaderCollectionReusableView", bundle: nil) self.homeCollectionView.registerNib(headerNib, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: collectionHeaderId) self.homeCollectionView.registerClass(UICollectionReusableView.classForCoder(), forSupplementaryViewOfKind: UICollectionElementKindSectionFooter, withReuseIdentifier: collectionFooterId)
上述内容就是怎么在iOS中使用UICollectionView实现列表头部拉伸效果，你们学到知识或技能了吗？如果还想学到更多技能或者丰富自己的知识储备，欢迎关注创新互联行业资讯频道。